Update download queue styling
This commit is contained in:
@@ -23,6 +23,7 @@ import { Link } from 'react-router-dom';
|
|||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import DeleteSweepIcon from '@mui/icons-material/DeleteSweep';
|
import DeleteSweepIcon from '@mui/icons-material/DeleteSweep';
|
||||||
import { Virtuoso } from 'react-virtuoso';
|
import { Virtuoso } from 'react-virtuoso';
|
||||||
|
import CardContent from '@mui/material/CardContent';
|
||||||
import { requestManager } from '@/lib/requests/RequestManager.ts';
|
import { requestManager } from '@/lib/requests/RequestManager.ts';
|
||||||
import { StrictModeDroppable } from '@/lib/StrictModeDroppable';
|
import { StrictModeDroppable } from '@/lib/StrictModeDroppable';
|
||||||
import { makeToast } from '@/components/util/Toast';
|
import { makeToast } from '@/components/util/Toast';
|
||||||
@@ -54,27 +55,28 @@ const DownloadChapterItem = ({
|
|||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box {...provided.draggableProps} {...provided.dragHandleProps} ref={provided.innerRef} sx={{ pt: 1, px: 1 }}>
|
<Box {...provided.draggableProps} {...provided.dragHandleProps} ref={provided.innerRef} sx={{ p: 1, pb: 0 }}>
|
||||||
<Card
|
<Card
|
||||||
sx={{
|
sx={{
|
||||||
backgroundColor: isDragging ? 'custom.light' : undefined,
|
backgroundColor: isDragging ? 'custom.light' : undefined,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<CardActionArea
|
<CardActionArea component={Link} to={`/manga/${item.manga.id}`}>
|
||||||
component={Link}
|
<CardContent
|
||||||
to={`/manga/${item.manga.id}`}
|
|
||||||
sx={{
|
sx={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
p: 1,
|
p: 1.5,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<IconButton sx={{ pointerEvents: 'none' }}>
|
<IconButton sx={{ pointerEvents: 'none' }}>
|
||||||
<DragHandle />
|
<DragHandle />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
<Stack sx={{ flex: 1, ml: 1 }} direction="column">
|
<Stack sx={{ flex: 1, ml: 1 }} direction="column">
|
||||||
<Typography variant="h6">{item.manga.title}</Typography>
|
<Typography variant="h6" component="h3">
|
||||||
<Typography variant="caption" display="block" gutterBottom>
|
{item.manga.title}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="caption" display="block">
|
||||||
{item.chapter.name}
|
{item.chapter.name}
|
||||||
</Typography>
|
</Typography>
|
||||||
</Stack>
|
</Stack>
|
||||||
@@ -91,6 +93,7 @@ const DownloadChapterItem = ({
|
|||||||
<DeleteIcon />
|
<DeleteIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
</CardContent>
|
||||||
</CardActionArea>
|
</CardActionArea>
|
||||||
</Card>
|
</Card>
|
||||||
</Box>
|
</Box>
|
||||||
|
|||||||
Reference in New Issue
Block a user