itlxrd/Psychotoxical-psysonic
1
0
Fork 0
mirror of https://github.com/Psychotoxical/psysonic.git synced 2026-07-21 23:05:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: v1.15.0 — Genre Strip, Lyrics Accent, Sidebar Button fix

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Psychotoxical
2026-03-23 18:47:32 +01:00
parent 361e9cfdb3
commit 3effad0830
20 changed files with 121 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/components.css
+2 -4
View File
@@ -1629,14 +1629,12 @@
padding: 5px 8px;
border-radius: 6px;
line-height: 1.6;
transition: color 0.25s, font-size 0.2s, font-weight 0.2s;
transition: color 0.25s;
cursor: default;
}
.lyrics-line.active {
color: var(--text-primary);
font-size: 15px;
font-weight: 600;
color: var(--accent);
}
.lyrics-plain {
src/styles/layout.css
+39 -18
View File
@@ -9,7 +9,6 @@
"sidebar main queue"
"player player player";
height: 100vh;
overflow: hidden;
background: var(--bg-app);
}
@@ -39,6 +38,7 @@
background: var(--bg-sidebar);
border-right: 1px solid var(--border-subtle);
position: relative;
z-index: 2;
}
.sidebar-brand {
@@ -186,12 +186,12 @@
.collapse-btn {
position: absolute;
top: 50%;
right: -13px;
top: calc(50% - var(--player-height) / 2);
left: calc(var(--sidebar-width) - 11px);
transform: translateY(-50%);
z-index: 101;
width: 26px;
height: 26px;
width: 22px;
height: 22px;
border-radius: 50%;
border: 1px solid var(--border-subtle);
background: var(--bg-card);
@@ -200,21 +200,36 @@
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: opacity 0.2s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
box-shadow: var(--shadow-sm);
}
.sidebar:hover .collapse-btn {
opacity: 1;
}
.collapse-btn:hover {
background: var(--bg-hover);
color: var(--text-primary);
box-shadow: var(--shadow-md);
}
.queue-toggle-btn {
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: var(--radius-md);
border: none;
background: transparent;
color: var(--text-muted);
cursor: pointer;
transition: background 0.15s ease, color 0.15s ease;
flex-shrink: 0;
}
.queue-toggle-btn:hover {
background: var(--bg-hover);
color: var(--text-primary);
}
/* ─── Update Toast ─── */
@keyframes update-toast-in {
from { opacity: 0; transform: translateY(6px); }
@@ -749,13 +764,18 @@
}
.queue-current-track {
display: flex;
flex-direction: column;
flex-shrink: 0;
border-bottom: 1px solid var(--border-subtle);
}
.queue-current-track-body {
padding: var(--space-3) var(--space-4);
display: flex;
flex-direction: row;
align-items: flex-start;
gap: var(--space-3);
flex-shrink: 0;
border-bottom: 1px solid var(--border-subtle);
}
.queue-current-cover {
@@ -803,17 +823,18 @@
}
.queue-current-tech {
position: absolute;
top: 0;
right: 0;
width: 100%;
font-size: 9px;
font-family: monospace;
letter-spacing: 0.05em;
background: var(--ctp-surface1);
color: var(--accent);
padding: 2px 6px;
border-radius: 0 0 0 var(--radius-sm);
padding: 3px var(--space-4);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
backdrop-filter: blur(8px);
}
.queue-divider {