align module colors to their group accent

modules/BarGroup.qml

@@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Effects
 import "." as M
 
 Rectangle {
@@ -6,7 +7,6 @@ Rectangle {
 
     default property alias content: row.children
     property color borderColor: M.Theme.base02
-
     color: "transparent"
     border.color: borderColor
     border.width: 1
@@ -14,6 +14,15 @@ Rectangle {
 
     visible: row.visibleChildren.length > 0
 
+    layer.enabled: true
+    layer.effect: MultiEffect {
+        shadowEnabled: true
+        shadowColor: root.borderColor
+        shadowBlur: 0.6
+        shadowVerticalOffset: 0
+        shadowHorizontalOffset: 0
+    }
+
     implicitWidth: row.implicitWidth + _pad * 2
     implicitHeight: row.implicitHeight + _pad * 2
 

modules/Battery.qml

@@ -18,7 +18,7 @@ M.BarSection {
     readonly property var dev: UPower.displayDevice
     readonly property real pct: (dev?.percentage ?? 0) * 100
     readonly property bool charging: dev?.state === UPowerDeviceState.Charging
-    property color _stateColor: charging ? M.Theme.base0B : pct < 15 ? M.Theme.base08 : pct < 30 ? M.Theme.base09 : M.Theme.base0B
+    property color _stateColor: charging ? M.Theme.base0B : pct < 15 ? M.Theme.base09 : pct < 30 ? M.Theme.base0A : M.Theme.base08
 
     Behavior on _stateColor { ColorAnimation { duration: 300 } }
 

modules/Disk.qml

@@ -34,12 +34,12 @@ M.BarSection {
 
     M.BarIcon {
         icon: "\uF0C9"
-        color: M.Theme.base09
+        color: M.Theme.base08
         anchors.verticalCenter: parent.verticalCenter
     }
     M.BarLabel {
         label: root.freePct + "% " + root.totalTb.toFixed(1)
-        color: M.Theme.base09
+        color: M.Theme.base08
         anchors.verticalCenter: parent.verticalCenter
     }
 }

modules/Memory.qml

@@ -34,12 +34,12 @@ M.BarSection {
 
     M.BarIcon {
         icon: "\uEFC5"
-        color: M.Theme.base0B
+        color: M.Theme.base08
         anchors.verticalCenter: parent.verticalCenter
     }
     M.BarLabel {
         label: root.percent + "%"
-        color: M.Theme.base0B
+        color: M.Theme.base08
         anchors.verticalCenter: parent.verticalCenter
     }
 }

modules/Network.qml

@@ -81,13 +81,13 @@ M.BarSection {
                 return "\uDB85\uDE16";
             return "\uDB82\uDCFD";
         }
-        color: root.state === "disconnected" ? M.Theme.base08 : M.Theme.base0C
+        color: root.state === "disconnected" ? M.Theme.base08 : M.Theme.base0D
         anchors.verticalCenter: parent.verticalCenter
     }
     M.BarLabel {
         visible: root.state === "wifi"
         label: root.essid
-        color: root.state === "disconnected" ? M.Theme.base08 : M.Theme.base0C
+        color: root.state === "disconnected" ? M.Theme.base08 : M.Theme.base0D
         anchors.verticalCenter: parent.verticalCenter
     }
 

modules/Notifications.qml

@@ -44,12 +44,12 @@ M.BarSection {
                 return root.count > 0 ? "\uDB80\uDCA0" : "\uDB82\uDE93";
             return root.count > 0 ? "\uDB84\uDD6B" : "\uDB80\uDC9C";
         }
-        color: root.count > 0 ? M.Theme.base09 : (root.dnd ? M.Theme.base04 : M.Theme.base09)
+        color: root.count > 0 ? M.Theme.base0D : (root.dnd ? M.Theme.base04 : M.Theme.base0D)
         anchors.verticalCenter: parent.verticalCenter
     }
     M.BarLabel {
         label: root.count > 0 ? String(root.count) : ""
-        color: M.Theme.base09
+        color: M.Theme.base0D
         anchors.verticalCenter: parent.verticalCenter
     }
 

modules/PowerProfile.qml

@@ -8,7 +8,7 @@ M.BarIcon {
 
     property string profile: ""
 
-    color: root.profile === "performance" ? M.Theme.base09 : root.profile === "power-saver" ? M.Theme.base0B : M.Theme.base05
+    color: root.profile === "performance" ? M.Theme.base09 : root.profile === "power-saver" ? M.Theme.base0B : M.Theme.base0A
 
     icon: {
         if (root.profile === "performance")

modules/Temperature.qml

@@ -8,7 +8,7 @@ M.BarSection {
     tooltip: "Temperature: " + root.celsius + "\u00B0C"
 
     property int celsius: 0
-    property color _stateColor: celsius > 80 ? M.Theme.base08 : celsius > 60 ? M.Theme.base09 : M.Theme.base0C
+    property color _stateColor: celsius > 80 ? M.Theme.base09 : celsius > 60 ? M.Theme.base0A : M.Theme.base08
     Behavior on _stateColor { ColorAnimation { duration: 300 } }
 
     FileView {

modules/Tray.qml

@@ -25,7 +25,7 @@ RowLayout {
             M.ThemedIcon {
                 anchors.fill: parent
                 source: iconItem.modelData.icon
-                tint: M.Theme.base05
+                tint: M.Theme.base0D
             }
 
             HoverHandler {

modules/Weather.qml

@@ -35,7 +35,7 @@ M.BarSection {
 
     M.BarIcon {
         id: label
-        color: M.Theme.base0C
+        color: M.Theme.base08
         anchors.verticalCenter: parent.verticalCenter
     }
 }

modules/WindowTitle.qml

@@ -76,13 +76,13 @@ M.BarSection {
         layer.enabled: true
         layer.effect: MultiEffect {
             colorization: 1.0
-            colorizationColor: M.Theme.base05
+            colorizationColor: M.Theme.base0D
         }
     }
 
     M.BarLabel {
         label: root._title
-        color: M.Theme.base05
+        color: M.Theme.base0D
         elide: Text.ElideRight
         anchors.verticalCenter: parent.verticalCenter
     }