modules/Shortcuts.qml

@@ -1,5 +1,5 @@
-import qs.widgets
 import Quickshell
+import "../widget/"
 
 Scope {
     id: root

modules/bar/components/Caffeine.qml

@@ -1,12 +1,14 @@
-import qs.config
-import qs.constants
-import qs.styled
-import qs.widgets
 import Quickshell.Io
+import "../../../config/"
+import "../../../constants/"
+import "../../../styled/"
 
-StyledButton {
+Clickable {
     id: clickable
 
+    implicitWidth: text.width
+    implicitHeight: Dimensions.caffeine.height
+
     border.color: process.running ? Theme.palette.secondary : 'transparent'
     border.width: 2
 
@@ -19,7 +21,7 @@ StyledButton {
         }
     }
 
-    content: StyledText {
+    StyledText {
         id: text
 
         font.family: Theme.lucide.font.family
@@ -28,6 +30,12 @@ StyledButton {
         text: Icons.coffee
 
         color: clickable.containsMouse ? Theme.palette.base300 : Theme.palette.basecontent
+
+        anchors.verticalCenter: parent.verticalCenter
+        topPadding: Dimensions.caffeine.verticalPadding
+        bottomPadding: Dimensions.caffeine.verticalPadding
+        leftPadding: Dimensions.caffeine.horizontalPadding
+        rightPadding: Dimensions.caffeine.horizontalPadding
     }
 
     Process {

modules/bar/components/Clock.qml

@@ -1,10 +1,18 @@
-import qs.config
-import qs.widgets
 import Quickshell
+import "../../../styled/"
+import "../../../config/"
 
 StyledLabel {
+    implicitWidth: childrenRect.width
+    implicitHeight: Dimensions.clock.height
+
     StyledText {
         id: text
+        anchors.verticalCenter: parent.verticalCenter
+        topPadding: Dimensions.clock.verticalPadding
+        bottomPadding: Dimensions.clock.verticalPadding
+        leftPadding: Dimensions.clock.horizontalPadding
+        rightPadding: Dimensions.clock.horizontalPadding
 
         font.pixelSize: Dimensions.clock.fontSize
 

modules/bar/components/Cpu.qml

@@ -1,25 +1,29 @@
-import qs.config
-import qs.constants
-import qs.services
-import qs.utils
-import qs.widgets
 import QtQuick
-import QtQuick.Layouts
+import Quickshell
+import "../../../config/"
+import "../../../constants/"
+import "../../../services/"
+import "../../../styled/"
+import "../../../utils/"
 
-StyledButton {
+Clickable {
     id: root
 
     property bool showTemp: false
 
-    onClicked: {
+    implicitWidth: row.width
-        showTemp = !showTemp;
+    implicitHeight: Dimensions.cpu.height
+
+    Ref {
+        service: SystemInfo
     }
 
-    content: RowLayout {
+    onClicked: {
+        root.showTemp = !root.showTemp;
+    }
+
+    Row {
         id: row
-        Ref {
-            service: SystemInfo
-        }
         StyledText {
             id: icon
 
@@ -28,20 +32,26 @@ StyledButton {
             font.bold: true
             text: Icons.cpu
 
-            color: root.containsMouse ? Theme.palette.base300 : Theme.palette.basecontent
+            anchors.verticalCenter: parent.verticalCenter
+            topPadding: Dimensions.cpu.verticalPadding
+            bottomPadding: Dimensions.cpu.verticalPadding
+            leftPadding: Dimensions.cpu.horizontalPadding
         }
 
         StyledText {
             id: text
+            anchors.verticalCenter: parent.verticalCenter
+            topPadding: Dimensions.cpu.verticalPadding
+            bottomPadding: Dimensions.cpu.verticalPadding
+            rightPadding: Dimensions.cpu.horizontalPadding
 
             font.pixelSize: Dimensions.cpu.fontSize
-            text: ` ${(SystemInfo.cpuPerc * 100).toFixed()}%`
 
-            color: root.containsMouse ? Theme.palette.base300 : Theme.palette.basecontent
+            text: ` ${(SystemInfo.cpuPerc * 100).toFixed()}%`
 
             states: [
                 State {
-                    name: "showTemp"
+                    name: "temp"
                     when: root.showTemp
                     PropertyChanges {
                         text {

modules/bar/components/bluetooth/DeviceList.qml

@@ -26,14 +26,19 @@ ColumnLayout {
                     topPadding: 8
                     bottomPadding: 8
                     leftPadding: 8
-                    rightPadding: 8
                     text: device.modelData.deviceName
+                }
+                StyledText {
+                    font.family: Theme.lucide.font.family
+                    font.pixelSize: 10
+                    font.bold: true
+                    text: device.modelData.connected ? Icons.bluetoothConnected : Icons.bluetooth
+
+                    topPadding: 8
+                    bottomPadding: 8
+                    rightPadding: 8
+
                     color: device.containsMouse ? Theme.palette.base300 : Theme.palette.basecontent
-                    Behavior on color {
-                        ColorAnimation {
-                            duration: 200
-                        }
-                    }
                 }
             }
         }

widgets/StyledButton.qml

@@ -1,32 +0,0 @@
-import qs.config
-import QtQuick
-import Quickshell.Widgets
-
-WrapperMouseArea {
-    id: root
-    required property Component content
-    property alias padding: rectangle.margin
-    property alias color: rectangle.color
-    property alias border: rectangle.border
-    property alias radius: rectangle.radius
-
-    hoverEnabled: true
-    cursorShape: Qt.PointingHandCursor
-
-    WrapperRectangle {
-        id: rectangle
-        margin: 8
-        radius: 8
-        color: root.containsMouse && root.hoverEnabled ? Theme.palette.primary : Theme.palette.base100
-        Behavior on color {
-            ColorAnimation {
-                duration: 200
-                easing.type: Easing.InOutQuad
-            }
-        }
-        Loader {
-            active: true
-            sourceComponent: content
-        }
-    }
-}

widgets/StyledLabel.qml

@@ -1,17 +0,0 @@
-import qs.config
-import QtQuick
-import Quickshell.Widgets
-
-WrapperRectangle {
-    id: root
-    required property Component content
-    margin: 8
-    radius: 8
-    color: Theme.palette.base100
-    Behavior on color {
-        ColorAnimation {
-            duration: 200
-            easing.type: Easing.InOutQuad
-        }
-    }
-}

widgets/StyledText.qml

@@ -1,7 +0,0 @@
-import qs.config
-import QtQuick
-
-Text {
-    color: Theme.palette.basecontent
-    font.family: Theme.fontFamily
-}