josh/ytplayer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update icon beside the search box after the update dialog is dismissed

Browse Source 
Shown as soon as an update is offered, so Later, a backdrop tap or a failed
download all leave a one-tap way to update; it targets the newest build and
disappears while updating. The search form and box now shrink so the icon
never pushes Search off a phone screen.
This commit is contained in:
Jonathan Sykes
2026-10-03 01:26:52 +08:00
parent 65f5325a8e
commit 6581509ddd
3 changed files with 45 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/styles.css
View File

@@ -4287,3 +4287,19 @@ body.landscape-fs .player-stage { touch-action: none; } /* fullscreen (real or t
.player-pane.home-over #artFallback { visibility: hidden; }
.player-pane.home-over .related-panel { display: none; }
.player-pane.home-over > :not(.player-stage):not(#serviceMode) { display: none !important; }
/* Pending-update icon beside the search box (shown after the update dialog) */
.update-icon-btn {
flex: none; width: 44px; height: 44px; padding: 0; align-self: center;
display: grid; place-items: center; cursor: pointer;
border-radius: 50%; border: 1px solid var(--accent);
background: color-mix(in srgb, var(--accent) 16%, var(--bg-2)); color: var(--accent-bright);
box-shadow: 0 0 0 0 var(--accent-glow); animation: updPulse 2.4s ease-in-out infinite;
}
.update-icon-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.update-icon-btn.hidden { display: none; }
@keyframes updPulse { 0%, 100% { box-shadow: 0 0 0 0 var(--accent-glow); } 50% { box-shadow: 0 0 0 6px transparent; } }
@media (prefers-reduced-motion: reduce) { .update-icon-btn { animation: none; } }
/* The search box gives up width for the update icon instead of pushing Search off screen */
.search-form { min-width: 0; }
.search-form #searchInput { flex: 1 1 auto; min-width: 0; }