Handle own titlebuttons

src/MainView.vala

@@ -45,6 +45,11 @@ public class Network.MainView : Gtk.Box {
             item_type = VIRTUAL
         };
 
+        var headerbar = new Adw.HeaderBar () {
+            show_end_title_buttons = false,
+            show_title = false
+        };
+
         device_list = new Gtk.ListBox () {
             activate_on_single_click = true,
             selection_mode = SINGLE,
@@ -56,20 +61,13 @@ public class Network.MainView : Gtk.Box {
         device_list.append (proxy);
         device_list.append (vpn);
 
-        var label = new Gtk.Label (_("Airplane Mode")) {
-            margin_start = 3
-        };
-        label.add_css_class (Granite.STYLE_CLASS_H4_LABEL);
+        var label = new Gtk.Label (_("Airplane Mode"));
 
         var airplane_switch = new Gtk.Switch () {
-            margin_start = 6,
-            margin_top = 6,
-            margin_bottom = 6,
-            margin_end = 3
+            valign = CENTER
         };
 
         var footer = new Gtk.ActionBar ();
-        footer.add_css_class (Granite.STYLE_CLASS_FLAT);
         footer.pack_start (label);
         footer.pack_end (airplane_switch);
 
@@ -89,15 +87,22 @@ public class Network.MainView : Gtk.Box {
         content.add_child (proxy.page);
 
         var scrolled_window = new Gtk.ScrolledWindow () {
-            child = device_list
+            child = device_list,
+            hscrollbar_policy = NEVER
+        };
+
+        var toolbarview = new Adw.ToolbarView () {
+            content = scrolled_window,
+            top_bar_style = FLAT,
+            bottom_bar_style = RAISED
         };
+        toolbarview.add_top_bar (headerbar);
+        toolbarview.add_bottom_bar (footer);
 
-        var sidebar = new Gtk.Box (VERTICAL, 0);
-        sidebar.append (scrolled_window);
-        sidebar.append (footer);
+        var sidebar = new Sidebar ();
+        sidebar.append (toolbarview);
 
         var paned = new Gtk.Paned (HORIZONTAL) {
-            position = 200,
             start_child = sidebar,
             end_child = content,
             resize_start_child = false,
@@ -363,4 +368,15 @@ public class Network.MainView : Gtk.Box {
             row.set_header (null);
         }
     }
+
+    // Workaround to set styles
+    private class Sidebar : Gtk.Box {
+        class construct {
+            set_css_name ("settingssidebar");
+        }
+
+        construct {
+            add_css_class (Granite.STYLE_CLASS_SIDEBAR);
+        }
+    }
 }

src/Widgets/DeviceItem.vala

@@ -54,8 +54,7 @@ namespace Network.Widgets {
 
         construct {
             var row_image = new Gtk.Image.from_gicon (icon) {
-                icon_size = LARGE,
-                margin_end = 3
+                icon_size = LARGE
             };
 
             var row_title = new Gtk.Label (title) {
@@ -82,13 +81,7 @@ namespace Network.Widgets {
             };
             overlay.add_overlay (status_image);
 
-            var row_grid = new Gtk.Grid () {
-                margin_end = 6,
-                margin_top = 6,
-                margin_bottom = 6,
-                margin_start = 3,
-                column_spacing = 3
-            };
+            var row_grid = new Gtk.Grid ();
             row_grid.attach (overlay, 0, 0, 1, 2);
             row_grid.attach (row_title, 1, 0, 1, 1);
             row_grid.attach (row_description, 1, 1);

src/Widgets/Page.vala

@@ -52,6 +52,8 @@ namespace Network.Widgets {
                     get_uuid ();
                 });
             }
+
+            show_end_title_buttons = true;
         }
 
         public virtual void update () {

src/meson.build

@@ -39,6 +39,7 @@ shared_module(
         dependency('gobject-2.0'),
         dependency('granite-7'),
         dependency('gtk4'),
+        dependency('libadwaita-1', version: '>=1.4'),
         libnm_dep,
         dependency('libnma-gtk4'),
         meson.get_compiler('vala').find_library('posix'),