From 81ddb781ca6c089f4fdecd7cceb282821ebe1b27 Mon Sep 17 00:00:00 2001 From: Kroonk Date: Wed, 20 May 2026 18:24:11 +0200 Subject: [PATCH] Improve landing page mobile performance --- index.html | 5 +---- style.css | 27 +++++++++++++++++++++++++-- 2 files changed, 26 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 89db1b2..45e0d8d 100644 --- a/index.html +++ b/index.html @@ -4,10 +4,7 @@ MischLabs - Services - - - - +
diff --git a/style.css b/style.css index ad5c4af..1bafba6 100644 --- a/style.css +++ b/style.css @@ -25,7 +25,7 @@ html { } body { - font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; + font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; @@ -34,13 +34,15 @@ body { align-items: center; overflow-x: hidden; position: relative; + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; } /* ===== Background Glows ===== */ .bg-glow { position: fixed; border-radius: 50%; - filter: blur(120px); + filter: blur(80px); opacity: 0.15; pointer-events: none; z-index: 0; @@ -181,6 +183,8 @@ main { position: relative; overflow: visible; isolation: isolate; + touch-action: manipulation; + -webkit-tap-highlight-color: transparent; } .card > * { @@ -316,6 +320,10 @@ footer p { /* ===== Responsive ===== */ @media (max-width: 768px) { + .bg-glow { + display: none; + } + header { padding: 3rem 1.5rem 1.5rem; } @@ -335,6 +343,11 @@ footer p { .card { padding: 1.25rem; + animation: none; + transition: + border-color 0.2s ease, + background-color 0.2s ease, + box-shadow 0.2s ease; } .card-icon { @@ -353,6 +366,16 @@ footer p { } } +@media (hover: none) { + .card::after { + display: none; + } + + .card:hover { + transform: none; + } +} + @media (max-width: 480px) { .card-banner { flex-direction: column;