From 8ba0567d2823c9dd4ab15d1b4a7ebeeb67381875 Mon Sep 17 00:00:00 2001
From: Benjamin Palko <benjaminpalko@hotmail.com>
Date: Thu, 11 Sep 2025 23:57:12 -0400
Subject: [PATCH] vertical tabs on configuration

---
 modules/configuration/Configuration.qml | 83 ++++++++++++-------------
 modules/configuration/StylingView.qml   | 25 ++++++++
 modules/configuration/ThemeConfig.qml   |  5 --
 modules/storybook/Storybook.qml         |  2 -
 4 files changed, 65 insertions(+), 50 deletions(-)
 create mode 100644 modules/configuration/StylingView.qml
 delete mode 100644 modules/configuration/ThemeConfig.qml

diff --git a/modules/configuration/Configuration.qml b/modules/configuration/Configuration.qml
index d64fe74..5684f30 100644
--- a/modules/configuration/Configuration.qml
+++ b/modules/configuration/Configuration.qml
@@ -1,9 +1,7 @@
 import qs.components
-import qs.config
 import qs.services
 import QtQuick
 import QtQuick.Controls
-import QtQuick.Layouts
 
 StyledPanelWindow {
     id: window
@@ -14,53 +12,52 @@ StyledPanelWindow {
     implicitWidth: 800
     implicitHeight: 400
 
-    ColumnLayout {
-        spacing: 0
-        anchors.fill: parent
-        StyledText {
-            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+    StyledTabBar {
+        id: tabs
+        anchors.top: parent.top
+        anchors.left: parent.left
+        anchors.bottom: parent.bottom
+        anchors.right: view.left
 
-            text: "Configurations"
-            font.pixelSize: Styling.typography.textSize.xl
-            padding: 8
+        implicitWidth: 200
+        orientation: ListView.Vertical
+
+        StyledTabButton {
+            anchors.left: parent.left
+            anchors.right: parent.right
+
+            text: "General"
         }
-
-        StyledRectangle {
-            id: titleBar
-
-            Layout.fillWidth: true
-            Layout.preferredHeight: 4
+        StyledTabButton {
+            anchors.left: parent.left
+            anchors.right: parent.right
+            text: "Styling"
         }
+    }
+
+    SwipeView {
+        id: view
+
+        anchors.top: parent.top
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
+        anchors.left: tabs.right
+
+        clip: true
+        orientation: Qt.Vertical
+
+        currentIndex: tabs.currentIndex
 
         ScrollView {
-            id: view
-
-            Layout.fillHeight: true
-            padding: 24
-            background: Item {}
-
-            GridLayout {
-
-                columnSpacing: Styling.layout.spacing.xl
-
-                StyledText {
-                    text: "Theme"
-                    // font.bold: true
-                    font.pixelSize: Styling.typography.textSize.lg
-                }
-
-                StyledComboBox {
-                    currentIndex: Theme.themes.indexOf(Theme.currentTheme)
-                    model: Theme.themes
-                    onActivated: index => {
-                        Theme.currentTheme = Theme.themes[index];
-                    }
-                }
+            padding: 36
+            StyledPane {
+                anchors.left: parent.left
+                anchors.right: parent.right
             }
         }
-    }
-
-    component Menus: QtObject {
-        property Component theme
+        ScrollView {
+            padding: 36
+            StylingView {}
+        }
     }
 }
diff --git a/modules/configuration/StylingView.qml b/modules/configuration/StylingView.qml
new file mode 100644
index 0000000..731ecaf
--- /dev/null
+++ b/modules/configuration/StylingView.qml
@@ -0,0 +1,25 @@
+import qs.components
+import qs.config
+import QtQuick
+import QtQuick.Layouts
+
+StyledPane {
+    GridLayout {
+
+        columnSpacing: Styling.layout.spacing.xl
+
+        StyledText {
+            text: "Theme"
+            // font.bold: true
+            font.pixelSize: Styling.typography.textSize.lg
+        }
+
+        StyledComboBox {
+            currentIndex: Theme.themes.indexOf(Theme.currentTheme)
+            model: Theme.themes
+            onActivated: index => {
+                Theme.currentTheme = Theme.themes[index];
+            }
+        }
+    }
+}
diff --git a/modules/configuration/ThemeConfig.qml b/modules/configuration/ThemeConfig.qml
deleted file mode 100644
index b2e4f9e..0000000
--- a/modules/configuration/ThemeConfig.qml
+++ /dev/null
@@ -1,5 +0,0 @@
-import QtQuick
-import QtQuick.Layouts
-import Quickshell
-
-GridLayout {}
diff --git a/modules/storybook/Storybook.qml b/modules/storybook/Storybook.qml
index 8cc9dcf..fdb17b6 100644
--- a/modules/storybook/Storybook.qml
+++ b/modules/storybook/Storybook.qml
@@ -60,7 +60,6 @@ StyledPanelWindow {
             currentIndex: tabs.currentIndex
 
             ScrollView {
-                Layout.fillWidth: true
                 padding: 36
                 Fields {}
             }
@@ -69,7 +68,6 @@ StyledPanelWindow {
                 Selectors {}
             }
             ScrollView {
-                Layout.fillWidth: true
                 padding: 36
                 Components {}
             }