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

Redesign service-mode controls and add per-profile wrong-lyric-line reports

Browse Source
This commit is contained in:
Claude
2026-09-30 15:15:07 +00:00
parent 0d68e7e72f
commit 04a74ab45d
10 changed files with 1060 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
frontend/styles.css
View File

@@ -2719,57 +2719,7 @@ input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.25); }
user-select: none;
}
.service-topbar {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
max-width: 900px;
margin: 0 auto;
gap: 16px;
}
.service-wake-state {
font-family: var(--ui);
font-size: 13px;
color: var(--text-dim);
display: inline-flex;
align-items: center;
gap: 8px;
letter-spacing: 0.01em;
transition: color 0.2s var(--ease);
}
.service-wake-state::before {
content: "";
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--line);
transition: background 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
.service-wake-state.awake {
color: var(--text-2);
}
.service-wake-state.awake::before {
background: #34d399;
box-shadow: 0 0 10px rgba(52, 211, 153, 0.6);
}
.service-topbar-actions {
display: flex;
align-items: center;
gap: 8px;
}
/* Toggle reads as pressed when the video panel is on. */
.service-video-btn.on {
border-color: var(--accent);
color: var(--text);
}
/* Top bar, view toggles and the exit button live in service-ui.css. */
/* Video panel on: the overlay is moved into the player pane (see
applyServiceVideoLayout) and rendered inline beneath the stage, so the video
@@ -2817,34 +2767,6 @@ body.service-video .service-bottom {
padding-bottom: 14px;
}
.service-exit-btn {
background: var(--bg-3);
border: 1px solid var(--line);
color: var(--text);
padding: 9px 18px;
border-radius: var(--radius-sm);
font-family: var(--ui);
font-size: 13.5px;
font-weight: 600;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
touch-action: manipulation;
transition: all 0.16s var(--ease);
}
.service-exit-btn:hover {
background: var(--bg-2);
border-color: var(--accent);
transform: translateY(-1px);
}
.service-exit-btn:active {
transform: translateY(0);
}
.service-center {
display: flex;
flex-direction: column;