fix color management and remove shadows

Colors.js

@@ -0,0 +1,18 @@
+const colors = {
+    base00: "#1e1e2e", 
+    base01: "#181825", 
+    base02: "#313244", 
+    base03: "#45475a", 
+    base04: "#585b70", 
+    base05: "#cdd6f4", 
+    base06: "#f5e0dc", 
+    base07: "#b4befe", 
+    base08: "#f38ba8", 
+    base09: "#fab387", 
+    base0A: "#f9e2af", 
+    base0B: "#a6e3a1", 
+    base0C: "#94e2d5", 
+    base0D: "#89b4fa", 
+    base0E: "#cba6f7", 
+    base0F: "#f2cdcd", 
+}

Colors.qml

@@ -2,76 +2,30 @@ pragma ComponentBehavior: Bound
 pragma Singleton
 import QtQuick
 import Quickshell
-import Quickshell.Io
+import "Colors.js" as Colors
 
 Singleton {
     id: root
 
-    // --- The Backgrounds (Darkest to Lightest) ---
     readonly property color accent: base0D
     readonly property color barBg: base01
     readonly property color moduleBg: Qt.hsla(base01.hslHue, base01.hslSaturation, base01.hslLightness + 0.05, 1.0)
     readonly property color activeModuleBg: Qt.hsla(base01.hslHue, base01.hslSaturation, base01.hslLightness + 0.1, 1.0)
     readonly property color text: base06
-    readonly property color base00: "#" + viewer.base00
+    readonly property color base00: Colors.colors.base00
-    readonly property color base01: "#" + viewer.base01
+    readonly property color base01: Colors.colors.base01
-    readonly property color base02: "#" + viewer.base02
+    readonly property color base02: Colors.colors.base02
-    readonly property color base03: "#" + viewer.base03
+    readonly property color base03: Colors.colors.base03
-    readonly property color base04: "#" + viewer.base04
+    readonly property color base04: Colors.colors.base04
-    readonly property color base05: "#" + viewer.base05
+    readonly property color base05: Colors.colors.base05
-    readonly property color base06: "#" + viewer.base06
+    readonly property color base06: Colors.colors.base06
-    readonly property color base07: "#" + viewer.base07
+    readonly property color base07: Colors.colors.base07
-    readonly property color base08: "#" + viewer.base08
+    readonly property color base08: Colors.colors.base08
-    readonly property color base09: "#" + viewer.base09
+    readonly property color base09: Colors.colors.base09
-    readonly property color base0A: "#" + viewer.base0A
+    readonly property color base0A: Colors.colors.base0A
-    readonly property color base0B: "#" + viewer.base0B
+    readonly property color base0B: Colors.colors.base0B
-    readonly property color base0C: "#" + viewer.base0C
+    readonly property color base0C: Colors.colors.base0C
-    readonly property color base0D: "#" + viewer.base0D
+    readonly property color base0D: Colors.colors.base0D
-    readonly property color base0E: "#" + viewer.base0E
+    readonly property color base0E: Colors.colors.base0E
-    readonly property color base0F: "#" + viewer.base0F
+    readonly property color base0F: Colors.colors.base0F
-
-    FileView {
-        id: viewer
-        path: `${Quickshell.env("HOME")}/.config/stylix/palette.json`
-        watchChanges: true
-        onAdapterUpdated: reload()
-        onAdapterChanged: reload()
-        blockLoading: true
-        property alias base00: palette.base00
-        property alias base01: palette.base01
-        property alias base02: palette.base02
-        property alias base03: palette.base03
-        property alias base04: palette.base04
-        property alias base05: palette.base05
-        property alias base06: palette.base06
-        property alias base07: palette.base07
-        property alias base08: palette.base08
-        property alias base09: palette.base09
-        property alias base0A: palette.base0A
-        property alias base0B: palette.base0B
-        property alias base0C: palette.base0C
-        property alias base0D: palette.base0D
-        property alias base0E: palette.base0E
-        property alias base0F: palette.base0F
-
-        JsonAdapter {
-            id: palette
-            property string base00
-            property string base01
-            property string base02
-            property string base03
-            property string base04
-            property string base05
-            property string base06
-            property string base07
-            property string base08
-            property string base09
-            property string base0A
-            property string base0B
-            property string base0C
-            property string base0D
-            property string base0E
-            property string base0F
-        }
-    }
 }

modules/bar/ActiveWindow.qml

