From 40b5409c196bea7f2e94dface9abd3b5eb73d76d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Danielle=20For=C3=A9?= <danielle@elementary.io>
Date: Thu, 29 Feb 2024 12:17:45 -0800
Subject: [PATCH] SettingsSidebar: add a show_title_buttons option

---
 data/styles/Index.scss           |  1 +
 data/styles/Plug.scss            | 31 ++++++++++++++++++++++++++++
 data/styles/SettingsSidebar.scss | 35 ++++++++++++++++++--------------
 lib/SettingsSidebar.vala         | 20 +++++++++++++++++-
 4 files changed, 71 insertions(+), 16 deletions(-)
 create mode 100644 data/styles/Plug.scss

diff --git a/data/styles/Index.scss b/data/styles/Index.scss
index 83ba2a19..393183b8 100644
--- a/data/styles/Index.scss
+++ b/data/styles/Index.scss
@@ -2,5 +2,6 @@
 @import '_common.scss';
 
 @import 'CategoryView.scss';
+@import 'Plug.scss';
 @import 'SettingsPage.scss';
 @import 'SettingsSidebar.scss';
diff --git a/data/styles/Plug.scss b/data/styles/Plug.scss
new file mode 100644
index 00000000..0350263d
--- /dev/null
+++ b/data/styles/Plug.scss
@@ -0,0 +1,31 @@
+toolbarview {
+    &.undershoot-top scrolledwindow {
+        overshoot.top {
+            background:
+                linear-gradient(
+                    to top,
+                    #{'alpha(@accent_color, 0)'} 80%,
+                    #{'alpha(@accent_color, 0.25)'} 100%
+                ),
+                linear-gradient(
+                    #{'@borders'},
+                    rgba(black, 0.05) 1px,
+                    rgba(black, 0.0) rem(3px)
+                );
+        }
+
+        undershoot.top {
+            background:
+                linear-gradient(
+                    #{'@borders'},
+                    rgba(black, 0.05) 1px,
+                    rgba(black, 0.0) rem(3px)
+                );
+        }
+    }
+
+    headerbar {
+        background: inherit;
+        box-shadow: none;
+    }
+}
diff --git a/data/styles/SettingsSidebar.scss b/data/styles/SettingsSidebar.scss
index f3512eb2..98ac0db4 100644
--- a/data/styles/SettingsSidebar.scss
+++ b/data/styles/SettingsSidebar.scss
@@ -1,23 +1,28 @@
-settingssidebar list {
-    min-width: rem(200px);
+settingssidebar {
+    background: #{'@insensitive_bg_color'};
 
-    row,
-    > .title-4 {
-        padding: rem(6px);
-    }
+    list {
+        background: inherit;
+        min-width: rem(200px);
 
-    row {
-        overlay {
-            // IconSize.LARGE + padding
-            min-width: calc(32px + #{rem(6px)});
+        row,
+        > .title-4 {
+            padding: rem(6px);
         }
 
-        overlay:dir(ltr) {
-            margin-right: rem(6px);
-        }
+        row {
+            overlay {
+                // IconSize.LARGE + padding
+                min-width: calc(32px + #{rem(6px)});
+            }
+
+            overlay:dir(ltr) {
+                margin-right: rem(6px);
+            }
 
-        overlay:dir(rtl) {
-            margin-left: rem(6px);
+            overlay:dir(rtl) {
+                margin-left: rem(6px);
+            }
         }
     }
 }
diff --git a/lib/SettingsSidebar.vala b/lib/SettingsSidebar.vala
index 1e9b4a37..7ae56f33 100644
--- a/lib/SettingsSidebar.vala
+++ b/lib/SettingsSidebar.vala
@@ -18,6 +18,11 @@ public class Switchboard.SettingsSidebar : Gtk.Widget {
      */
     public Gtk.Stack stack { get; construct; }
 
+    /**
+     * Whether to show back and title buttons in the header area
+     */
+    public bool show_title_buttons { get; set;}
+
     /**
      * The name of the currently visible Granite.SettingsPage
      */
@@ -75,7 +80,18 @@ public class Switchboard.SettingsSidebar : Gtk.Widget {
             hscrollbar_policy = Gtk.PolicyType.NEVER,
             child = listbox
         };
-        scrolled.set_parent (this);
+
+        var headerbar = new Adw.HeaderBar () {
+            show_end_title_buttons = false,
+            show_title = false
+        };
+
+        var toolbarview = new Adw.ToolbarView () {
+            content = scrolled,
+            top_bar_style = FLAT
+        };
+        toolbarview.add_top_bar (headerbar);
+        toolbarview.set_parent (this);
 
         on_sidebar_changed ();
         stack.pages.items_changed.connect (on_sidebar_changed);
@@ -100,6 +116,8 @@ public class Switchboard.SettingsSidebar : Gtk.Widget {
         stack.notify["visible-child-name"].connect (() => {
             visible_child_name = stack.visible_child_name;
         });
+
+        bind_property ("show-title-buttons", toolbarview, "reveal-top-bars", SYNC_CREATE);
     }
 
     ~SettingsSidebar () {