diff options
| author | Factiven <[email protected]> | 2023-05-02 14:17:51 +0700 |
|---|---|---|
| committer | Factiven <[email protected]> | 2023-05-02 14:17:51 +0700 |
| commit | 5f2f23eeb62c390182334394a4306b0eda287ffa (patch) | |
| tree | 31792712a12d154af0275f29b65365535f9eafe4 /pages/anime | |
| parent | Switched CORS domain (diff) | |
| download | moopa-5f2f23eeb62c390182334394a4306b0eda287ffa.tar.xz moopa-5f2f23eeb62c390182334394a4306b0eda287ffa.zip | |
Update pre - v3.5.4
> UI adjustment on smaller devices
Diffstat (limited to 'pages/anime')
| -rw-r--r-- | pages/anime/[...id].js | 22 | ||||
| -rw-r--r-- | pages/anime/watch/[...info].js | 6 |
2 files changed, 16 insertions, 12 deletions
diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index 26c42cb..4b759b6 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -447,21 +447,25 @@ export default function Info() { </div> )} </div> - <div className="bg-secondary rounded-sm h-[30px]"> - <div className="flex items-center justify-center h-full gap-10 p-2"> + <div className="bg-secondary rounded-sm xs:h-[30px]"> + <div className="grid grid-cols-3 place-content-center xs:flex items-center justify-center h-full xs:gap-10 p-2 text-sm"> {info && info.status !== "NOT_YET_RELEASED" ? ( <> - <div className="flex-center gap-2"> + <div className="flex-center flex-col xs:flex-row gap-2"> <TvIcon className="w-5 h-5 text-action" /> <h4 className="font-karla">{info?.type}</h4> </div> - <div className="flex-center gap-2"> + <div className="flex-center flex-col xs:flex-row gap-2"> <ArrowTrendingUpIcon className="w-5 h-5 text-action" /> <h4>{info?.averageScore}%</h4> </div> - <div className="flex-center gap-2"> + <div className="flex-center flex-col xs:flex-row gap-2"> <RectangleStackIcon className="w-5 h-5 text-action" /> - <h1>{info?.episodes} Episodes</h1> + {info?.episodes ? ( + <h1>{info?.episodes} Episodes</h1> + ) : ( + <h1>TBA</h1> + )} </div> </> ) : ( @@ -676,8 +680,8 @@ export default function Info() { )} {info?.nextAiringEpisode && ( <div className="flex items-center gap-2"> - <div className="flex items-center gap-4"> - <h1>Next Ep :</h1> + <div className="flex items-center gap-4 text-[10px] xxs:text-sm md:text-base"> + <h1>Next :</h1> <div className="px-5 rounded-sm font-karla font-bold bg-white text-black" // style={color} @@ -741,7 +745,7 @@ export default function Info() { <div className="flex flex-col"> <h1>{epiStatus} while retrieving data</h1> <pre - className={`rounded-md overflow-hidden ${getLanguageClassName( + className={`rounded-md ${getLanguageClassName( "bash" )}`} > diff --git a/pages/anime/watch/[...info].js b/pages/anime/watch/[...info].js index 682e252..41635b8 100644 --- a/pages/anime/watch/[...info].js +++ b/pages/anime/watch/[...info].js @@ -288,7 +288,7 @@ export default function Info({ sessions, id, aniId, provider }) { <div className="min-h-screen mt-3 md:mt-0 flex flex-col lg:gap-0 gap-5 lg:flex-row lg:py-10 lg:px-10 justify-start w-screen"> <div className="w-screen lg:w-[67%]"> {loading ? ( - <div className="h-auto aspect-video z-20"> + <div className="aspect-video z-20"> <VideoPlayer key={id} data={epiData} @@ -304,7 +304,7 @@ export default function Info({ sessions, id, aniId, provider }) { /> </div> ) : ( - <div className="lg:h-[693px] h-[225px] xs:h-[281px] bg-black" /> + <div className="aspect-video bg-black" /> )} <div> {data ? ( @@ -386,7 +386,7 @@ export default function Info({ sessions, id, aniId, provider }) { <div className="row-start-2"> {data ? data.studios : <Skeleton width={80} />} </div> - <div className="grid col-start-2 place-content-end relative"> + <div className="hidden xxs:grid col-start-2 place-content-end relative"> <div className="" onClick={() => setOpen(true)}> <svg xmlns="http://www.w3.org/2000/svg" |