From 8d3cafbb049b2ff6c86a515db0f24d0af0ec2535 Mon Sep 17 00:00:00 2001
From: Joshua Goins <josh@redstrate.com>
Date: Sat, 25 Jan 2025 19:55:31 -0500
Subject: [PATCH] DiscoverPage: Improve the look of the search bar

Self-explanatory, this makes it look way prettier and less looking like
it was stapled to the top of this page.
---
 src/qml/DiscoverPage.qml | 49 ++++++++++++++++++++++++++--------------
 1 file changed, 32 insertions(+), 17 deletions(-)

diff --git a/src/qml/DiscoverPage.qml b/src/qml/DiscoverPage.qml
index 9eeb8292..664e0811 100644
--- a/src/qml/DiscoverPage.qml
+++ b/src/qml/DiscoverPage.qml
@@ -18,27 +18,42 @@ Kirigami.ScrollablePage {
     title: i18nc("@title of page allowing to search for new podcasts online", "Discover")
     property var feedModel: ""
 
-    header: RowLayout {
-        width: parent.width
-        anchors.topMargin: Kirigami.Units.smallSpacing
 
-        Kirigami.SearchField {
-            id: textField
-            placeholderText: i18n("Search podcastindex.org")
-            Layout.fillWidth: true
-            Layout.leftMargin: Kirigami.Units.smallSpacing
-            Keys.onReturnPressed: {
-                searchButton.clicked()
+    header: Controls.Control {
+        padding: Kirigami.Units.largeSpacing
+
+        Kirigami.Theme.colorSet: Kirigami.Theme.Window
+        Kirigami.Theme.inherit: false
+
+        background: Rectangle {
+            color: Kirigami.Theme.backgroundColor
+
+            Kirigami.Separator {
+                anchors {
+                    left: parent.left
+                    bottom: parent.bottom
+                    right: parent.right
+                }
             }
         }
 
-        Controls.Button {
-            id: searchButton
-            text: isWidescreen ? i18n("Search") : ""
-            icon.name: "search"
-            Layout.rightMargin: Kirigami.Units.smallSpacing
-            onClicked: {
-                podcastSearchModel.search(textField.text);
+        contentItem: RowLayout {
+            Kirigami.SearchField {
+                id: textField
+                placeholderText: i18n("Search podcastindex.org")
+                Layout.fillWidth: true
+                Keys.onReturnPressed: {
+                    searchButton.clicked()
+                }
+            }
+
+            Controls.Button {
+                id: searchButton
+                text: isWidescreen ? i18n("Search") : ""
+                icon.name: "search"
+                onClicked: {
+                    podcastSearchModel.search(textField.text);
+                }
             }
         }
     }