admin/gw-svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v4

Browse Source
This commit is contained in:
ponzischeme89
2026-05-18 09:43:29 +12:00
parent b950229003
commit 6ff970015f
189 changed files with 18603 additions and 2727 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/styles/responsive.css
+109 -126
View File
@@ -1,24 +1,4 @@
@media (max-width: 1024px) {
nav,
.mobile-menu {
padding-left: var(--space-container-x-tablet);
padding-right: var(--space-container-x-tablet);
}
.services-inner,
.values-inner,
.testimonials-inner,
.info-inner,
.form-inner {
padding-left: var(--space-container-x-tablet);
padding-right: var(--space-container-x-tablet);
}
footer {
padding-left: var(--space-container-x-tablet);
padding-right: var(--space-container-x-tablet);
}
.hero-text h1 {
font-size: 40px;
}
@@ -66,8 +46,8 @@
}
header {
background: #fff;
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
background: var(--surface-page);
border-bottom: 1px solid var(--border-muted);
}
nav {
@@ -91,12 +71,12 @@
display: inline-flex;
justify-self: center;
align-self: center;
width: 40px;
height: 40px;
min-height: 40px;
width: 44px;
height: 44px;
min-height: 44px;
padding: 0;
background: rgba(33, 48, 33, 0.1);
color: var(--gw-green);
background: rgba(var(--brand-rgb), 0.1);
color: var(--text-brand);
}
.mobile-phone .icon {
@@ -125,13 +105,19 @@
}
.instagram-icon {
color: #0a304e;
color: rgb(var(--navy-rgb));
font-size: 22px;
}
.hamburger {
display: flex;
color: #2e3031;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
min-height: 44px;
padding: 0;
color: var(--text);
grid-column: 4;
justify-self: end;
}
@@ -143,13 +129,13 @@
flex-direction: column;
gap: 0;
padding: 10px 12px 14px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.985), rgba(248, 248, 245, 0.98));
border: 1px solid rgba(33, 48, 33, 0.08);
background: linear-gradient(180deg, rgba(var(--white-rgb), 0.985), rgba(248, 248, 245, 0.98));
border: 1px solid var(--border-brand-soft);
border-top: 0;
border-radius: 0 0 24px 24px;
box-shadow:
0 18px 32px rgba(17, 20, 24, 0.12),
0 6px 14px rgba(17, 20, 24, 0.05);
var(--shadow-menu),
var(--shadow-menu-soft);
opacity: 0;
transform: translateY(-10px) scale(0.992);
transition:
@@ -164,7 +150,7 @@
inset: var(--mobile-menu-top, 0px) 0 0;
z-index: 120;
padding: 0 0 max(20px, env(safe-area-inset-bottom));
background: rgba(17, 20, 24, 0.04);
background: var(--surface-scrim);
pointer-events: none;
opacity: 0;
visibility: hidden;
@@ -207,13 +193,13 @@
min-height: 48px;
padding: 9px 12px;
border-radius: 16px;
border: 1px solid rgba(33, 48, 33, 0.06);
background: rgba(255, 255, 255, 0.78);
color: var(--gw-green);
border: 1px solid rgba(var(--brand-rgb), 0.06);
background: var(--surface-disabled);
color: var(--text-brand);
text-decoration: none;
opacity: 0;
animation: mobileMenuItemIn 220ms ease-out forwards;
box-shadow: 0 2px 10px rgba(17, 20, 24, 0.03);
box-shadow: var(--shadow-sm);
-webkit-tap-highlight-color: transparent;
}
@@ -232,10 +218,10 @@
width: 32px;
height: 32px;
border-radius: 11px;
background: var(--gw-green);
color: var(--yellow);
background: var(--surface-brand);
color: var(--text-accent);
font-size: 13px;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
box-shadow: inset 0 0 0 1px rgba(var(--white-rgb), 0.04);
}
.mobile-menu-link-label {
@@ -243,20 +229,20 @@
font-size: 13px;
font-weight: 700;
line-height: 1.2;
color: var(--gw-green);
color: var(--text-brand);
min-width: 0;
letter-spacing: -0.02em;
}
:global(.mobile-menu-link-arrow) {
font-size: 12px;
color: rgba(33, 48, 33, 0.42);
color: var(--text-brand-quiet);
}
.mobile-menu-links a.mobile-link-active {
background: linear-gradient(180deg, rgba(255, 209, 0, 0.2), rgba(255, 209, 0, 0.1));
border-color: rgba(255, 209, 0, 0.28);
box-shadow: 0 6px 16px rgba(255, 209, 0, 0.08);
background: linear-gradient(180deg, var(--surface-accent-selected), var(--surface-accent-muted));
border-color: var(--border-accent-muted);
box-shadow: var(--shadow-highlight);
}
body.mobile-menu-open {
@@ -290,9 +276,9 @@
background: linear-gradient(
to bottom,
transparent 22%,
rgba(33, 48, 33, 0.45) 48%,
rgba(33, 48, 33, 0.88) 65%,
#213021 78%
rgba(var(--brand-rgb), 0.45) 48%,
rgba(var(--brand-rgb), 0.88) 65%,
var(--surface-brand) 78%
);
}
@@ -320,7 +306,7 @@
max-width: none;
margin: 0;
object-fit: cover;
object-position: 43% center;
object-position: 37% center;
transform: none;
}
@@ -333,7 +319,7 @@
width: 100%;
max-width: none;
margin: 0;
padding: 0 26px 36px;
padding: 0 var(--space-container-x-mobile) 36px;
}
.hero-text {
@@ -347,9 +333,9 @@
.hero-kicker {
margin: 0 0 8px;
font-size: 10px;
letter-spacing: 0.13em;
color: rgba(255, 255, 255, 0.48);
font-size: 11px;
letter-spacing: var(--tracking-eyebrow);
color: rgba(var(--white-rgb), 0.72);
}
.hero-text h1,
@@ -365,7 +351,7 @@
.hero-text h1 .hero-heading-mobile {
display: block;
color: #fff;
color: var(--text-inverse);
font-family: var(--font-head);
font-size: 40px;
font-weight: 800;
@@ -390,16 +376,34 @@
.hero-chip,
.hero-trust-chip {
min-height: 34px;
padding: 8px 12px;
min-height: 44px;
padding: 10px 14px;
font-size: 11px;
background: rgba(255, 255, 255, 0.09);
border-color: rgba(255, 255, 255, 0.14);
background: rgba(var(--white-rgb), 0.09);
border-color: var(--border-inverse-strong);
}
.hero-trust-chip {
gap: 8px;
padding: 6px 14px 6px 6px;
}
.hero-trust-mark {
width: 24px;
height: 24px;
}
.hero-trust-logo {
width: 12px;
height: 13px;
width: 13px;
height: auto;
}
.hero-trust-stars {
font-size: 10px;
}
.hero-trust-label {
font-size: 11px;
}
.hero-buttons {
@@ -429,51 +433,55 @@
}
.hero-buttons .btn-yellow:active {
background: #e6bb00;
background: var(--surface-accent-strong);
}
#intro {
padding: 20px 24px;
padding: 44px var(--space-container-x-mobile) 40px;
}
.intro-trust-badge {
grid-template-columns: auto minmax(0, 1fr);
gap: 12px;
align-items: center;
padding: 12px 14px;
border-radius: 999px;
background: rgba(33, 48, 33, 0.06);
box-shadow: inset 0 0 0 1px rgba(17, 20, 24, 0.06);
.intro-inner {
grid-template-columns: minmax(0, 1fr);
gap: 28px;
align-items: start;
}
.intro-trust-mark {
width: 36px;
height: 36px;
font-size: 18px;
box-shadow: none;
.intro-kicker {
gap: 10px;
margin-bottom: 14px;
font-size: 11px;
letter-spacing: 0.16em;
}
.intro-kicker-rule {
width: 24px;
}
.intro-headline {
font-size: clamp(26px, 7.2vw, 34px);
max-width: none;
}
.intro-trust {
align-items: flex-start;
padding-left: 0;
padding-top: 22px;
border-left: none;
border-top: 1px solid rgba(var(--white-rgb), 0.12);
width: 100%;
}
.intro-google {
padding: 8px 14px 8px 8px;
}
.intro-google-mark {
width: 32px;
height: 32px;
}
.intro-google-logo {
width: 18px;
}
#intro p {
font-size: 13px;
line-height: 1.3;
font-weight: 700;
margin-bottom: 0;
}
.intro-trust-copy-desktop {
display: none;
}
.intro-trust-copy-mobile {
display: inline;
}
.intro-trust-meta {
display: none;
width: 16px;
}
.testimonials-grid,
@@ -511,7 +519,8 @@
}
.booking-trust-chip {
padding: 8px 12px;
min-height: 44px;
padding: 10px 14px;
font-size: 13px;
}
@@ -611,12 +620,6 @@
gap: 12px 18px;
}
.booking-inline-switch {
flex-direction: column;
text-align: center;
gap: 4px;
}
.booking-check-option {
font-size: 15px;
}
@@ -719,9 +722,9 @@
}
.mobile-phone {
width: 38px;
height: 38px;
min-height: 38px;
width: 44px;
height: 44px;
min-height: 44px;
}
.hero-text h1,
@@ -735,26 +738,6 @@
line-height: 1.12;
}
.hero-buttons {
flex-direction: row;
gap: 8px;
padding-right: 0;
}
.hero-buttons .btn-yellow {
flex: 1 1 0;
width: 0;
margin-right: 0 !important;
padding: 13px 9px;
font-size: 12px;
line-height: 1.1;
}
.hero-secondary-link {
width: auto;
flex: 0 0 auto;
font-size: 12px;
}
}
@media (min-width: 769px) {