• Adjust ScrollArea height in like page from 16rem to 20rem
• Adjust ScrollArea height in popular ranking from 20rem to 22rem
• Fix layout spacing issues across multiple pages

Increase like page ScrollArea height

• Updated ScrollArea height calculation from h-[calc(100vh-16rem)] to h-[calc(100vh-20rem)]
• Increases the scrollable content area by 4rem to improve layout spacing

apps/web/src/app/info/like/page.tsx

Increase popular ranking ScrollArea height

• Updated ScrollArea height calculation from h-[calc(100vh-20rem)] to h-[calc(100vh-22rem)]
• Increases the scrollable content area by 2rem to improve layout spacing

apps/web/src/app/popular/PopularRankingList.tsx

Description

LikePage sets its ScrollArea height with calc(100vh-20rem) even though the app root is sized
with h-dvh and has a fixed footer. When dvh is smaller than vh, the ScrollArea can become
taller than the app container and end up with content obscured/extra scrolling near the bottom.

Code

apps/web/src/app/info/like/page.tsx[48]

+      <ScrollArea className="h-[calc(100vh-20rem)]">

Evidence

The app container is explicitly sized to the dynamic viewport (h-dvh), but this page’s ScrollArea
is explicitly sized to the layout viewport (100vh). With a fixed footer, any overflow caused by
vh being larger than dvh can result in bottom content being covered or requiring extra
scrolling.

apps/web/src/app/layout.tsx[125-145]
apps/web/src/Footer.tsx[27-71]
apps/web/src/app/info/like/page.tsx[35-60]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
`LikePage` uses `h-[calc(100vh-20rem)]` while the app shell uses `h-dvh` and a fixed footer. Mixing `vh` and `dvh` can make the ScrollArea taller than its container on dynamic-viewport browsers.

## Issue Context
The root layout is intentionally using dynamic viewport height (`h-dvh`), so children should avoid hard-coding `100vh` if they are meant to fit within that container.

## Fix Focus Areas
- apps/web/src/app/info/like/page.tsx[48-48]

### Suggested change
- Replace `100vh` with `100dvh` in the calc: `h-[calc(100dvh-20rem)]`.
- (Optional, more robust) Refactor the page layout to use a flex column with the scroll region as `flex-1` instead of a viewport calc.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools