add wayland and hyprland focus

components/StyledTabBar.qml

@@ -1,18 +1,23 @@
 import QtQuick
-import QtQuick.Controls.Basic
+import QtQuick.Controls
 
 TabBar {
     id: control
 
     property alias orientation: view.orientation
 
-    contentItem: ListView {
+    contentItem: Item {
-        id: view
+        ListView {
-        model: control.contentModel
+            id: view
-        currentIndex: control.currentIndex
+            anchors.centerIn: parent
-        spacing: control.spacing
+            implicitWidth: parent.width - 20
-        orientation: ListView.Horizontal
+            implicitHeight: parent.height - 20
-        boundsBehavior: Flickable.StopAtBounds
+            model: control.contentModel
+            currentIndex: control.currentIndex
+            spacing: control.spacing
+            orientation: ListView.Horizontal
+            boundsBehavior: Flickable.StopAtBounds
+        }
     }
 
     background: Item {}

components/StyledTabButton.qml

@@ -1,6 +1,6 @@
 import qs.config
 import QtQuick
-import QtQuick.Controls.Basic
+import QtQuick.Controls
 
 TabButton {
     id: control
@@ -14,31 +14,28 @@ TabButton {
         verticalAlignment: Text.AlignVCenter
         horizontalAlignment: Text.AlignHCenter
         padding: 6
-        color: control.hovered ? Styling.theme.primarycontent : control.checked ? Styling.theme.accent : Styling.theme.basecontent
+        color: control.hovered ? Styling.theme.primarycontent : Styling.theme.basecontent
         Behavior on color {
             ColorAnimation {
                 duration: Styling.animations.speed.normal
             }
         }
-        rotation: control.rotation
-        Behavior on rotation {
-            RotationAnimation {
-                duration: Styling.animations.speed.slow
-                easing.type: Easing.OutQuad
-            }
-        }
     }
 
     background: Rectangle {
         id: rectangle
-        color: control.hovered ? Styling.theme.primary : Styling.theme.base200
+        color: control.hovered ? Styling.theme.primary : Styling.theme.base100
         Behavior on color {
             ColorAnimation {
                 duration: Styling.animations.speed.normal
             }
         }
-        border.width: 2
+        opacity: control.checked || control.hovered ? 1.0 : 0.0
-        border.color: control.checked ? Styling.theme.accent : "transparent"
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Styling.animations.speed.normal
+            }
+        }
     }
 
     HoverHandler {

modules/configuration/Configuration.qml

@@ -2,6 +2,8 @@ import qs.components
 import qs.services
 import QtQuick
 import QtQuick.Controls
+import Quickshell.Hyprland
+import Quickshell.Wayland
 
 StyledPanelWindow {
     id: window
@@ -12,6 +14,17 @@ StyledPanelWindow {
     implicitWidth: 800
     implicitHeight: 400
 
+    WlrLayershell.layer: WlrLayer.Top
+    WlrLayershell.keyboardFocus: window.visible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
+
+    HyprlandFocusGrab {
+        active: Visibility.configuration
+        windows: [window]
+        onCleared: {
+            Visibility.configuration = false;
+        }
+    }
+
     StyledTabBar {
         id: tabs
         anchors.top: parent.top