ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

migrate ChapterCard.tsx to Mui 5 (#80)

Browse Source
This commit is contained in:
Aria Moradi
2021-11-15 19:33:35 +03:30
committed by GitHub
parent 556d7086d1
commit 2911844681
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/ChapterCard.tsx
View File

@@ -18,6 +18,7 @@ import MenuItem from '@mui/material/MenuItem';
import BookmarkIcon from '@mui/icons-material/Bookmark'; import BookmarkIcon from '@mui/icons-material/Bookmark';
import client from 'util/client'; import client from 'util/client';
import { Box } from '@mui/system';
interface IProps{ interface IProps{
chapter: IChapter chapter: IChapter
@@ -102,7 +103,7 @@ export default function ChapterCard(props: IProps) {
padding: 2, padding: 2,
}} }}
> >
<div style={{ display: 'flex' }}> <Box sx={{ display: 'flex' }}>
<div style={{ display: 'flex', flexDirection: 'column' }}> <div style={{ display: 'flex', flexDirection: 'column' }}>
<Typography variant="h5" component="h2"> <Typography variant="h5" component="h2">
<span style={{ color: theme.palette.primary.dark }}> <span style={{ color: theme.palette.primary.dark }}>
@@ -117,7 +118,7 @@ export default function ChapterCard(props: IProps) {
{downloadStatusString} {downloadStatusString}
</Typography> </Typography>
</div> </div>
</div> </Box>
<IconButton aria-label="more" onClick={handleClick} size="large"> <IconButton aria-label="more" onClick={handleClick} size="large">
<MoreVertIcon /> <MoreVertIcon />
@@ -131,9 +132,9 @@ export default function ChapterCard(props: IProps) {
onClose={handleClose} onClose={handleClose}
> >
{downloadStatusString.endsWith('Downloaded') {downloadStatusString.endsWith('Downloaded')
&& <MenuItem onClick={deleteChapter}>Delete</MenuItem>} && <MenuItem onClick={deleteChapter}>Delete</MenuItem>}
{downloadStatusString.length === 0 {downloadStatusString.length === 0
&& <MenuItem onClick={downloadChapter}>Download</MenuItem> } && <MenuItem onClick={downloadChapter}>Download</MenuItem> }
<MenuItem onClick={() => sendChange('bookmarked', !chapter.bookmarked)}> <MenuItem onClick={() => sendChange('bookmarked', !chapter.bookmarked)}>
{chapter.bookmarked && 'Remove bookmark'} {chapter.bookmarked && 'Remove bookmark'}
{!chapter.bookmarked && 'Bookmark'} {!chapter.bookmarked && 'Bookmark'}