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

View File

@@ -28,4 +28,5 @@ $border-width: 2px;
$gaps-screen: 8px; $gaps-screen: 8px;
$gaps-window: 4px; $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; } .usb-accent { background-color: $base09; }
// Netinfo rows // 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, .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-value { @include color-body; }
.netinfo-dim { color: $base03; margin-bottom: 4pt; } .netinfo-dim { color: $base03; margin-bottom: $popup-scale * 4pt; }
// Section toggle button // Section toggle button
.net-toggle-btn { .net-toggle-btn {
padding: 2pt 4pt; padding: $popup-scale * 2pt $popup-scale * 4pt;
@include border-radius; @include border-radius;
font-size: 1.1em; font-size: 1.1em;
} }
// Bluetooth device list // 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-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 // Shared button states
.net-toggle-btn:hover, .net-toggle-btn:hover,

View File

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

View File

@@ -7,9 +7,9 @@
.cpubar, .gpubar, .membar, .batbar { @include background-base2; margin: $gaps-window 0; } .cpubar, .gpubar, .membar, .batbar { @include background-base2; margin: $gaps-window 0; }
// Window chrome // 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 { margin-bottom: 0; }
.sys-section-header { margin-bottom: 10pt; } .sys-section-header { margin-bottom: $popup-scale * 10pt; }
.sys-label { .sys-label {
font-size: 0.72em; font-size: 0.72em;
@@ -21,7 +21,7 @@
.section-accent { .section-accent {
min-width: 3px; min-width: 3px;
border-radius: 2px; border-radius: 2px;
margin-right: 8pt; margin-right: $popup-scale * 8pt;
} }
.cpu-accent { background-color: $base0C; } .cpu-accent { background-color: $base0C; }
@@ -32,7 +32,7 @@
.section-sep { .section-sep {
background-color: $base03; background-color: $base03;
min-height: 2px; min-height: 2px;
margin: 6pt 0 10pt; margin: $popup-scale * 6pt 0 $popup-scale * 10pt;
} }
// All rings and progress tracks share the same background // All rings and progress tracks share the same background
@@ -49,11 +49,11 @@
.swap-ring { color: $base09; } .swap-ring { color: $base09; }
// Ring margins - freq rings use larger margins for concentric overlay effect // Ring margins - freq rings use larger margins for concentric overlay effect
.cpu-usage-ring, .gpu-ring { margin: 3pt; } .cpu-usage-ring, .gpu-ring { margin: $popup-scale * 3pt; }
.ram-ring, .bat-ring { margin: 4pt; } .ram-ring, .bat-ring { margin: $popup-scale * 4pt; }
.swap-ring { margin: 3.5pt; } .swap-ring { margin: $popup-scale * 3.5pt; }
.cpu-freq-ring { margin: 12px; } .cpu-freq-ring { margin: $popup-scale * 12px; }
.gpu-freq-ring { margin: 13px; } .gpu-freq-ring { margin: $popup-scale * 13px; }
// Shared label patterns // Shared label patterns
.gpu-ring-value, .gpu-stat-value, .ram-used-label { font-weight: bold; @include color-body; } .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; } .ram-total-label { font-size: 0.72em; @include color-active; }
// GPU stats row // 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
.vram-row { margin-top: 6pt; } .vram-row { margin-top: $popup-scale * 6pt; }
.vram-bar { .vram-bar {
@include border-radius; @include border-radius;
padding: 2pt; padding: $popup-scale * 2pt;
} }
.vram-bar trough * { .vram-bar trough * {
@@ -89,5 +89,5 @@
.ram-cached-ring { .ram-cached-ring {
@include color-active; @include color-active;
background-color: transparent; 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" (box :orientation "v" :space-evenly false :halign "center" :valign "center"
(overlay (overlay
(circular-progress (circular-progress
:width 60 :height 60 :width 72 :height 72
:value {100*swap.used/swap.total} :value {100*swap.used/swap.total}
:start-at 0 :clockwise true :thickness 7 :start-at 0 :clockwise true :thickness 7
:class "swap-ring" :class "swap-ring"

View File

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