Reader: contain img inside aspect-ratio placeholder

Prior rendering let <img> flow naturally (h-auto), so subpixel aspect
mismatches between DB dims and natural file dims caused img to over-
flow the placeholder div — manifesting as gaps or content overlap
between consecutive pages. Switching to absolute inset-0 +
object-contain pins the img to div dimensions regardless.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
yiekheng 2026-04-16 20:12:41 +08:00
parent dea57e6b28
commit 0923dc1dce

View File

@ -659,7 +659,7 @@ export function PageReader({
src={url}
alt={`Page ${p.number}`}
fetchPriority={isVisible ? "high" : "low"}
className="w-full h-auto block [-webkit-touch-callout:none]"
className="absolute inset-0 w-full h-full object-contain [-webkit-touch-callout:none]"
draggable={false}
onError={() => {
setImages((prev) => {