48 lines
1.2 KiB
SCSS
48 lines
1.2 KiB
SCSS
* { all: unset; }
|
|
|
|
.volume-overlay {
|
|
background: rgba(15, 15, 20, 0.92);
|
|
border: 1px solid rgba(255,255,255,0.08);
|
|
border-radius: 12px;
|
|
padding: 16px;
|
|
backdrop-filter: blur(20px);
|
|
color: #e0e0e0;
|
|
font-family: "JetBrains Mono", monospace;
|
|
}
|
|
|
|
.header {
|
|
margin-bottom: 4px;
|
|
.header-icon { font-size: 18px; color: #33ccff; }
|
|
.header-title { font-size: 14px; font-weight: bold; color: #fff; }
|
|
}
|
|
|
|
.divider {
|
|
background: rgba(255,255,255,0.07);
|
|
min-height: 1px;
|
|
margin: 4px 0;
|
|
}
|
|
|
|
.sink-row {
|
|
padding: 4px 0;
|
|
.app-name { font-size: 12px; color: #aaa; min-width: 120px; }
|
|
.app-vol { font-size: 12px; color: #33ccff; margin-left: auto; }
|
|
.app-icon { font-size: 14px; color: #666; }
|
|
}
|
|
|
|
.vol-slider {
|
|
min-height: 20px;
|
|
trough { background: rgba(255,255,255,0.1); border-radius: 4px; min-height: 4px; }
|
|
highlight { background: linear-gradient(90deg, #33ccff, #00ff99); border-radius: 4px; }
|
|
slider { background: #fff; border-radius: 50%; min-width: 12px; min-height: 12px; }
|
|
}
|
|
|
|
.mute-btn {
|
|
margin-top: 8px;
|
|
background: rgba(255,255,255,0.06);
|
|
border-radius: 8px;
|
|
padding: 8px;
|
|
font-size: 13px;
|
|
color: #aaa;
|
|
&:hover { background: rgba(255,255,255,0.12); }
|
|
&.muted { color: #ff5555; background: rgba(255,85,85,0.1); }
|
|
} |