troogs/date-wizard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: optimize mobile vertical layout and bottom clearance for continue bar

Browse Source
This commit is contained in:
troogs
2026-08-12 12:52:45 +02:00
parent 28f402674a
commit b230918903
2 changed files with 17 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
style.css
+9 -6
View File
@@ -35,6 +35,9 @@ html {
body {
margin: 0;
min-height: 100vh;
min-height: 100dvh;
display: flex;
flex-direction: column;
font-family: var(--font-body);
font-size: clamp(1rem, 3.6vw, 1.15rem);
line-height: 1.5;
@@ -64,7 +67,8 @@ p {
width: 100%;
max-width: 480px;
margin: 0 auto;
padding: 24px 20px 40px;
padding: 20px 20px 32px;
flex: 1;
}
/* Buttons -------------------------------------------------------------- */
@@ -160,9 +164,8 @@ p {
/* Fixed bottom bar for a primary continue action ------------------------- */
body.has-continue-bar,
body.has-continue-bar .container {
padding-bottom: calc(130px + env(safe-area-inset-bottom));
body.has-continue-bar main.container {
padding-bottom: calc(110px + env(safe-area-inset-bottom));
}
.continue-bar {
@@ -171,8 +174,8 @@ body.has-continue-bar .container {
right: 0;
bottom: 0;
z-index: 100;
padding: 16px 20px calc(16px + env(safe-area-inset-bottom));
background: linear-gradient(0deg, var(--color-bg) 70%, rgba(255, 245, 247, 0));
padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
background: linear-gradient(180deg, rgba(255, 245, 247, 0) 0%, var(--color-bg) 50%);
pointer-events: none;
}