This commit is contained in:
soraefir
2026-06-13 22:15:53 +02:00
parent aace131a0e
commit 0a3fef0b1c
7 changed files with 52 additions and 50 deletions

View File

@@ -1,10 +1,10 @@
calendar {
padding: 2pt 1pt;
font-size: 10pt;
padding: $popup-scale * 1.75pt $popup-scale * 1pt;
font-size: $popup-scale * 8pt;
header {
padding: 2pt 0;
padding: $popup-scale * 2pt 0;
@include color-body;
}
@@ -13,7 +13,7 @@ calendar {
:indeterminate { color: $base03; }
}
.cal-box .sys-section-header { margin-bottom: 4pt; }
.cal-box .sys-section-header { margin-bottom: $popup-scale * 4pt; }
.hour, .month {
@@ -21,7 +21,7 @@ calendar {
}
.minute, .month {
margin-top: -4pt;
margin-top: $popup-scale * -4pt;
}
@@ -43,19 +43,19 @@ calendar {
.quick-accent { background-color: $base0E; }
// Quick actions
.quick-grid { margin-top: 2pt; }
.quick-grid { margin-top: $popup-scale * 2pt; }
.quick-btn {
@include background-base2;
@include border-radius;
padding: 8pt 4pt;
margin: 4px;
padding: $popup-scale * 8pt $popup-scale * 4pt;
margin: $popup-scale * 4px;
min-width: 0;
min-height: 0;
border: none;
&:hover {
@include background-active;
&:hover {
@include background-active;
.quick-icon, .quick-label {color: $base01;}
}
}
@@ -66,21 +66,21 @@ calendar {
}
.quick-icon { font-size: 1.5em; @include color-body; }
.quick-label { font-size: 0.68em; margin-top: 3pt; @include color-body; }
.quick-label { font-size: 0.68em; margin-top: $popup-scale * 3pt; @include color-body; }
// Weather section
.weather-main { margin-bottom: 8pt; }
.weather-icon { font-size: 2.2em; margin-right: 12pt; @include color-accent; }
.weather-main { margin-bottom: $popup-scale * 8pt; }
.weather-icon { font-size: 2.2em; margin-right: $popup-scale * 12pt; @include color-accent; }
.weather-temp { font-size: 1.3em; font-weight: bold; @include color-base; }
.weather-desc { font-size: 0.78em; @include color-body; }
.weather-stats { margin-top: 4pt; }
.weather-stats { margin-top: $popup-scale * 4pt; }
// Volume section
.ctrl-row { margin-bottom: 4pt; }
.ctrl-icon { font-size: 1.1em; min-width: 22pt; @include border-radius; @include color-body; }
.ctrl-row { margin-bottom: $popup-scale * 4pt; }
.ctrl-icon { font-size: 1.1em; min-width: $popup-scale * 22pt; @include border-radius; @include color-body; }
.ctrl-icon:hover { @include background-active; }
.ctrl-muted { @include color-inactive; }
.ctrl-value { font-size: 0.72em; min-width: 28pt; @include color-active; }
.ctrl-value { font-size: 0.72em; min-width: $popup-scale * 28pt; @include color-active; }
scale.ctrl-slider.ctrl-slider-muted {
trough {
@@ -90,7 +90,7 @@ scale.ctrl-slider.ctrl-slider-muted {
}
scale.ctrl-slider {
padding: 2pt 4pt;
padding: $popup-scale * 2pt $popup-scale * 4pt;
trough {
@include border-radius;
@include background-base2;
@@ -105,4 +105,4 @@ scale.ctrl-slider {
margin: -3px;
border: none;
}
}
}

View File

@@ -28,4 +28,5 @@ $border-width: 2px;
$gaps-screen: 8px;
$gaps-window: 4px;
$panel-font-size: 10pt;
$panel-font-size: 10pt;
$popup-scale: 1;

View File

@@ -11,23 +11,23 @@
.usb-accent { background-color: $base09; }
// Netinfo rows
.netinfo-row { margin-bottom: 3pt; }
.netinfo-row { margin-bottom: $popup-scale * 3pt; }
.netinfo-label, .netinfo-value, .netinfo-dim { font-size: 0.72em; }
.netinfo-label { @include color-active; min-width: 60px; }
.netinfo-label { @include color-active; min-width: $popup-scale * 60px; }
.netinfo-value { @include color-body; }
.netinfo-dim { color: $base03; margin-bottom: 4pt; }
.netinfo-dim { color: $base03; margin-bottom: $popup-scale * 4pt; }
// Section toggle button
.net-toggle-btn {
padding: 2pt 4pt;
padding: $popup-scale * 2pt $popup-scale * 4pt;
@include border-radius;
font-size: 1.1em;
}
// Bluetooth device list
.bt-device-row { margin-bottom: 4pt; }
.bt-device-row { margin-bottom: $popup-scale * 4pt; }
.bt-device-name { font-size: 0.78em; @include color-body; }
.bt-device-btn { padding: 2pt 6pt; @include border-radius; font-size: 1em; }
.bt-device-btn { padding: $popup-scale * 2pt $popup-scale * 6pt; @include border-radius; font-size: 1em; }
// Shared button states
.net-toggle-btn:hover,

View File

@@ -3,15 +3,15 @@
// Now playing
.radio-now-playing {
margin-bottom: 8pt;
margin-bottom: $popup-scale * 8pt;
}
.radio-art {
background-repeat: no-repeat;
@include border-radius;
@include background-base2;
min-width: 72px;
min-height: 72px;
min-width: $popup-scale * 72px;
min-height: $popup-scale * 72px;
}
.radio-art-icon {
@@ -23,7 +23,7 @@
font-size: 0.88em;
font-weight: bold;
@include color-base;
margin-bottom: 2pt;
margin-bottom: $popup-scale * 2pt;
}
.radio-artist {
@@ -33,12 +33,12 @@
// Controls
.radio-controls {
margin-top: 6pt;
margin-top: $popup-scale * 6pt;
}
.radio-ctrl-btn {
font-size: 2em;
padding: 4pt 20pt;
padding: $popup-scale * 4pt $popup-scale * 20pt;
@include border-radius;
@include color-body;
&:hover { @include background-active; @include color-base; }
@@ -66,7 +66,7 @@ scrollbar slider {
}
.station-row {
padding: 4pt 3pt;
padding: $popup-scale * 4pt $popup-scale * 3pt;
@include border-radius;
&:hover { @include background-base2; }
}
@@ -79,9 +79,9 @@ scrollbar slider {
background-repeat: no-repeat;
@include border-radius;
@include background-base2;
min-width: 28px;
min-height: 28px;
margin-right: 8pt;
min-width: $popup-scale * 28px;
min-height: $popup-scale * 28px;
margin-right: $popup-scale * 8pt;
}
.station-name {

View File

@@ -7,9 +7,9 @@
.cpubar, .gpubar, .membar, .batbar { @include background-base2; margin: $gaps-window 0; }
// Window chrome
.sys-win { padding: 10pt; font-size: $panel-font-size; }
.sys-win { padding: $popup-scale * 10pt; font-size: $popup-scale * $panel-font-size; }
.sys-section { margin-bottom: 0; }
.sys-section-header { margin-bottom: 10pt; }
.sys-section-header { margin-bottom: $popup-scale * 10pt; }
.sys-label {
font-size: 0.72em;
@@ -21,7 +21,7 @@
.section-accent {
min-width: 3px;
border-radius: 2px;
margin-right: 8pt;
margin-right: $popup-scale * 8pt;
}
.cpu-accent { background-color: $base0C; }
@@ -32,7 +32,7 @@
.section-sep {
background-color: $base03;
min-height: 2px;
margin: 6pt 0 10pt;
margin: $popup-scale * 6pt 0 $popup-scale * 10pt;
}
// All rings and progress tracks share the same background
@@ -49,11 +49,11 @@
.swap-ring { color: $base09; }
// Ring margins - freq rings use larger margins for concentric overlay effect
.cpu-usage-ring, .gpu-ring { margin: 3pt; }
.ram-ring, .bat-ring { margin: 4pt; }
.swap-ring { margin: 3.5pt; }
.cpu-freq-ring { margin: 12px; }
.gpu-freq-ring { margin: 13px; }
.cpu-usage-ring, .gpu-ring { margin: $popup-scale * 3pt; }
.ram-ring, .bat-ring { margin: $popup-scale * 4pt; }
.swap-ring { margin: $popup-scale * 3.5pt; }
.cpu-freq-ring { margin: $popup-scale * 12px; }
.gpu-freq-ring { margin: $popup-scale * 13px; }
// Shared label patterns
.gpu-ring-value, .gpu-stat-value, .ram-used-label { font-weight: bold; @include color-body; }
@@ -70,14 +70,14 @@
.ram-total-label { font-size: 0.72em; @include color-active; }
// GPU stats row
.gpu-stats-row { margin-top: 6pt; margin-bottom: 2pt; }
.gpu-stats-row { margin-top: $popup-scale * 6pt; margin-bottom: $popup-scale * 2pt; }
// VRAM
.vram-row { margin-top: 6pt; }
.vram-row { margin-top: $popup-scale * 6pt; }
.vram-bar {
@include border-radius;
padding: 2pt;
padding: $popup-scale * 2pt;
}
.vram-bar trough * {
@@ -89,5 +89,5 @@
.ram-cached-ring {
@include color-active;
background-color: transparent;
margin: 4pt;
margin: $popup-scale * 4pt;
}

View File

@@ -161,7 +161,7 @@
(box :orientation "v" :space-evenly false :halign "center" :valign "center"
(overlay
(circular-progress
:width 60 :height 60
:width 72 :height 72
:value {100*swap.used/swap.total}
:start-at 0 :clockwise true :thickness 7
:class "swap-ring"

View File

@@ -61,6 +61,7 @@ in {
$gaps-window: ${config.colorScheme.palette.gaps-window}px;
$panel-font-size: 10pt;
$popup-scale: 1.25;
'';
};
}