added Jodes

This commit is contained in:
Krittin SETDHAVANICH 2023-06-28 14:43:36 +07:00
parent 4ce3d20455
commit 2edd07bc57
2 changed files with 114 additions and 9 deletions

View File

@ -14,6 +14,7 @@ import Typography from '@mui/material/Typography';
import Container from '@mui/material/Container'; import Container from '@mui/material/Container';
import Link from '@mui/material/Link'; import Link from '@mui/material/Link';
import {createTheme, ThemeProvider} from '@mui/material/styles'; import {createTheme, ThemeProvider} from '@mui/material/styles';
import cards from './Card';
function Copyright() { function Copyright() {
return ( return (
@ -28,8 +29,6 @@ function Copyright() {
); );
} }
const cards = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const defaultTheme = createTheme(); const defaultTheme = createTheme();
export default function App() { export default function App() {
@ -107,7 +106,7 @@ export default function App() {
{/*# TODO:Edit the Jode here */} {/*# TODO:Edit the Jode here */}
{cards.map((card) => ( {cards.map((card) => (
<Grid item key={card} xs={12} sm={6} md={4}> <Grid item xs={12} sm={6} md={4}>
<Card <Card
sx={{ sx={{
height: '100%', height: '100%',
@ -127,17 +126,14 @@ export default function App() {
<CardContent sx={{flexGrow: 1}}> <CardContent sx={{flexGrow: 1}}>
<Typography gutterBottom variant="h5" component="h2" <Typography gutterBottom variant="h5" component="h2"
color="#7DD6F6"> color="#7DD6F6">
Jode1 {card.title}
</Typography> </Typography>
<Typography color="aliceblue"> <Typography color="aliceblue">
This is a media card. You can use this section to {card.describe}
describe the
content.
</Typography> </Typography>
</CardContent> </CardContent>
<CardActions> <CardActions>
<Button size="small" sx={{color: "#69ACCD"}}>View</Button> <Button size="small" sx={{color: "#69ACCD"}}><a href={card.link}>View</a></Button>
<Button size="small">Edit</Button>
</CardActions> </CardActions>
</Card> </Card>
</Grid> </Grid>

109
src/Card.jsx Normal file
View File

@ -0,0 +1,109 @@
const cards = [
{
'title': 'Syntax',
'describe': 'Mai tum leaw',
'link': 'https://elabsheet.org/elab/taskpads/show/jr070sqaqp/'
},
{
'title': 'Variables',
'describe': 'Mai tum leaw',
'link': 'https://elabsheet.org/elab/taskpads/change/jr070sqaqp/yqxiczozva/'
},
{
'title': 'Data Type 01',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Data Type 02',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Data Type 03',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Numbers, Casting, String',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Strings',
'describe': 'Mai tum leaw',
'link': 'https://elabsheet.org/elab/taskpads/change/4k422fwoou/v49ajp3qgh/'
},
{
'title': 'Boolean 01',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Boolean 02',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Operators 01',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Operators 02',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Lists',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Tuples',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Sets',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Dictionaries',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'If Else 01',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'If Else 02',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'If Else 03',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'While Loops',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'For Loops',
'describe': 'Mai tum leaw',
'link': 'www.'
},
{
'title': 'Functions',
'describe': 'Mai tum leaw',
'link': 'www.'
}
]
export default cards;