styled wrapper rectangle

components/StyledWrapperRectangle.qml

@@ -0,0 +1,7 @@
+import qs.config
+import Quickshell.Widgets
+
+WrapperRectangle {
+    color: Theme.palette.base300
+    radius: 8
+}

modules/bar/components/bluetooth/BluetoothMenu.qml

@@ -1,5 +1,6 @@
 pragma ComponentBehavior: Bound
 
+import qs.components
 import qs.config
 import qs.widgets
 import QtQuick
@@ -7,7 +8,6 @@ import QtQuick.Controls
 import QtQuick.Layouts
 import Quickshell
 import Quickshell.Bluetooth
-import Quickshell.Widgets
 
 StyledPopupWindow {
     id: root
@@ -18,10 +18,8 @@ StyledPopupWindow {
 
     content: ColumnLayout {
         spacing: 8
-        WrapperRectangle {
+        StyledWrapperRectangle {
             margin: 16
-            color: Theme.palette.base200
-            radius: 8
             Layout.fillWidth: true
             RowLayout {
                 RowLayout {
@@ -51,10 +49,8 @@ StyledPopupWindow {
             }
         }
 
-        WrapperRectangle {
+        StyledWrapperRectangle {
             margin: 16
-            color: Theme.palette.base200
-            radius: 8
             ColumnLayout {
                 spacing: 8
 

modules/bar/components/notifications/NotificationMenu.qml

@@ -7,7 +7,6 @@ import qs.widgets
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
-import Quickshell.Widgets
 
 StyledPopupWindow {
     id: root
@@ -48,14 +47,10 @@ StyledPopupWindow {
                 implicitWidth: 300
                 clip: true
 
-                header: WrapperRectangle {
+                header: StyledText {
-                    margin: 8
+                    text: "Notifications"
-                    color: 'transparent'
+                    font.bold: true
-                    StyledText {
+                    font.pixelSize: 16
-                        text: "Notifications"
-                        font.bold: true
-                        font.pixelSize: 16
-                    }
                 }
                 model: Notifications.list
                 delegate: NotificationItem {}

modules/drawers/dashboard/Dashboard.qml

@@ -1,22 +1,18 @@
 pragma ComponentBehavior: Bound
 
 import qs.components
-import qs.config
 import qs.constants
 import qs.services
 import qs.widgets
 import QtQuick
 import QtQuick.Layouts
-import Quickshell.Widgets
 
 StyledDrawer {
     id: root
 
     visible: Visibility.dashboard
 
-    WrapperRectangle {
+    StyledWrapperRectangle {
-        color: Theme.palette.base200
-        radius: 8
         margin: 32
         ColumnLayout {
             spacing: 8

modules/launcher/Launcher.qml

@@ -1,13 +1,13 @@
 pragma ComponentBehavior: Bound
 
 import "services"
+import qs.components
 import qs.config
 import qs.constants
 import qs.services
 import qs.widgets
 import Quickshell.Hyprland
 import Quickshell.Wayland
-import Quickshell.Widgets
 import QtQuick
 import QtQuick.Layouts
 
@@ -36,22 +36,18 @@ StyledWindow {
         search.clear();
     }
 
-    WrapperRectangle {
+    StyledWrapperRectangle {
         id: rect
 
-        color: Theme.palette.base300
         margin: 18
-        radius: 8
 
         ColumnLayout {
-            WrapperRectangle {
+            StyledWrapperRectangle {
                 id: searchWrapper
 
                 Layout.fillWidth: true
                 Layout.alignment: Qt.AlignTop
-                color: Theme.palette.base200
                 margin: 4
-                radius: 8
 
                 RowLayout {
                     LucideIcon {

modules/pomodoro/Pomodoro.qml

@@ -7,7 +7,6 @@ import qs.services
 import qs.widgets
 import Quickshell.Hyprland
 import Quickshell.Wayland
-import Quickshell.Widgets
 import QtQuick
 import QtQuick.Layouts
 
@@ -22,15 +21,13 @@ StyledWindow {
     WlrLayershell.layer: WlrLayer.Top
     WlrLayershell.keyboardFocus: root.visible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
 
-    WrapperRectangle {
+    StyledWrapperRectangle {
         id: rect
 
-        color: Theme.palette.base300
         leftMargin: 48
         rightMargin: 48
         topMargin: 24
         bottomMargin: 24
-        radius: 8
 
         HyprlandFocusGrab {
             active: Visibility.pomodoro

modules/powermenu/PowerMenu.qml

@@ -1,12 +1,12 @@
 pragma ComponentBehavior: Bound
 
+import qs.components
 import qs.config
 import qs.services
 import qs.widgets
 import Quickshell.Hyprland
 import Quickshell.Io
 import Quickshell.Wayland
-import Quickshell.Widgets
 import QtQuick
 import QtQuick.Layouts
 
@@ -25,7 +25,7 @@ StyledWindow {
         id: process
     }
 
-    WrapperRectangle {
+    StyledWrapperRectangle {
         id: rect
 
         color: Theme.palette.base300

modules/storybook/Storybook.qml

@@ -1,13 +1,11 @@
 pragma ComponentBehavior: Bound
 
 import qs.components
-import qs.config
 import qs.constants
 import qs.services
 import qs.widgets
 import Quickshell.Hyprland
 import Quickshell.Wayland
-import Quickshell.Widgets
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
@@ -23,12 +21,10 @@ StyledWindow {
     WlrLayershell.layer: WlrLayer.Top
     WlrLayershell.keyboardFocus: root.visible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
 
-    WrapperRectangle {
+    StyledWrapperRectangle {
         id: rect
 
-        color: Theme.palette.base300
         margin: 48
-        radius: 8
 
         HyprlandFocusGrab {
             active: Visibility.storybook
@@ -53,7 +49,7 @@ StyledWindow {
 
             ColumnLayout {
                 StyledText {
-                    text: "Switch"
+                    text: "Icon Button"
                     font.pixelSize: 18
                 }
                 StyledIconButton {