From 42ebce932778652cf994f896f25765b8f99c8d11 Mon Sep 17 00:00:00 2001 From: Tobias Leuschner Date: Sun, 22 Feb 2026 15:01:47 +0100 Subject: [PATCH] Passe die vertikale Positionierung der Overlay-Elemente an, um die Animation und Sichtbarkeit zu verbessern --- css/style.css | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/css/style.css b/css/style.css index cbf48b9..7291c9e 100644 --- a/css/style.css +++ b/css/style.css @@ -109,7 +109,7 @@ body::before { width: 88px; height: 88px; border-radius: 50%; - transform: translate(-50%, calc(-50% - 40px)); + transform: translate(-50%, calc(-50% - 33px)); display: flex; align-items: center; justify-content: center; @@ -168,13 +168,13 @@ body::before { 0 0 0 3px rgba(52,211,153,0.28), 0 0 48px rgba(52,211,153,0.35), 0 8px 30px rgba(0,0,0,0.4); - transform: translate(-50%, calc(-50% - 40px)) scale(1.08); + transform: translate(-50%, calc(-50% - 33px)) scale(1.08); } /* Lost: shrink and fade */ .finger.lost { opacity: 0; - transform: translate(-50%, calc(-50% - 40px)) scale(0.45); + transform: translate(-50%, calc(-50% - 33px)) scale(0.45); transition: opacity 380ms ease, transform 380ms cubic-bezier(0.4,0,0.6,1); } @@ -182,9 +182,9 @@ body::before { .pulse { animation: pulse 1400ms ease-in-out infinite; } @keyframes pulse { - 0% { transform: translate(-50%, calc(-50% - 40px)) scale(1.08); } - 50% { transform: translate(-50%, calc(-50% - 40px)) scale(1.18); box-shadow: 0 0 0 5px rgba(52,211,153,0.18), 0 0 64px rgba(52,211,153,0.4), 0 8px 30px rgba(0,0,0,0.4); } - 100% { transform: translate(-50%, calc(-50% - 40px)) scale(1.08); } + 0% { transform: translate(-50%, calc(-50% - 33px)) scale(1.08); } + 50% { transform: translate(-50%, calc(-50% - 33px)) scale(1.18); box-shadow: 0 0 0 5px rgba(52,211,153,0.18), 0 0 64px rgba(52,211,153,0.4), 0 8px 30px rgba(0,0,0,0.4); } + 100% { transform: translate(-50%, calc(-50% - 33px)) scale(1.08); } } /* ── Install hint banner ── */