non important commit

configuration/modules/dots/quick_shell/quick_config/config/assets/logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64" viewBox="0 0 60 60"><g fill-rule="evenodd"><use xlink:href="#B" fill="#5277c3"/><path d="M23.58 20.214L8.964 45.528 5.55 39.743l3.94-6.78-7.823-.02L0 30.052l1.703-2.956 11.135.035 4.002-6.9zM24.7 40.45h29.23l-3.302 5.85-7.84-.022 3.894 6.785-1.67 2.9-3.412.004-5.537-9.66-7.976-.016zm17.014-11.092L27.1 4.043l6.716-.063 3.902 6.8 3.93-6.765 3.337.002 1.7 2.953-5.598 9.626 3.974 6.916z" fill="#7ebae4"/><g fill="#5277c3"><use xlink:href="#B"/><path d="M35.28 19.486l-29.23-.002 3.303-5.848 7.84.022L13.3 6.873l1.67-2.9 3.412-.004 5.537 9.66 7.976.016zm1.14 20.294l14.616-25.313 3.413 5.785-3.94 6.78 7.823.02 1.668 2.9-1.703 2.956-11.135-.035-4.002 6.9z"/></g></g><defs ><path id="B" d="M18.305 30.642L32.92 55.956l-6.716.063-3.902-6.8-3.93 6.765-3.337-.002-1.71-2.953 5.598-9.626-3.974-6.916z"/></defs></svg>

configuration/modules/dots/quick_shell/quick_config/config/assets/power.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#000000" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 512 512" xml:space="preserve">
+<g>
+	<g>
+		<rect x="233.075" width="45.851" height="183.403"/>
+	</g>
+</g>
+<g>
+	<g>
+		<path d="M455.209,146.865c-23.994-37.197-57.767-66.878-97.67-85.836l-19.675,41.415c66.323,31.51,109.18,99.284,109.18,172.66
+			c0,105.342-85.703,191.045-191.045,191.045S64.955,380.447,64.955,275.104c0-73.376,42.857-141.15,109.18-172.66L154.46,61.029
+			c-39.902,18.958-73.676,48.64-97.67,85.836c-24.655,38.223-37.686,82.568-37.686,128.24C19.104,405.729,125.374,512,256,512
+			s236.896-106.271,236.896-236.896C492.896,229.433,479.865,185.087,455.209,146.865z"/>
+	</g>
+</g>
+</svg>

configuration/modules/dots/quick_shell/quick_config/config/shell.qml

@@ -2,10 +2,23 @@ pragma ComponentBehavior: Bound
 
 import Quickshell
 import QtQuick
+import QtQuick.Controls
 
 ShellRoot {
     id: root
 
+    property color bgColor: "#6a6365"
+    property color recColor: "#595254"
+    property color fontColor: "#FFFFFF"
+    property int fontSize: 14
+    property int barWidth: 50
+    property int recRadius: 8
+    property int recLength: 35
+    property int myMargin: 10
+    property int edgeMargin: 15
+
+    property bool expanderOpen: false
+
     SystemClock {
         id: clock
         precision: SystemClock.Minutes
@@ -18,19 +31,175 @@ ShellRoot {
             property var modelData
 
             screen: modelData
-
             anchors.top: true
             anchors.left: true
             anchors.bottom: true
-            implicitWidth: 50
+
-            color: "#9d8a90"
+            implicitWidth: root.barWidth
+            color: root.bgColor
+
+            Rectangle {
+                id: logo
+
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    top: parent.top
+                    topMargin: root.edgeMargin
+                }
+
+                implicitHeight: root.recLength
+                implicitWidth: root.recLength
+                color: root.recColor
+
+                bottomLeftRadius: root.recRadius
+                bottomRightRadius: root.recRadius
+                topLeftRadius: root.recRadius
+                topRightRadius: root.recRadius
+
+                Image {
+                    anchors.centerIn: parent
+                    source: "file://" + Quickshell.shellDir + "/assets/logo.svg"
+
+                    sourceSize.width: 30
+                    sourceSize.height: 30
+                }
+            }
+
+            Rectangle {
+                id: workspaces
+
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    top: logo.bottom
+                    topMargin: root.myMargin
+                }
+
+                implicitHeight: 200
+                implicitWidth: root.recLength
+                color: root.recColor
+
+                bottomLeftRadius: root.recRadius
+                bottomRightRadius: root.recRadius
+                topLeftRadius: root.recRadius
+                topRightRadius: root.recRadius
 
                 Text {
                     anchors.centerIn: parent
-                color: "#FFFFFF"
+                    color: root.fontColor
-                font.pixelSize: 14
+                    font.pixelSize: root.fontSize
+                    text: "ws"
+                }
+            }
+
+            Rectangle {
+                id: notifications
+
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    bottom: time.top
+                    bottomMargin: root.myMargin
+                }
+
+                implicitHeight: root.recLength
+                implicitWidth: root.recLength
+                color: root.recColor
+
+                bottomLeftRadius: root.recRadius
+                bottomRightRadius: root.recRadius
+                topLeftRadius: root.recRadius
+                topRightRadius: root.recRadius
+
+                Text {
+                    anchors.centerIn: parent
+                    color: root.fontColor
+                    font.pixelSize: root.fontSize
+                    text: "notif"
+                }
+            }
+
+            Rectangle {
+                id: time
+
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    bottom: power.top
+                    bottomMargin: root.myMargin
+                }
+
+                implicitHeight: root.recLength
+                implicitWidth: root.recLength
+                color: root.recColor
+
+                bottomLeftRadius: root.recRadius
+                bottomRightRadius: root.recRadius
+                topLeftRadius: root.recRadius
+                topRightRadius: root.recRadius
+
+                Text {
+                    anchors.centerIn: parent
+                    color: root.fontColor
+                    font.pixelSize: root.fontSize
                     text: Qt.formatDateTime(clock.date, "hh\nmm")
                 }
             }
+
+            Button {
+                id: power
+
+                anchors {
+                    horizontalCenter: parent.horizontalCenter
+                    bottom: parent.bottom
+                    bottomMargin: root.edgeMargin
+                }
+
+                implicitHeight: root.recLength - 4
+                implicitWidth: root.recLength - 4
+
+                onClicked: root.expanderOpen = !root.expanderOpen
+
+                Rectangle {
+                    anchors.centerIn: parent
+
+                    implicitHeight: root.recLength
+                    implicitWidth: root.recLength
+                    color: root.recColor
+
+                    bottomLeftRadius: root.recRadius
+                    bottomRightRadius: root.recRadius
+                    topLeftRadius: root.recRadius
+                    topRightRadius: root.recRadius
+
+                    Image {
+                        anchors.centerIn: parent
+                        source: "file://" + Quickshell.shellDir + "/assets/power.svg"
+
+                        sourceSize.width: 28
+                        sourceSize.height: 28
+                    }
+                }
+            }
+        }
+    }
+
+    PanelWindow {
+        visible: root.expanderOpen
+
+        anchors.left: true
+        anchors.bottom: true
+
+        implicitWidth: 200
+        implicitHeight: 150
+        color: "transparent"
+
+        Rectangle {
+            anchors.fill: parent
+            color: root.recColor
+
+            Text {
+                anchors.centerIn: parent
+                color: root.fontColor
+                text: "Power Menu"
+            }
+        }
     }
 }