power menu!!!

config/Theme.qml

@@ -16,16 +16,24 @@ Singleton {
         id: palette
 
         property color primary: "#1fb854"
+        property color primarycontent: "#000000"
         property color secondary: "#1eb88e"
+        property color secondarycontent: "#000c07"
         property color accent: "#1fb8ab"
+        property color accentcontent: "#010c0b"
         property color neutral: "#19362d"
+        property color neutralcontent: "#cdd3d1"
         property color base100: "#1b1717"
         property color base200: "#161212"
         property color base300: "#110d0d"
         property color basecontent: "#cac9c9"
         property color info: "#00b5ff"
+        property color infocontent: "#000000"
         property color success: "#00a96e"
+        property color successcontent: "#000000"
         property color warning: "#ffbe00"
+        property color warningcontent: "#000000"
         property color error: "#ff5861"
+        property color errorcontent: "#000000"
     }
 }

modules/Shell.qml

@@ -0,0 +1,20 @@
+import "bar"
+import "powermenu"
+import Quickshell
+import Quickshell.Wayland
+import Quickshell.Hyprland
+import QtQuick
+import QtQuick.Effects
+
+Variants {
+    model: Quickshell.screens
+
+    Scope {
+        id: scope
+
+        required property ShellScreen modelData
+
+        Bar {}
+        PowerMenu {}
+    }
+}

modules/Shortcuts.qml

@@ -1,3 +1,4 @@
+import qs.services
 import qs.widgets
 import Quickshell
 
@@ -11,4 +12,10 @@ Scope {
             console.log("Launcher shortcut pressed");
         }
     }
+
+    LuxShortcut {
+        name: 'power-menu'
+        description: 'Open the Power Menu'
+        onPressed: Visibility.powermenu = !Visibility.powermenu
+    }
 }

modules/bar/Bar.qml

@@ -8,107 +8,105 @@ import "components/hyprland"
 import "components/notifications"
 import "components/tray"
 
