felis/lxc-streamutils
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update UI

Browse Source
This commit is contained in:
felis
2026-08-11 09:19:13 -07:00
parent 97a3f1be48
commit 4eda93cf24
31 changed files with 952 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/overlay/src/song.css
+9 -9
View File
@@ -26,7 +26,7 @@ body,
position: relative;
min-width: 0;
overflow: hidden;
border: 1px solid var(--theme-card-border);
border: var(--component-decoration-line, 1px) solid var(--theme-card-border);
border-radius: clamp(8px, 1.5vmin, 15px);
background: var(--theme-card-background);
box-shadow:
@@ -60,7 +60,7 @@ body,
place-items: center;
width: clamp(30px, 3em, 46px);
aspect-ratio: 1;
border: 1px solid rgba(133, 255, 232, 0.5);
border: var(--component-decoration-line, 1px) solid rgba(133, 255, 232, 0.5);
border-radius: 50%;
color: var(--theme-accent);
background: rgba(6, 48, 57, 0.72);
@@ -127,7 +127,7 @@ body,
align-items: center;
justify-content: space-between;
padding: 0.38em 0.72em;
border-bottom: 1px solid rgba(133, 255, 232, 0.16);
border-bottom: var(--component-decoration-line, 1px) solid rgba(133, 255, 232, 0.16);
color: var(--theme-compact-user);
letter-spacing: 0.12em;
}
@@ -161,7 +161,7 @@ body,
align-items: center;
gap: 0.55em;
padding: 0.4em 0.62em;
border: 1px solid rgba(128, 238, 218, 0.13);
border: var(--component-decoration-line, 1px) solid rgba(128, 238, 218, 0.13);
border-radius: 0.62em;
background: linear-gradient(90deg, rgba(8, 47, 59, 0.74), rgba(8, 71, 72, 0.46));
overflow: hidden;
@@ -419,14 +419,14 @@ body,
grid-template-columns: auto minmax(0, 1fr) auto;
gap: clamp(10px, 1.5vmin, 18px);
padding: clamp(6px, 0.8vmin, 10px) 0 clamp(12px, 1.6vmin, 20px);
border-bottom: 1px solid rgba(198, 174, 122, 0.26);
border-bottom: var(--component-decoration-line, 1px) solid rgba(198, 174, 122, 0.26);
animation: moonlit-song-current 0.68s ease-out both;
}
.theme-moonlit-water .song-current-mark {
position: relative;
width: clamp(46px, 3.7em, 68px);
border: 1px solid rgba(198, 174, 122, 0.62);
border: var(--component-decoration-line, 1px) solid rgba(198, 174, 122, 0.62);
border-radius: 50%;
color: #d2b468;
background: radial-gradient(circle, rgba(198, 174, 122, 0.08), transparent 68%);
@@ -443,8 +443,8 @@ body,
right: -0.18em;
width: 0.72em;
height: 0.42em;
border: 1px solid rgba(116, 166, 157, 0.52);
border-width: 1px 0 0 1px;
border: var(--component-decoration-line, 1px) solid rgba(116, 166, 157, 0.52);
border-width: var(--component-decoration-line, 1px) 0 0 var(--component-decoration-line, 1px);
border-radius: 100% 0;
transform: rotate(-24deg);
}
@@ -510,7 +510,7 @@ body,
}
.theme-moonlit-water .song-waveform i {
width: 2px;
width: var(--component-decoration-line, 2px);
height: 25%;
background: #6a9f99;
animation: moonlit-song-wave 1.8s ease-in-out infinite alternate;