Add style classes to distinguish header bars

- Add "sidebar-header" and "main-header" style classes
- Target each header bar specifically in CSS
- Make tab bar ultra-compact to fit within header height
- Reduce tab padding and remove all internal margins
This commit is contained in:
Pavel Baksy 2025-12-24 03:48:50 +01:00
parent 5334902d7a
commit 7cf03a2f8b
2 changed files with 28 additions and 5 deletions

View File

@ -28,6 +28,9 @@
<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>
@ -97,6 +100,9 @@
<object class="AdwHeaderBar">
<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">

View File

@ -133,31 +133,48 @@ class RosterWindow(Adw.ApplicationWindow):
"""Setup custom CSS for UI styling."""
css_provider = Gtk.CssProvider()
css_provider.load_from_data(b"""
/* Force both header bars to same height */
headerbar {
/* 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;
}
/* Compact tab bar to fit in header bar */
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: 28px;
padding: 4px 10px;
min-height: 24px;
padding: 2px 10px;
margin: 0 1px;
}