Replace GtkPaned sidebar with AdwOverlaySplitView for responsive layout

src/main-window.ui

@@ -26,19 +26,13 @@
     <property name="content">
       <object class="AdwToastOverlay" id="toast_overlay">
         <property name="child">
-          <object class="GtkPaned" id="main_pane">
+          <object class="AdwOverlaySplitView" id="split_view">
-        <property name="orientation">horizontal</property>
+            <property name="min-sidebar-width">200</property>
-        <property name="position">180</property>
+            <property name="max-sidebar-width">320</property>
-        <property name="shrink-start-child">False</property>
-        <property name="resize-start-child">True</property>
-        <property name="shrink-end-child">False</property>
-        <property name="resize-end-child">True</property>
-        <property name="wide-handle">False</property>
 
             <!-- LEFT: Sidebar Panel with AdwToolbarView -->
-        <property name="start-child">
+            <property name="sidebar">
               <object class="AdwToolbarView">
-            <property name="width-request">200</property>
 
                 <!-- Sidebar Header Bar -->
                 <child type="top">
@@ -105,7 +99,7 @@
             </property>
 
             <!-- RIGHT: Main Content Panel with AdwToolbarView -->
-        <property name="end-child">
+            <property name="content">
               <object class="AdwToolbarView">
 
                 <!-- Main Header Bar -->
@@ -115,6 +109,20 @@
                     <property name="show-start-title-buttons">False</property>
                     <property name="show-end-title-buttons">False</property>
 
+                    <!-- Sidebar toggle (only visible when collapsed) -->
+                    <child type="start">
+                      <object class="GtkToggleButton" id="sidebar_toggle_button">
+                        <property name="icon-name">view-sidebar-symbolic</property>
+                        <property name="tooltip-text">Show Sidebar</property>
+                        <style>
+                          <class name="flat"/>
+                        </style>
+                        <binding name="visible">
+                          <lookup name="collapsed">split_view</lookup>
+                        </binding>
+                      </object>
+                    </child>
+
                     <!-- Left side buttons -->
                     <child type="start">
                       <object class="GtkButton" id="save_request_button">
@@ -126,7 +134,6 @@
                         </style>
                       </object>
                     </child>
-
                     <child type="start">
                       <object class="GtkButton" id="export_request_button">
                         <property name="icon-name">export-symbolic</property>
@@ -142,8 +149,6 @@
                     <child type="end">
                       <object class="GtkBox">
                         <property name="spacing">6</property>
-
-                    <!-- New Request Button -->
                         <child>
                           <object class="GtkButton" id="new_request_button">
                             <property name="icon-name">list-add-symbolic</property>
@@ -153,8 +158,6 @@
                             </style>
                           </object>
                         </child>
-
-                    <!-- Main Menu -->
                         <child>
                           <object class="GtkMenuButton">
                             <property name="primary">True</property>
@@ -163,8 +166,6 @@
                             <property name="menu-model">primary_menu</property>
                           </object>
                         </child>
-
-                    <!-- Window Controls -->
                         <child>
                           <object class="GtkWindowControls">
                             <property name="side">end</property>
@@ -256,6 +257,14 @@
         </property>
       </object>
     </property>
+
+    <!-- Collapse sidebar when window is narrow -->
+    <child>
+      <object class="AdwBreakpoint">
+        <condition>max-width: 700sp</condition>
+        <setter object="split_view" property="collapsed">True</setter>
+      </object>
+    </child>
   </template>
 
   <menu id="primary_menu">

src/window.py

@@ -19,7 +19,7 @@
 
 import gi
 gi.require_version('GtkSource', '5')
-from gi.repository import Adw, Gtk, GLib, Gio, GtkSource
+from gi.repository import Adw, Gtk, GLib, Gio, GtkSource, GObject
 from typing import Dict, Optional
 import logging
 from .models import HttpRequest, HttpResponse, HistoryEntry, RequestTab
@@ -63,8 +63,9 @@ class RosterWindow(Adw.ApplicationWindow):
     tab_view = Gtk.Template.Child()
     tab_bar = Gtk.Template.Child()
 
-    # Panes
+    # Split view
-    main_pane = Gtk.Template.Child()
+    split_view = Gtk.Template.Child()
+    sidebar_toggle_button = Gtk.Template.Child()
 
     # Sidebar widgets
     projects_listbox = Gtk.Template.Child()
@@ -102,6 +103,14 @@ class RosterWindow(Adw.ApplicationWindow):
         # Setup custom CSS
         self._setup_custom_css()
 
+        # Bind sidebar toggle button to split view (bidirectional)
+        self.split_view.bind_property(
+            'show-sidebar',
+            self.sidebar_toggle_button,
+            'active',
+            GObject.BindingFlags.BIDIRECTIONAL | GObject.BindingFlags.SYNC_CREATE
+        )
+
         # Setup UI
         self._setup_tab_system()
         self._load_projects()