Center manga page thumbnail loading placeholder

2024-09-01 00:42:24 +02:00
parent 716f1df073
commit 05bdcf3905
1 changed files with 17 additions and 1 deletions
--- a/src/components/manga/MangaDetails.tsx
+++ b/src/components/manga/MangaDetails.tsx
@@ -122,7 +122,23 @@ const Thumbnail = ({ manga }: { manga: Partial<MangaThumbnailInfo> }) => {
                    },
                }}
            >
-                <SpinnerImage src={Mangas.getThumbnailUrl(manga)} alt="Manga Thumbnail" />
+                <SpinnerImage
+                    src={Mangas.getThumbnailUrl(manga)}
+                    alt="Manga Thumbnail"
+                    spinnerStyle={{
+                        borderRadius: 0.5,
+                        width: '150px',
+                        height: '225px',
+                        [theme.breakpoints.up('lg')]: {
+                            width: '200px',
+                            height: '300px',
+                        },
+                        [theme.breakpoints.up('xl')]: {
+                            width: '300px',
+                            height: '450px',
+                        },
+                    }}
+                />
                <Stack
                    {...bindTrigger(popupState)}
                    sx={{