@@ -11,16 +11,6 @@ import QtQuick.Effects
 Rectangle {
     id: root
     required property double moduleHeight
-    layer.enabled: true
-    layer.effect: MultiEffect {
-        id: dropShadow
-        source: root
-        shadowEnabled: true
-        shadowHorizontalOffset: 4
-        shadowVerticalOffset: 2
-        shadowOpacity: 0.5
-        shadowColor: "#020202"
-    }
     implicitHeight: moduleHeight
     implicitWidth: titleLayout.width + 32
     color: Colors.moduleBg

modules/bar/Bat.qml

@@ -8,16 +8,6 @@ import qs.settings
 
 Rectangle {
     id: root
-    layer.enabled: true
-    layer.effect: MultiEffect {
-        id: dropShadow
-        source: root
-        shadowEnabled: true
-        shadowHorizontalOffset: 4
-        shadowVerticalOffset: 2
-        shadowOpacity: 0.5
-        shadowColor: "#020202"
-    }
     clip: true
     color: Colors.moduleBg
     visible: UPower.displayDevice.isLaptopBattery

modules/bar/Clock.qml

@@ -8,16 +8,6 @@ import qs.settings
 
 Rectangle {
     id: root
-    layer.enabled: true
-    layer.effect: MultiEffect {
-        id: dropShadow
-        source: root
-        shadowEnabled: true
-        shadowHorizontalOffset: 4
-        shadowVerticalOffset: 2
-        shadowOpacity: 0.5
-        shadowColor: "#020202"
-    }
     clip: true
     required property double moduleHeight
     implicitHeight: moduleHeight

modules/bar/Pw.qml

@@ -10,16 +10,6 @@ import qs.settings
 
 Rectangle {
     id: root
-    layer.enabled: true
-    layer.effect: MultiEffect {
-        id: dropShadow
-        source: root
-        shadowEnabled: true
-        shadowHorizontalOffset: 4
-        shadowVerticalOffset: 2
-        shadowOpacity: 0.5
-        shadowColor: "#020202"
-    }
     color: clickHandler.containsMouse ? Colors.activeModuleBg : Colors.moduleBg
     property PwNode defaultAudio: Pipewire.ready ? Pipewire.defaultAudioSink : null
     property bool mute: Pipewire.ready ? defaultAudio?.audio.muted : null

modules/bar/Tray.qml

@@ -10,16 +10,6 @@ import qs.settings
 
 Rectangle {
     id: root
-    layer.enabled: true
-    layer.effect: MultiEffect {
-        id: dropShadow
-        source: root
-        shadowEnabled: true
-        shadowHorizontalOffset: 4
-        shadowVerticalOffset: 2
-        shadowOpacity: 0.5
-        shadowColor: "#020202"
-    }
     visible: iconRepeater.count != 0
     Layout.fillHeight: true
     required property double moduleHeight

modules/wallpaper/WallpaperPicker.qml

@@ -1,11 +1,9 @@
 pragma ComponentBehavior: Bound
 import Quickshell
 import Quickshell.Wayland
-import Quickshell.Widgets
 import Quickshell.Hyprland
 import QtQuick
 import Qt.labs.folderlistmodel 2.11
-import QtQuick.Effects
 
 import qs
 import qs.settings
@@ -13,17 +11,6 @@ import qs.widgets
 
 Rectangle {
     id: main
-
-    layer.enabled: true
-    layer.effect: MultiEffect {
-        id: dropShadow
-        source: main
-        shadowEnabled: true
-        shadowHorizontalOffset: 4
-        shadowVerticalOffset: 2
-        shadowOpacity: 0.5
-        shadowColor: "#020202"
-    }
     required property real moduleHeight
     required property int screenHeight
     color: Colors.moduleBg
@@ -46,7 +33,8 @@ Rectangle {
     }
     WlrLayershell {
         id: wallPicker
-        visible: false
+        visible: true
+        layer: WlrLayer.Top
         exclusionMode: ExclusionMode.Ignore
         keyboardFocus: WlrKeyboardFocus.OnDemand
         implicitHeight: main.screenHeight / 8
@@ -71,7 +59,7 @@ Rectangle {
             if (wallPicker.visible)
                 container.forceActiveFocus();
         }
-        ClippingRectangle {
+        Rectangle {
             id: container
             focus: true
             Keys.onEscapePressed: {
@@ -88,39 +76,38 @@ Rectangle {
                 snapMode: GridView.SnapOneRow
                 flow: GridView.FlowTopToBottom
                 cellHeight: container.height
-                cellWidth: container.width / 8
+                cellWidth: container.width / 7
                 anchors.fill: parent
-                anchors.rightMargin: 10
+                anchors.centerIn: container
+                anchors.margins: 20
                 model: wallpaperList
-                delegate: ClippingWrapperRectangle {
+                delegate: Rectangle {
                     id: wallTile
-                    margin: 10
                     required property var modelData
                     color: 'transparent'
-                    implicitWidth: wallPicker.width / 8
+                    implicitWidth: wallpaperLayout.cellWidth - 20
-                    implicitHeight: wallPicker.height
+                    implicitHeight: wallpaperLayout.cellHeight - 20
-                    child: ClippingRectangle {
+                    anchors.margins: 20
-                        id: wpRounder
+                    clip: true
-                        color: 'transparent'
+                    radius: 16
-                        radius: Config.rounding / 1.5
+                    Image {
-                        Image {
+                        id: wallpaper
-                            id: wallpaper
+                        source: wallTile.modelData.filePath
-                            anchors.fill: parent
+                        sourceSize.width: 16 * 20
-                            source: wallTile.modelData.filePath
+                        sourceSize.height: 9 * 20
-                            sourceSize.width: 16 * 30
+                        asynchronous: true
-                            sourceSize.height: 9 * 30
+                        anchors.fill: parent
-                            asynchronous: true
+                        anchors.verticalCenter: parent.verticalCenter
-                            cache: true
+                        cache: true
-                        }
+                    }
-                        MouseArea {
+                    MouseArea {
-                            id: wpClickHandler
+                        id: wpClickHandler
-                            anchors.fill: parent
+                        anchors.fill: parent
-                            cursorShape: Qt.PointingHandCursor
+                        cursorShape: Qt.PointingHandCursor
-                            acceptedButtons: Qt.LeftButton
+                        acceptedButtons: Qt.LeftButton
-                            hoverEnabled: true
+                        hoverEnabled: true
-                            onClicked: {
+                        onClicked: {
-                                Config.wallpaper = wallTile.modelData.filePath;
+                            Config.wallpaper = wallTile.modelData.filePath;
-                            }
                         }
                     }
                 }

settings/Config.qml

@@ -29,5 +29,6 @@ Singleton {
         property alias floating: root.floating
         property alias wallDir: root.wallDir
         property alias showCorners: root.showCorners
+        property alias iconSize: root.iconSize
     }
 }

widgets/MaterialIcon.qml

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