Snap on body (not html) + 100dvh + font -5%

- Move scroll-snap-type to body, html overflow hidden
  (root-element snap was unreliable across browsers)
- 100dvh handles iOS dynamic viewport
- scroll-snap-stop: normal (always was too strict, blocked fast scroll)
- font-size clamp -5% (17–26.6px)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Telecom 2026-05-21 21:44:21 +05:00
parent 5c1ab55af0
commit 5770bf29f9

View File

@ -108,12 +108,16 @@
html, body { html, body {
height: 100%; height: 100%;
margin: 0;
} }
html { html {
scroll-behavior: smooth; scroll-behavior: smooth;
font-size: clamp(18px, 1.6vw, 28px); font-size: clamp(17px, 1.52vw, 26.6px); /* -5% */
scroll-snap-type: y mandatory; overflow: hidden;
}
body {
overflow-y: scroll; overflow-y: scroll;
scroll-snap-type: y mandatory;
scroll-padding-top: 0; scroll-padding-top: 0;
} }
@ -122,8 +126,8 @@ html {
section.section, section.section,
.dark-section { .dark-section {
scroll-snap-align: start; scroll-snap-align: start;
scroll-snap-stop: always; scroll-snap-stop: normal;
min-height: 100vh; min-height: 100dvh;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
@ -189,8 +193,6 @@ body {
font-family: 'Lora', Georgia, serif !important; font-family: 'Lora', Georgia, serif !important;
background: var(--page-bg); background: var(--page-bg);
padding: 0; padding: 0;
margin: 0;
overflow: visible;
} }
.frame { gap: 0; min-height: 100dvh; display: block; } .frame { gap: 0; min-height: 100dvh; display: block; }