formatting tabs

components/StyledTabBar.qml

@@ -5,21 +5,15 @@ TabBar {
     id: control
 
     property alias orientation: view.orientation
-    spacing: 12
 
-    contentItem: Item {
+    contentItem: ListView {
-        ListView {
         id: view
-            anchors.centerIn: parent
-            implicitWidth: parent.width - 20
-            implicitHeight: parent.height - 20
         model: control.contentModel
         currentIndex: control.currentIndex
         spacing: control.spacing
         orientation: ListView.Horizontal
         boundsBehavior: Flickable.StopAtBounds
     }
-    }
 
     background: Item {}
 }

components/StyledTabButton.qml

@@ -6,7 +6,7 @@ TabButton {
     id: control
 
     property alias radius: rectangle.radius
-    padding: 10
+    padding: 8
     radius: Styling.theme.radiusField
 
     contentItem: Text {
@@ -15,7 +15,6 @@ TabButton {
         text: control.text
         verticalAlignment: Text.AlignVCenter
         horizontalAlignment: Text.AlignHCenter
-        padding: 6
         color: control.hovered ? Styling.theme.primarycontent : Styling.theme.basecontent
         Behavior on color {
             ColorAnimation {

modules/configuration/Configuration.qml

@@ -4,6 +4,7 @@ import qs.services
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
+import Quickshell.Widgets
 
 StyledPanelWindow {
     id: window
@@ -13,21 +14,25 @@ StyledPanelWindow {
     visible: Visibility.configuration
     implicitWidth: 800
     implicitHeight: 400
+    padding: 8
     background.color: Styling.theme.base200
 
     onFocusedChanged: {
         Visibility.configuration = focused;
     }
 
+    GridLayout {
+
+        anchors.fill: parent
+
         StyledTabBar {
             id: tabs
-        anchors.top: parent.top
-        anchors.left: parent.left
-        anchors.bottom: parent.bottom
-        anchors.right: view.left
 
-        implicitWidth: 150
+            Layout.preferredWidth: 150
+            Layout.fillHeight: true
+            Layout.margins: 2
             orientation: ListView.Vertical
+            spacing: 12
 
             Repeater {
                 model: views.data
@@ -65,13 +70,8 @@ StyledPanelWindow {
         SwipeView {
             id: view
 
-        anchors.top: parent.top
+            Layout.fillWidth: true
-        anchors.right: parent.right
+            Layout.fillHeight: true
-        anchors.bottom: parent.bottom
-        anchors.left: tabs.right
-        anchors.topMargin: 4
-        anchors.rightMargin: 4
-        anchors.bottomMargin: 4
 
             clip: true
             orientation: Qt.Vertical
@@ -97,6 +97,7 @@ StyledPanelWindow {
                 }
             }
         }
+    }
 
     Item {
         id: views