diff --git a/css/styles.css b/css/styles.css index 8b38961..68c9c65 100644 --- a/css/styles.css +++ b/css/styles.css @@ -555,6 +555,23 @@ body { color: #ffffff; } +#btn-locate-me.active { + background: rgba(6, 182, 212, 0.28); + border-color: var(--accent-cyan); + box-shadow: 0 0 12px rgba(6, 182, 212, 0.45); +} + +#btn-locate-me.active svg { + animation: pulseGps 1.8s ease-in-out infinite; + color: #38bdf8; +} + +@keyframes pulseGps { + 0% { transform: scale(1); filter: drop-shadow(0 0 0 rgba(6, 182, 212, 0)); } + 50% { transform: scale(1.18); filter: drop-shadow(0 0 6px rgba(6, 182, 212, 0.9)); } + 100% { transform: scale(1); filter: drop-shadow(0 0 0 rgba(6, 182, 212, 0)); } +} + .map-search-box { display: flex; gap: 6px; diff --git a/index.html b/index.html index c86359d..0f18a49 100644 --- a/index.html +++ b/index.html @@ -10,11 +10,11 @@ - - - - - + + + + + @@ -24,8 +24,8 @@ - - + + @@ -36,7 +36,7 @@ - + @@ -54,7 +54,7 @@ - +
@@ -1156,11 +1156,11 @@ - - - - - + + + + +