make theme picker searchable

modules/applets/ThemeSwitcher.qml

@@ -3,6 +3,8 @@ import Quickshell
 import Quickshell.Io
 import QtQuick
 import QtQuick.Layouts
+import QtQuick.Controls
+import QtQml.Models
 import Qt.labs.folderlistmodel 2.11
 
 import qs
@@ -12,29 +14,46 @@ import qs.modules.Services
 
 Rectangle {
     id: child
-    implicitWidth: 800
+    implicitWidth: contentLayout.implicitWidth + contentLayout.anchors.margins * 2+ container.anchors.margins * 2
     implicitHeight: 600
-    color: Colors.c.base01
+    color: Colors.c.base00
     radius: Config.cfg.appearance.rounding
     MouseArea {
         acceptedButtons: Qt.AllButtons
         anchors.fill: parent
     }
     FolderListModel {
-	id: schemeModel
-	folder: Qt.resolvedUrl(Quickshell.shellDir + "/schemes/")
+        id: schemeModel
+        folder: Qt.resolvedUrl(Quickshell.shellDir + "/schemes/")
+        nameFilters: searchBar.text == "" ? [] : ["*" + searchBar.text + "*"]
     }
     Rectangle {
+	id: container
         anchors.fill: parent
         anchors.centerIn: parent
         anchors.margins: 10
         radius: Config.cfg.appearance.rounding
-        color: Colors.c.base01
+        color: Colors.c.base00
         clip: true
-        RowLayout {
+        ColumnLayout {
             id: contentLayout
             anchors.fill: parent
             anchors.margins: 30
+	    anchors.centerIn: parent
+	    spacing: 40
+            TextField {
+                id: searchBar
+                placeholderText: "enter scheme name:"
+                placeholderTextColor: Colors.c.base04
+                leftPadding: 10
+                background: Rectangle {
+                    color: Colors.c.base02
+                    implicitWidth: 300
+                    implicitHeight: 30
+                    radius: Config.cfg.appearance.rounding
+                }
+            }
+
             ListView {
                 id: schemeList
                 spacing: 5
@@ -44,7 +63,7 @@ Rectangle {
                 delegate: Rectangle {
                     id: container
                     required property var modelData
-		    
+
                     color: Colors.c.base02
                     height: 30
                     radius: Config.cfg.appearance.rounding
@@ -72,10 +91,6 @@ Rectangle {
                     }
                 }
             }
-            StyledText {
-                id: currentScheme
-                text: Config.cfg.appearance.currentTheme
-            }
         }
     }
 }

modules/bar/Bar.qml

@@ -23,7 +23,7 @@ Variants {
         margins.left: Config.cfg.bar.floating ? 10 : 0
         margins.right: Config.cfg.bar.floating ? 10 : 0
         Rectangle {
-            color: Colors.c.base00
+            color: Colors.c.base01
             radius: Config.cfg.bar.floating ? Config.cfg.appearance.rounding : 0
 	    anchors.fill: parent
 	    implicitHeight: parent.height

settings/settings.json

@@ -1,7 +1,7 @@
 {
     "appearance": {
         "accent": "base0D",
-        "currentTheme": "base16-gruvbox-dark.json",
+        "currentTheme": "base16-rose-pine.json",
         "font": "Inter",
         "fontSize": 14,
         "iconSize": 16,
@@ -14,6 +14,6 @@
     },
     "wallpaper": {
         "wallDir": "/home/lucy/.walls/",
-        "wallpaper": "/home/lucy/.walls/lain_wallpaper.png"
+        "wallpaper": "/home/lucy/.walls/lain_room.png"
     }
 }

widgets/BarComponent.qml

@@ -6,7 +6,7 @@ import qs.settings
 Rectangle {
     property color accent: Colors.c.base02
     property bool active: false
-    color: active ? Colors.c.base02 : Colors.c.base01
+    color: active ? Colors.c.base03 : Colors.c.base02
     implicitHeight: Config.cfg.bar.height - 8
     radius: Config.cfg.appearance.rounding - 4
     border.width: 1