From deb48e4c858905813659ead0e5db3641ea1bdf67 Mon Sep 17 00:00:00 2001
From: vesp <vesp@post.cz>
Date: Wed, 24 Dec 2025 03:55:13 +0100
Subject: [PATCH] Refactor to use AdwToolbarView like Epiphany

- Replace manual GtkBox layout with AdwToolbarView
- Add AdwHeaderBar and AdwTabBar as separate top bars
- Remove all custom CSS for header bar height matching
- AdwToolbarView automatically ensures consistent bar styling

This follows the proper libadwaita pattern used by GNOME Web.
---
 src/main-window.ui | 51 +++++++++++++++++++---------------------------
 src/window.py      | 46 ++---------------------------------------
 2 files changed, 23 insertions(+), 74 deletions(-)

diff --git a/src/main-window.ui b/src/main-window.ui
index c3b745b..f8d99b1 100644
--- a/src/main-window.ui
+++ b/src/main-window.ui
@@ -16,21 +16,17 @@
         <property name="resize-end-child">True</property>
         <property name="wide-handle">False</property>
 
-        <!-- LEFT: Sidebar Panel with its own header -->
+        <!-- LEFT: Sidebar Panel with AdwToolbarView -->
         <property name="start-child">
-          <object class="GtkBox">
-            <property name="orientation">vertical</property>
+          <object class="AdwToolbarView">
             <property name="width-request">200</property>
 
             <!-- Sidebar Header Bar -->
-            <child>
+            <child type="top">
               <object class="AdwHeaderBar">
                 <property name="show-title">False</property>
                 <property name="show-end-title-buttons">False</property>
                 <property name="show-start-title-buttons">False</property>
-                <style>
-                  <class name="sidebar-header"/>
-                </style>
                 <child type="start">
                   <object class="GtkLabel">
                     <property name="label">Projects</property>
@@ -53,10 +49,9 @@
             </child>
 
             <!-- Sidebar Content -->
-            <child>
+            <property name="content">
               <object class="GtkBox">
                 <property name="orientation">vertical</property>
-                <property name="vexpand">True</property>
 
                 <!-- Projects List -->
                 <child>
@@ -86,32 +81,20 @@
                   </object>
                 </child>
               </object>
-            </child>
+            </property>
           </object>
         </property>
 
-        <!-- RIGHT: Main Content Panel with its own header -->
+        <!-- RIGHT: Main Content Panel with AdwToolbarView -->
         <property name="end-child">
-          <object class="GtkBox">
-            <property name="orientation">vertical</property>
+          <object class="AdwToolbarView">
 
             <!-- Main Header Bar -->
-            <child>
+            <child type="top">
               <object class="AdwHeaderBar">
+                <property name="show-title">False</property>
                 <property name="show-start-title-buttons">False</property>
                 <property name="show-end-title-buttons">False</property>
-                <style>
-                  <class name="main-header"/>
-                </style>
-
-                <!-- Tab bar as title widget -->
-                <property name="title-widget">
-                  <object class="AdwTabBar" id="tab_bar">
-                    <property name="view">tab_view</property>
-                    <property name="autohide">False</property>
-                    <property name="expand-tabs">False</property>
-                  </object>
-                </property>
 
                 <!-- Right side buttons -->
                 <child type="end">
@@ -150,11 +133,19 @@
               </object>
             </child>
 
-            <!-- Vertical Paned: Tab View | History Panel -->
-            <child>
+            <!-- Tab Bar as separate top bar -->
+            <child type="top">
+              <object class="AdwTabBar" id="tab_bar">
+                <property name="view">tab_view</property>
+                <property name="autohide">False</property>
+                <property name="expand-tabs">False</property>
+              </object>
+            </child>
+
+            <!-- Main Content: Vertical Paned with Tab View and History Panel -->
+            <property name="content">
               <object class="GtkPaned">
                 <property name="orientation">vertical</property>
-                <property name="vexpand">True</property>
                 <property name="position">600</property>
                 <property name="shrink-start-child">False</property>
                 <property name="shrink-end-child">True</property>
@@ -213,7 +204,7 @@
                   </object>
                 </property>
               </object>
-            </child>
+            </property>
           </object>
         </property>
       </object>
diff --git a/src/window.py b/src/window.py
index f91cb9e..978177d 100644
--- a/src/window.py
+++ b/src/window.py
@@ -133,50 +133,8 @@ class RosterWindow(Adw.ApplicationWindow):
         """Setup custom CSS for UI styling."""
         css_provider = Gtk.CssProvider()
         css_provider.load_from_data(b"""
-            /* Match both header bars to same height */
-            headerbar.sidebar-header,
-            headerbar.main-header {
-                min-height: 46px;
-                padding-top: 0;
-                padding-bottom: 0;
-            }
-
-            headerbar.sidebar-header {
-                padding-left: 0px;
-                padding-right: 6px;
-            }
-
-            headerbar.main-header {
-                padding-left: 0px;
-                padding-right: 6px;
-            }
-
-            /* Ultra-compact tab bar to fit exactly in header */
-            tabbar {
-                min-height: 0;
-                padding: 0;
-                margin: 0;
-                border: none;
-            }
-
-            tabbar > scrolledwindow {
-                min-height: 0;
-                padding: 0;
-                margin: 0;
-                border: none;
-            }
-
-            tabbar > scrolledwindow > box {
-                min-height: 0;
-                padding: 0;
-                margin: 0;
-            }
-
-            tabbar tab {
-                min-height: 24px;
-                padding: 2px 10px;
-                margin: 0 1px;
-            }
+            /* AdwToolbarView handles header bar heights automatically */
+            /* Just add minimal custom styling for other elements */
 
             /* Stack switchers styling (Headers/Body tabs) */
             stackswitcher button {