-Scope {
+PanelWindow {
-    PanelWindow {
+    id: parentWindow
-        id: parentWindow
 
-        anchors.top: true
+    anchors.top: true
-        anchors.left: true
+    anchors.left: true
-        anchors.right: true
+    anchors.right: true
 
-        implicitHeight: Dimensions.bar.height
+    implicitHeight: Dimensions.bar.height
-        color: 'transparent'
+    color: 'transparent'
 
-        Item {
+    Item {
 
+        anchors.fill: parent
+        anchors.leftMargin: Dimensions.bar.horizontalMargins
+        anchors.rightMargin: Dimensions.bar.horizontalMargins
+        anchors.topMargin: Dimensions.bar.verticalMargins
+        anchors.bottomMargin: Dimensions.bar.verticalMargins
+
+        Rectangle {
+            id: background
             anchors.fill: parent
-            anchors.leftMargin: Dimensions.bar.horizontalMargins
+            color: Theme.palette.base300
-            anchors.rightMargin: Dimensions.bar.horizontalMargins
+            radius: Dimensions.radius
-            anchors.topMargin: Dimensions.bar.verticalMargins
-            anchors.bottomMargin: Dimensions.bar.verticalMargins
 
-            Rectangle {
+            border {
-                id: background
+                color: Theme.palette.base100
-                anchors.fill: parent
+                width: Dimensions.bar.border
-                color: Theme.palette.base300
+                pixelAligned: true
-                radius: Dimensions.radius
+            }
+        }
 
-                border {
+        RowLayout {
-                    color: Theme.palette.base100
+            id: leftbar
-                    width: Dimensions.bar.border
+
-                    pixelAligned: true
+            anchors.left: parent.left
-                }
+            anchors.verticalCenter: parent.verticalCenter
+
+            anchors.leftMargin: Dimensions.bar.horizontalPadding
+            anchors.topMargin: Dimensions.bar.verticalPadding
+            anchors.bottomMargin: Dimensions.bar.verticalPadding
+
+            spacing: Dimensions.bar.spacing
+
+            SystemLogo {
+                implicitSize: 22
             }
 
-            RowLayout {
+            Workspaces {}
-                id: leftbar
 
-                anchors.left: parent.left
+            Tray {}
-                anchors.verticalCenter: parent.verticalCenter
+        }
 
-                anchors.leftMargin: Dimensions.bar.horizontalPadding
+        RowLayout {
-                anchors.topMargin: Dimensions.bar.verticalPadding
+            id: centerbar
-                anchors.bottomMargin: Dimensions.bar.verticalPadding
 
-                spacing: Dimensions.bar.spacing
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
 
-                SystemLogo {
+            anchors.topMargin: Dimensions.bar.verticalPadding
-                    implicitSize: 22
+            anchors.bottomMargin: Dimensions.bar.verticalPadding
-                }
 
-                Workspaces {}
+            spacing: Dimensions.bar.spacing
 
-                Tray {}
+            Mpris {}
-            }
+        }
 
-            RowLayout {
+        RowLayout {
-                id: centerbar
+            id: rightbar
 
-                anchors.horizontalCenter: parent.horizontalCenter
+            anchors.right: parent.right
-                anchors.verticalCenter: parent.verticalCenter
+            anchors.verticalCenter: parent.verticalCenter
 
-                anchors.topMargin: Dimensions.bar.verticalPadding
+            anchors.rightMargin: Dimensions.bar.horizontalPadding
-                anchors.bottomMargin: Dimensions.bar.verticalPadding
+            anchors.topMargin: Dimensions.bar.verticalPadding
+            anchors.bottomMargin: Dimensions.bar.verticalPadding
 
-                spacing: Dimensions.bar.spacing
+            spacing: Dimensions.bar.spacing
 
-                Mpris {}
+            Pywal {}
-            }
 
-            RowLayout {
+            Pipewire {}
-                id: rightbar
 
-                anchors.right: parent.right
+            Caffeine {}
-                anchors.verticalCenter: parent.verticalCenter
 
-                anchors.rightMargin: Dimensions.bar.horizontalPadding
+            Network {}
-                anchors.topMargin: Dimensions.bar.verticalPadding
-                anchors.bottomMargin: Dimensions.bar.verticalPadding
 
-                spacing: Dimensions.bar.spacing
+            Bluetooth {}
 
-                Pywal {}
+            Storage {}
 
-                Pipewire {}
+            Memory {}
 
-                Caffeine {}
+            Cpu {}
 
-                Network {}
+            Gpu {}
 
-                Bluetooth {}
+            Clock {}
 
-                Storage {}
+            Notifications {}
-
-                Memory {}
-
-                Cpu {}
-
-                Gpu {}
-
-                Clock {}
-
-                Notifications {}
-            }
         }
     }
 }

modules/powermenu/PowerMenu.qml

@@ -0,0 +1,127 @@
+pragma ComponentBehavior: Bound
+
+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
+
+StyledWindow {
+    id: root
+    name: "powermenu"
+
+    visible: Visibility.powermenu
+    implicitWidth: rect.width
+    implicitHeight: rect.height
+
+    WlrLayershell.layer: WlrLayer.Top
+    WlrLayershell.keyboardFocus: root.visible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
+
+    Process {
+        id: process
+    }
+
+    WrapperRectangle {
+        id: rect
+
+        color: Theme.palette.base300
+        margin: 14
+        radius: 8
+
+        HyprlandFocusGrab {
+            active: Visibility.powermenu
+            windows: [root]
+            onCleared: {
+                Visibility.powermenu = false;
+            }
+        }
+
+        StyledListView {
+            id: list
+
+            Layout.fillWidth: true
+
+            focus: Visibility.powermenu
+            Keys.onEscapePressed: event => {
+                event.accepted = true;
+                root.visible = false;
+            }
+            Keys.onEnterPressed: event => {
+                event.accepted = true;
+                console.log(list.currentItem.command);
+            }
+            Keys.onUpPressed: event => {
+                event.accepted = true;
+                list.decrementCurrentIndex();
+            }
+            Keys.onDownPressed: event => {
+                event.accepted = true;
+                list.incrementCurrentIndex();
+            }
+
+            model: [
+                {
+                    text: "󰍃 Logout",
+                    command: "hyprctl dispatch exit"
+                },
+                {
+                    text: "󰜉 Reboot",
+                    command: "systemctl reboot"
+                },
+                {
+                    text: " Shutdown",
+                    command: "systemctl poweroff"
+                }
+            ]
+
+            spacing: 8
+
+            implicitWidth: 220
+            implicitHeight: 185
+
+            highlightMoveDuration: 1000
+            highlightResizeDuration: 0
+            highlight: Rectangle {
+                radius: 8
+                color: Theme.palette.primary
+            }
+
+            onCurrentItemChanged: {
+                process.command = ["sh", "-c", list.currentItem.modelData.command];
+            }
+
+            delegate: StyledText {
+                id: button
+                required property var modelData
+                required property int index
+
+                anchors.left: parent.left
+                anchors.right: parent.right
+
+                MouseArea {
+                    hoverEnabled: true
+                    anchors.fill: button
+                    onEntered: {
+                        console.log("blyat");
+                        list.currentIndex = button.index;
+                    }
+                    onClicked: {
+                        console.log(process.command);
+                        process.running = true;
+                        // process.startDetached();
+                    }
+                }
+
+                padding: 16
+                color: list.currentIndex == index ? Theme.palette.primarycontent : Theme.palette.basecontent
+                text: modelData.text
+                font.pixelSize: 18
+                font.bold: true
+            }
+        }
+    }
+}

services/Visibility.qml

@@ -4,6 +4,7 @@ import qs.widgets
 import Quickshell
 
 Singleton {
+    property bool powermenu
     property StyledPopupWindow activePopup
 
     function togglePopup(popup: StyledPopupWindow) {

shell.qml

@@ -2,12 +2,11 @@
 
 import Quickshell
 import "modules"
-import "modules/bar"
 
 ShellRoot {
     ReloadPopup {}
 
-    Bar {}
+    Shell {}
 
     Shortcuts {}
 }

widgets/StyledText.qml

@@ -2,6 +2,12 @@ import qs.config
 import QtQuick
 
 Text {
-    color: Theme.palette.basecontent
     font.family: Theme.fontFamily
+    color: Theme.palette.basecontent
+    Behavior on color {
+        ColorAnimation {
+            duration: 200
+            easing.type: Easing.InOutQuad
+        }
+    }
 }