speed indicator and bigger speed zone

This commit is contained in:
2026-05-15 02:56:48 +02:00
parent 49698f56bf
commit 80a05e2672
2 changed files with 20 additions and 3 deletions

View File

@@ -406,6 +406,15 @@
.loader-sub { font-size: .82rem; color: rgba(255,255,255,.4); letter-spacing: .1em; font-weight: 500; }
.loader-spinner { width: 28px; height: 28px; border: 2.5px solid rgba(255,255,255,.1); border-top-color: var(--accent, #fff); border-radius: 50%; animation: spin .65s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.speed-indicator {
position: fixed; top: 70px; left: 50%; transform: translateX(-50%);
background: rgba(0,0,0,.7); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
border: 1px solid rgba(255,255,255,.15); border-radius: 50px;
padding: 8px 16px; font-size: .8rem; font-weight: 800; color: var(--accent);
z-index: 1000; pointer-events: none; opacity: 0; transition: opacity .15s;
display: flex; align-items: center; gap: 8px;
}
.speed-indicator.show { opacity: 1; }
/* ── YT EMBED ────────────────────────────────── */
.yt-container { position: relative; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
@@ -1015,6 +1024,7 @@
<div class="loader-sub">{{ t('scroller.doomscroll') }}</div>
<div class="loader-spinner"></div>
</div>
<div id="speed-indicator" class="speed-indicator"><i class="fa-solid fa-forward"></i> 2x speed</div>
<!-- Top bar -->
<div id="scroller-topbar">