feat: mobile improvements — hamburger menu, responsive typography, grid fixes

This commit is contained in:
Manuel
2026-05-08 01:24:57 +02:00
parent c3667512e5
commit 58eb6dc952
6 changed files with 189 additions and 23 deletions
+24 -9
View File
@@ -501,22 +501,21 @@
.whatsapp-float {
position: fixed;
right: var(--space-8);
bottom: var(--space-8);
right: var(--space-4);
bottom: var(--space-4);
z-index: 60;
display: inline-flex;
align-items: center;
gap: var(--space-4);
gap: var(--space-3);
background: var(--color-primary);
color: var(--color-on-primary);
padding: var(--space-4) var(--space-6);
padding-left: var(--space-8);
padding: var(--space-3) var(--space-4);
border-radius: var(--radius-full);
box-shadow: var(--shadow-lg);
font-family: var(--font-sans);
font-size: var(--text-label-caps);
font-size: 0.65rem;
font-weight: 600;
letter-spacing: 0.15em;
letter-spacing: 0.12em;
text-transform: uppercase;
text-decoration: none;
transition: transform 200ms, box-shadow 200ms;
@@ -532,13 +531,29 @@
}
.whatsapp-float-icon {
width: 2.5rem;
height: 2.5rem;
width: 2rem;
height: 2rem;
border-radius: var(--radius-full);
background: rgb(255 255 255 / 15%);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
@media (min-width: 48rem) {
.whatsapp-float {
right: var(--space-8);
bottom: var(--space-8);
padding: var(--space-4) var(--space-6);
padding-left: var(--space-8);
font-size: var(--text-label-caps);
gap: var(--space-4);
}
.whatsapp-float-icon {
width: 2.5rem;
height: 2.5rem;
}
}
/* ─────────────────────────────────────────────
+3 -3
View File
@@ -22,9 +22,9 @@
--font-serif: 'Noto Serif', Georgia, serif;
/* Type scale */
--text-display: clamp(2.5rem, 6vw, 4rem);
--text-headline-lg: clamp(1.75rem, 4vw, 2.5rem);
--text-headline-md: 2rem;
--text-display: clamp(1.875rem, 5vw, 4rem);
--text-headline-lg: clamp(1.5rem, 4vw, 2.5rem);
--text-headline-md: clamp(1.375rem, 3.5vw, 2rem);
--text-label-caps: 0.75rem;
--text-base: 1rem;
--text-sm: 0.875rem;