add ability to change colors quickly

Colors.qml

@@ -8,6 +8,11 @@ Singleton {
     id: root
 
     // --- The Backgrounds (Darkest to Lightest) ---
+    readonly property color accent: base0D
+    readonly property color barBg: base00
+    readonly property color moduleBg: base02
+    readonly property color activeModuleBg: base03
+    readonly property color text: base07
     readonly property color base00: "#" + viewer.base00
     readonly property color base01: "#" + viewer.base01
     readonly property color base02: "#" + viewer.base02

modules/bar/ActiveWindow.qml

@@ -23,7 +23,7 @@ Rectangle {
     }
     implicitHeight: moduleHeight
     implicitWidth: titleLayout.width + 32
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     RowLayout {
         id: titleLayout

modules/bar/Bar.qml

@@ -30,7 +30,7 @@ Variants {
         Rectangle {
             id: container
             radius: Config.floating ? Config.rounding : 0
-            color: Qt.rgba(Colors.base00.r, Colors.base00.g, Colors.base00.b, Config.opacity)
+            color: Qt.rgba(Colors.barBg.r, Colors.barBg.g, Colors.barBg.b, Config.opacity)
             anchors.fill: parent
             RowLayout {
                 id: leftLayout

modules/bar/Bat.qml

@@ -19,7 +19,7 @@ Rectangle {
         shadowColor: "#020202"
     }
     clip: true
-    color: Colors.base02
+    color: Colors.moduleBg
     visible: UPower.displayDevice.isLaptopBattery
     property double percent: UPower.displayDevice.percentage * 100
     property bool hasBattery: UPower.displayDevice.isLaptopBattery

modules/bar/Clock.qml

@@ -22,7 +22,7 @@ Rectangle {
     required property double moduleHeight
     implicitHeight: moduleHeight
     implicitWidth: clockText.implicitWidth + 32
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     SystemClock {
         id: clock

modules/bar/Mpris.qml

@@ -31,7 +31,7 @@ Rectangle {
     }
     visible: spotify !== null && spotify.playbackState === MprisPlaybackState.Playing
     clip: true
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     RowLayout {
         id: songLayout

modules/bar/Pw.qml

@@ -20,7 +20,7 @@ Rectangle {
         shadowOpacity: 0.5
         shadowColor: "#020202"
     }
-    color: clickHandler.containsMouse ? Colors.base03 : Colors.base02
+    color: clickHandler.containsMouse ? Colors.activeModuleBg : Colors.moduleBg
     property PwNode defaultAudio: Pipewire.ready ? Pipewire.defaultAudioSink : null
     property bool mute: Pipewire.ready ? defaultAudio?.audio.muted : null
     radius: Config.rounding

modules/bar/Tray.qml

@@ -25,7 +25,7 @@ Rectangle {
     required property double moduleHeight
     implicitHeight: moduleHeight
     implicitWidth: iconlayout.width + 16
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
 
     RowLayout {

modules/bar/Ws.qml

@@ -42,9 +42,8 @@ Rectangle {
                     id: wsName
                     anchors.centerIn: parent
                     text: wsWrapper.modelData.name
-                    color: wsWrapper.active ? Colors.base0D : Colors.base04
-                    opacity: wsWrapper.active ? 1.0 : 0.4
-                    font.bold: wsWrapper.active
+                    color: wsWrapper.active ? Colors.base0D : Colors.activeModuleBg
+                    font.bold: true
                 }
                 MouseArea {
                     id: clickHandler

modules/wallpaper/WallpaperPicker.qml

@@ -26,7 +26,7 @@ Rectangle {
     }
     required property real moduleHeight
     required property int screenHeight
-    color: Colors.base02
+    color: Colors.moduleBg
     radius: Config.rounding
     implicitWidth: moduleHeight
     implicitHeight: moduleHeight

widgets/MaterialIcon.qml

@@ -4,7 +4,7 @@ import QtQuick
 
 Text {
     font.family: "Material Symbols Rounded"
-    color: Colors.base05
+    color: Colors.text
     font.pixelSize: Config.iconSize
     property bool fill: true
     renderType: Text.NativeRendering

widgets/StyledText.qml

@@ -5,5 +5,5 @@ import qs.settings
 Text {
     font.family: Config.font
     font.pixelSize: Config.fontSize
-    color: Colors.base05
+    color: Colors.text
 }