This commit is contained in:
2026-02-06 14:03:59 +01:00
parent 371c3da66c
commit 40c67c99f3
3 changed files with 284 additions and 225 deletions

View File

@@ -18,6 +18,8 @@ body {
background-color: var(--primary-light);
color: var(--primary-dark);
min-height: 100vh;
position: relative;
overflow-x: hidden;
}
/* Hexagonal Canvas Background */
@@ -56,12 +58,8 @@ body {
background-color 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
/* Performance optimizations */
will-change: height, padding, transform;
transform: translateZ(0);
backface-visibility: hidden;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
contain: layout style paint;
/* Prevent sub-pixel rendering issues */
box-shadow: 0 0 0 rgba(0,0,0,0);
@@ -128,8 +126,7 @@ body {
.logo {
height: 50px;
width: auto;
transition: height 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
will-change: height;
transition: height 0.3s ease-out;
}
.top-banner.scrolled .logo {
@@ -149,7 +146,6 @@ body {
justify-content: center;
align-items: center;
transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
will-change: width, height;
}
.top-banner.scrolled .menu-toggle,
@@ -166,7 +162,6 @@ body {
border-radius: 25px;
transition: font-size 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
padding 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
will-change: font-size, padding;
}
.top-banner.scrolled .opening-hours {
@@ -354,7 +349,6 @@ body {
padding: 10px 20px;
border-radius: 25px;
transition: font-size 0.25s cubic-bezier(0.4, 0, 0.2, 1), padding 0.25s cubic-bezier(0.4, 0, 0.2, 1);
will-change: font-size, padding;
}
.menu-toggle {
@@ -371,7 +365,6 @@ body {
justify-content: center;
gap: 5px;
transition: background 0.3s ease, color 0.3s ease, width 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s cubic-bezier(0.4, 0, 0.2, 1);
will-change: width, height;
}
#cursorToggle {
@@ -387,7 +380,6 @@ body {
justify-content: center;
padding: 0;
transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s ease, border-color 0.3s ease;
will-change: width, height;
}
.cursor-icon {