[gnome-clocks] Adapt UI Files



commit 9cdefcbdc6885b528c582aa57d3b172533253ba1
Author: Maximiliano Sandoval R <msandova gnome org>
Date:   Mon Dec 13 10:34:43 2021 +0100

    Adapt UI Files

 data/gtk/help-overlay.ui             |   3 +-
 data/ui/alarm-day-picker-row.ui      |   3 +-
 data/ui/alarm-face.ui                |   3 +-
 data/ui/alarm-ringing-panel.ui       |  42 ++----
 data/ui/alarm-row.ui                 |  53 +++----
 data/ui/alarm-setup-dialog.ui        |  48 +++---
 data/ui/header-bar.ui                | 100 ++++++-------
 data/ui/stopwatch-face.ui            |  75 +---------
 data/ui/stopwatch-laps-row.ui        |  20 +--
 data/ui/timer-face.ui                |  92 +++++-------
 data/ui/timer-row.ui                 | 274 +++++++++++++++++------------------
 data/ui/timer-setup.ui               | 163 +++++++++------------
 data/ui/window.ui                    |  61 ++++----
 data/ui/world-face.ui                |   9 +-
 data/ui/world-location-dialog-row.ui |  26 ++--
 data/ui/world-location-dialog.ui     |  41 +-----
 data/ui/world-row.ui                 |  47 +++---
 data/ui/world-standalone.ui          |  76 +++++-----
 src/header-bar.vala                  |   4 +-
 src/window.vala                      |   5 +-
 20 files changed, 473 insertions(+), 672 deletions(-)
---
diff --git a/data/gtk/help-overlay.ui b/data/gtk/help-overlay.ui
index 6936af67..cdd224c7 100644
--- a/data/gtk/help-overlay.ui
+++ b/data/gtk/help-overlay.ui
@@ -1,8 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <!-- interface-requires gtk+ 3.17 -->
   <object class="GtkShortcutsWindow" id="help_overlay">
-    <property name="modal">1</property>
+    <property name="modal">True</property>
     <child>
       <object class="GtkShortcutsSection">
         <property name="visible">1</property>
diff --git a/data/ui/alarm-day-picker-row.ui b/data/ui/alarm-day-picker-row.ui
index 652cb6d5..408f5e5c 100644
--- a/data/ui/alarm-day-picker-row.ui
+++ b/data/ui/alarm-day-picker-row.ui
@@ -12,7 +12,8 @@
         <property name="valign">center</property>
         <property name="halign">end</property>
         <property name="hexpand">True</property>
-        <property name="homogeneous">True</property>
+        <property name="hhomogeneous">True</property>
+        <property name="vhomogeneous">True</property>
         <property name="selection-mode">none</property>
         <property name="activate-on-single-click">False</property>
       </object>
diff --git a/data/ui/alarm-face.ui b/data/ui/alarm-face.ui
index 74400126..e2b93838 100644
--- a/data/ui/alarm-face.ui
+++ b/data/ui/alarm-face.ui
@@ -5,7 +5,8 @@
       <object class="GtkStack" id="stack">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
-        <property name="homogeneous">False</property>
+        <property name="hhomogeneous">False</property>
+        <property name="vhomogeneous">False</property>
         <child>
           <object class="GtkBox" id="empty_view">
             <property name="visible">True</property>
diff --git a/data/ui/alarm-ringing-panel.ui b/data/ui/alarm-ringing-panel.ui
index 32d89f73..6eb0fa5e 100644
--- a/data/ui/alarm-ringing-panel.ui
+++ b/data/ui/alarm-ringing-panel.ui
@@ -39,11 +39,11 @@
                       <class name="large-button"/>
                       <class name="destructive-action"/>
                     </style>
+                    <layout>
+                      <property name="column">0</property>
+                      <property name="row">0</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">0</property>
-                    <property name="top_attach">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton" id="snooze_button">
@@ -56,17 +56,17 @@
                       <class name="pill"/>
                       <class name="large-button"/>
                     </style>
+                    <layout>
+                      <property name="column">0</property>
+                      <property name="row">1</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">0</property>
-                    <property name="top_attach">1</property>
-                  </packing>
                 </child>
+                <layout>
+                  <property name="column">0</property>
+                  <property name="row">1</property>
+                </layout>
               </object>
-              <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">1</property>
-              </packing>
             </child>
             <child>
               <object class="GtkBox">
@@ -91,11 +91,6 @@
                       <class name="clocks-ringing-label"/>
                     </style>
                   </object>
-                  <packing>
-                    <property name="expand">False</property>
-                    <property name="fill">True</property>
-                    <property name="position">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkLabel" id="title_label">
@@ -108,17 +103,12 @@
                       <class name="clocks-ringing-title"/>
                     </style>
                   </object>
-                  <packing>
-                    <property name="expand">False</property>
-                    <property name="fill">True</property>
-                    <property name="position">1</property>
-                  </packing>
                 </child>
+                <layout>
+                  <property name="column">0</property>
+                  <property name="row">0</property>
+                </layout>
               </object>
-              <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">0</property>
-              </packing>
             </child>
           </object>
         </child>
diff --git a/data/ui/alarm-row.ui b/data/ui/alarm-row.ui
index 8b23785b..a2a5bbf5 100644
--- a/data/ui/alarm-row.ui
+++ b/data/ui/alarm-row.ui
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- Generated with glade 3.22.1 -->
 <interface>
-  <requires lib="gtk+" version="3.20"/>
   <template class="ClocksAlarmRow" parent="GtkListBoxRow">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
@@ -24,12 +23,11 @@
             <property name="can_focus">True</property>
             <property name="tooltip_text" translatable="yes">Active</property>
             <property name="valign">center</property>
+            <layout>
+              <property name="column">1</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">0</property>
-            <property name="height">3</property>
-          </packing>
         </child>
         <child>
           <object class="GtkButton">
@@ -39,24 +37,17 @@
             <property name="tooltip_text" translatable="yes">Delete</property>
             <property name="halign">center</property>
             <property name="valign">center</property>
-            <property name="relief">none</property>
+            <property name="icon_name">edit-delete-symbolic</property>
             <signal name="clicked" handler="delete" swapped="no"/>
-            <child>
-              <object class="GtkImage">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="icon_name">edit-delete-symbolic</property>
-              </object>
-            </child>
             <style>
               <class name="circular"/>
+              <class name="flat"/>
             </style>
+            <layout>
+              <property name="column">4</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">4</property>
-            <property name="top_attach">0</property>
-            <property name="height">3</property>
-          </packing>
         </child>
         <child>
           <object class="GtkRevealer" id="repeats_reveal">
@@ -76,11 +67,11 @@
                 </style>
               </object>
             </child>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">2</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">2</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="time">
@@ -92,11 +83,11 @@
             <style>
               <class name="alarm-time"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">1</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkRevealer" id="title_reveal">
@@ -119,11 +110,11 @@
                 </style>
               </object>
             </child>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">0</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/data/ui/alarm-setup-dialog.ui b/data/ui/alarm-setup-dialog.ui
index 56d1ed11..9ac0cb1c 100644
--- a/data/ui/alarm-setup-dialog.ui
+++ b/data/ui/alarm-setup-dialog.ui
@@ -43,30 +43,30 @@
                         <property name="visible">True</property>
                         <property name="margin_start">6</property>
                         <property name="margin_end">6</property>
+                        <layout>
+                          <property name="column">0</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">0</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel" id="label2">
                         <property name="visible">True</property>
                         <property name="label">∶</property>
+                        <layout>
+                          <property name="column">2</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">2</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkSpinButton" id="m_spinbutton">
                         <property name="visible">True</property>
-                        <property name="max_length">2</property>
+                        <!-- TODO GTK 4 -->
+                        <!-- <property name="max_length">2</property> -->
                         <property name="activates_default">False</property>
                         <property name="text">0</property>
                         <property name="xalign">0.5</property>
-                        <property name="input_purpose">number</property>
                         <property name="orientation">vertical</property>
                         <property name="adjustment">m_adjustment</property>
                         <property name="numeric">True</property>
@@ -74,11 +74,11 @@
                         <property name="width-request">60</property>
                         <signal name="changed" handler="spinbuttons_changed" object="ClocksAlarmSetupDialog" 
swapped="no"/>
                         <signal name="output" handler="show_leading_zeros" object="ClocksAlarmSetupDialog" 
swapped="no"/>
+                        <layout>
+                          <property name="column">3</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">3</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkStack" id="am_pm_stack">
@@ -91,20 +91,20 @@
                             <property name="can_focus">False</property>
                           </object>
                         </child>
+                        <layout>
+                          <property name="column">4</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">4</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkSpinButton" id="h_spinbutton">
                         <property name="visible">True</property>
-                        <property name="max_length">2</property>
+                        <!-- TODO GTK 4 -->
+                        <!-- <property name="max_length">2</property> -->
                         <property name="activates_default">False</property>
                         <property name="text">0</property>
                         <property name="xalign">0.5</property>
-                        <property name="input_purpose">number</property>
                         <property name="orientation">vertical</property>
                         <property name="adjustment">h_adjustment</property>
                         <property name="numeric">True</property>
@@ -112,11 +112,11 @@
                         <property name="width-request">60</property>
                         <signal name="changed" handler="spinbuttons_changed" object="ClocksAlarmSetupDialog" 
swapped="no"/>
                         <signal name="output" handler="show_leading_zeros" object="ClocksAlarmSetupDialog" 
swapped="no"/>
+                        <layout>
+                          <property name="column">1</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">1</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <style>
                       <class name="clocks-alarm-setup-time"/>
diff --git a/data/ui/header-bar.ui b/data/ui/header-bar.ui
index cce17f62..516de92e 100644
--- a/data/ui/header-bar.ui
+++ b/data/ui/header-bar.ui
@@ -22,92 +22,82 @@
         <property name="visible">True</property>
         <property name="can_focus">False</property>
         <property name="centering_policy">strict</property>
-        <property name="show_close_button">True</property>
         <child type="title">
           <object class="AdwViewSwitcherTitle" id="view_switcher_title">
-            <property name="visible">True</property>
-            <property name="title" translatable="yes">Clocks</property>
             <property name="stack" bind-source="ClocksHeaderBar" bind-property="stack" 
bind-flags="sync-create">ignore-me</property>
             <signal name="notify::title-visible" handler="title_visible_changed"/>
           </object>
         </child>
         <child>
-          <object class="GtkStack" id="start_button_stack">
-            <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="transition_type">crossfade</property>
+          <object class="AdwViewStack" id="start_button_stack">
             <child>
-              <object class="GtkButton">
-                <property name="visible">True</property>
-                <property name="can_focus">True</property>
-                <property name="receives_default">True</property>
-                <property name="action_name">win.new</property>
-                <property name="tooltip-text" bind-source="ClocksHeaderBar" bind-property="new-label" 
bind-flags="sync-create" />
-                <child>
-                  <object class="GtkImage">
+              <object class="AdwViewStackPage">
+                <property name="name">new</property>
+                <property name="child">
+                  <object class="GtkButton">
                     <property name="visible">True</property>
-                    <property name="can_focus">False</property>
-                    <property name="icon_name">list-add-symbolic</property>
+                    <property name="can_focus">True</property>
+                    <property name="receives_default">True</property>
+                    <property name="action_name">win.new</property>
+                    <property name="tooltip-text" bind-source="ClocksHeaderBar" bind-property="new-label" 
bind-flags="sync-create" />
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="icon_name">list-add-symbolic</property>
+                      </object>
+                    </child>
                   </object>
-                </child>
+                </property>
               </object>
-              <packing>
-                <property name="name">new</property>
-              </packing>
             </child>
             <child>
-              <object class="GtkButton">
-                <property name="visible">True</property>
-                <property name="can_focus">True</property>
-                <property name="receives_default">True</property>
-                <property name="action_name">win.back</property>
-                <property name="tooltip-text" translatable="yes">Back</property>
-                <child>
-                  <object class="GtkImage">
+              <object class="AdwViewStackPage">
+                <property name="name">back</property>
+                <property name="child">
+                  <object class="GtkButton">
                     <property name="visible">True</property>
-                    <property name="can_focus">False</property>
-                    <property name="icon_name">go-previous-symbolic</property>
+                    <property name="can_focus">True</property>
+                    <property name="receives_default">True</property>
+                    <property name="action_name">win.back</property>
+                    <property name="tooltip-text" translatable="yes">Back</property>
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="icon_name">go-previous-symbolic</property>
+                      </object>
+                    </child>
                   </object>
-                </child>
+                </property>
               </object>
-              <packing>
-                <property name="name">back</property>
-              </packing>
             </child>
             <child>
-              <object class="GtkBox">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="orientation">vertical</property>
-              </object>
-              <packing>
+              <object class="AdwViewStackPage">
                 <property name="name">empty</property>
-              </packing>
+                <property name="child">
+                  <object class="GtkBox">
+                    <property name="visible">True</property>
+                    <property name="can_focus">False</property>
+                    <property name="orientation">vertical</property>
+                  </object>
+                </property>
+              </object>
             </child>
           </object>
         </child>
-        <child>
+        <child type="end">
           <object class="GtkMenuButton">
             <property name="visible">True</property>
             <property name="can_focus">True</property>
             <property name="receives_default">True</property>
-            <property name="action_name">win.show-primary-menu</property>
             <property name="tooltip-text" translatable="yes">Menu</property>
             <property name="menu_model">primary-menu</property>
-            <child>
-              <object class="GtkImage">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="icon_name">open-menu-symbolic</property>
-              </object>
-            </child>
+            <property name="icon_name">open-menu-symbolic</property>
           </object>
-          <packing>
-            <property name="pack_type">end</property>
-          </packing>
         </child>
       </object>
     </child>
   </template>
-  <object class="GtkStack" id="ignore-me"></object>
+  <object class="AdwViewStack" id="ignore-me"></object>
 </interface>
diff --git a/data/ui/stopwatch-face.ui b/data/ui/stopwatch-face.ui
index 9b9061dd..f779d6da 100644
--- a/data/ui/stopwatch-face.ui
+++ b/data/ui/stopwatch-face.ui
@@ -9,6 +9,7 @@
         <property name="visible">True</property>
         <property name="can_focus">True</property>
         <property name="min_content_width">300</property>
+        <property name="vexpand">True</property>
         <child>
           <object class="AdwClamp">
             <property name="visible">True</property>
@@ -41,11 +42,6 @@
                           <class name="dim-label"/>
                         </style>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel">
@@ -53,11 +49,6 @@
                         <property name="can_focus">False</property>
                         <property name="label">∶</property>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">1</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel" id="minutes_label">
@@ -74,11 +65,6 @@
                           <class name="dim-label"/>
                         </style>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">2</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel">
@@ -88,11 +74,6 @@
                         <property name="xalign">0</property>
                         <property name="yalign">0</property>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">3</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel" id="seconds_label">
@@ -108,11 +89,6 @@
                           <class name="seconds-label"/>
                         </style>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">4</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel">
@@ -122,18 +98,14 @@
                         <property name="xalign">0</property>
                         <property name="yalign">0</property>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">5</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel" id="miliseconds_label">
                         <property name="visible">True</property>
                         <property name="can_focus">False</property>
                         <property name="valign">end</property>
-                        <property name="ypad">6</property>
+                        <!-- TODO GTK 4 -->
+                        <!-- <property name="ypad">6</property> -->
                         <property name="label">0</property>
                         <property name="xalign">0</property>
                         <property name="yalign">0</property>
@@ -144,27 +116,17 @@
                           <class name="miliseconds-label"/>
                         </style>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">6</property>
-                      </packing>
                     </child>
                     <style>
                       <class name="stopped-stopwatch"/>
                     </style>
                   </object>
-                  <packing>
-                    <property name="expand">False</property>
-                    <property name="fill">True</property>
-                    <property name="position">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkBox">
                     <property name="visible">True</property>
                     <property name="can_focus">False</property>
-                    <property name="border_width">12</property>
+                    <property name="spacing">12</property>
                     <child>
                       <object class="GtkButton" id="start_btn">
                         <property name="label" translatable="yes">_Start</property>
@@ -173,6 +135,8 @@
                         <property name="can_focus">True</property>
                         <property name="receives_default">True</property>
                         <property name="use_underline">True</property>
+                        <property name="hexpand">True</property>
+                        <property name="halign">start</property>
                         <signal name="clicked" handler="on_start_btn_clicked" swapped="no"/>
                         <style>
                           <class name="suggested-action"/>
@@ -180,11 +144,6 @@
                           <class name="pill"/>
                         </style>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkButton" id="clear_btn">
@@ -193,25 +152,15 @@
                         <property name="visible">True</property>
                         <property name="can_focus">True</property>
                         <property name="receives_default">True</property>
+                        <property name="halign">end</property>
                         <signal name="clicked" handler="on_clear_btn_clicked" swapped="no"/>
                         <style>
                           <class name="large-button"/>
                           <class name="pill"/>
                         </style>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="pack_type">end</property>
-                        <property name="position">1</property>
-                      </packing>
                     </child>
                   </object>
-                  <packing>
-                    <property name="expand">False</property>
-                    <property name="fill">True</property>
-                    <property name="position">1</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkRevealer" id="laps_revealer">
@@ -231,22 +180,12 @@
                       </object>
                     </child>
                   </object>
-                  <packing>
-                    <property name="expand">True</property>
-                    <property name="fill">True</property>
-                    <property name="position">2</property>
-                  </packing>
                 </child>
               </object>
             </child>
           </object>
         </child>
       </object>
-      <packing>
-        <property name="expand">True</property>
-        <property name="fill">True</property>
-        <property name="position">0</property>
-      </packing>
     </child>
     <style>
       <class name="stopwatch-panel"/>
diff --git a/data/ui/stopwatch-laps-row.ui b/data/ui/stopwatch-laps-row.ui
index 8319be9e..8fdbe34a 100644
--- a/data/ui/stopwatch-laps-row.ui
+++ b/data/ui/stopwatch-laps-row.ui
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- Generated with glade 3.22.1 -->
 <interface>
-  <requires lib="gtk+" version="3.14"/>
   <template class="ClocksStopwatchLapsRow" parent="GtkListBoxRow">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
@@ -10,7 +9,7 @@
       <object class="GtkBox">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
-        <property name="border_width">18</property>
+        <property name="spacing">18</property>
         <child>
           <object class="GtkLabel" id="duration_label">
             <property name="visible">True</property>
@@ -25,12 +24,6 @@
               <class name="lap-time"/>
             </style>
           </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="padding">6</property>
-            <property name="position">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="difference_label">
@@ -43,12 +36,6 @@
               <attribute name="font-features" value="tnum=1"/>
             </attributes>
           </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="padding">6</property>
-            <property name="position">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="index_label">
@@ -61,11 +48,6 @@
               <class name="dim-label"/>
             </style>
           </object>
-          <packing>
-            <property name="expand">True</property>
-            <property name="fill">True</property>
-            <property name="position">2</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/data/ui/timer-face.ui b/data/ui/timer-face.ui
index 08d49410..885db1f8 100644
--- a/data/ui/timer-face.ui
+++ b/data/ui/timer-face.ui
@@ -6,70 +6,60 @@
         <property name="visible">True</property>
         <property name="can_focus">False</property>
         <child>
-          <object class="GtkBox" id="no_timer_container">
-            <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="halign">center</property>
-            <property name="valign">center</property>
-            <property name="orientation">vertical</property>
-            <property name="spacing">18</property>
-            <child>
-              <object class="GtkLabel">
+          <object class="GtkStackPage">
+            <property name="name">empty</property>
+            <property name="child">
+              <object class="GtkBox" id="no_timer_container">
                 <property name="visible">True</property>
                 <property name="can_focus">False</property>
-                <property name="label" translatable="yes">Select Duration</property>
-                <style>
-                  <class name="timer-header"/>
-                </style>
-              </object>
-              <packing>
-                <property name="expand">False</property>
-                <property name="fill">True</property>
-                <property name="position">0</property>
-              </packing>
-            </child>
-            <child>
-              <object class="GtkButton" id="start_button">
-                <property name="visible">True</property>
-                <property name="can_focus">True</property>
-                <property name="receives_default">True</property>
                 <property name="halign">center</property>
                 <property name="valign">center</property>
+                <property name="orientation">vertical</property>
+                <property name="spacing">18</property>
                 <child>
-                  <object class="GtkImage">
+                  <object class="GtkLabel">
                     <property name="visible">True</property>
                     <property name="can_focus">False</property>
+                    <property name="label" translatable="yes">Select Duration</property>
+                    <style>
+                      <class name="timer-header"/>
+                    </style>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkButton" id="start_button">
+                    <property name="visible">True</property>
+                    <property name="can_focus">True</property>
+                    <property name="receives_default">True</property>
                     <property name="halign">center</property>
                     <property name="valign">center</property>
-                    <property name="icon_name">media-playback-start-symbolic</property>
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="halign">center</property>
+                        <property name="valign">center</property>
+                        <property name="icon_name">media-playback-start-symbolic</property>
+                      </object>
+                    </child>
+                    <style>
+                      <class name="pill"/>
+                      <class name="large-button"/>
+                      <class name="suggested-action"/>
+                    </style>
                   </object>
                 </child>
-                <style>
-                  <class name="pill"/>
-                  <class name="large-button"/>
-                  <class name="suggested-action"/>
-                </style>
               </object>
-              <packing>
-                <property name="expand">False</property>
-                <property name="fill">True</property>
-                <property name="position">1</property>
-              </packing>
-            </child>
+            </property>
           </object>
-          <packing>
-            <property name="name">empty</property>
-          </packing>
         </child>
         <child>
-          <object class="GtkScrolledWindow">
-            <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <child>
-              <object class="GtkViewport">
+          <object class="GtkStackPage">
+            <property name="name">timers</property>
+            <property name="child">
+              <object class="GtkScrolledWindow">
                 <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="shadow_type">none</property>
+                <property name="can_focus">True</property>
                 <child>
                   <object class="AdwClamp">
                     <property name="visible">True</property>
@@ -90,12 +80,8 @@
                   </object>
                 </child>
               </object>
-            </child>
+            </property>
           </object>
-          <packing>
-            <property name="name">timers</property>
-            <property name="position">1</property>
-          </packing>
         </child>
         <style>
           <class name="timer-panel"/>
diff --git a/data/ui/timer-row.ui b/data/ui/timer-row.ui
index fc0ae48e..42a44e47 100644
--- a/data/ui/timer-row.ui
+++ b/data/ui/timer-row.ui
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- Generated with glade 3.22.1 -->
 <interface>
-  <requires lib="gtk+" version="3.20"/>
   <template class="ClocksTimerRow" parent="GtkListBoxRow">
     <property name="visible">True</property>
     <property name="activatable">False</property>
@@ -27,48 +26,41 @@
               <class name="timer-countdown"/>
             </style>
           </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="position">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkStack" id="name_stack">
             <property name="visible">True</property>
             <property name="can_focus">False</property>
             <child>
-              <object class="GtkEntry" id="title">
-                <property name="visible">True</property>
-                <property name="can_focus">True</property>
-                <property name="halign">center</property>
-                <property name="width_chars">26</property>
-                <property name="placeholder_text" translatable="yes">Title...</property>
-              </object>
-              <packing>
+              <object class="GtkStackPage">
                 <property name="name">edit</property>
-              </packing>
+                <property name="child">
+                  <object class="GtkEntry" id="title">
+                    <property name="visible">True</property>
+                    <property name="can_focus">True</property>
+                    <property name="halign">center</property>
+                    <property name="width_chars">26</property>
+                    <property name="placeholder_text" translatable="yes">Title…</property>
+                  </object>
+                </property>
+              </object>
             </child>
             <child>
-              <object class="GtkLabel" id="timer_name">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="halign">center</property>
-                <style>
-                  <class name="dim-label"/>
-                </style>
-              </object>
-              <packing>
+              <object class="GtkStackPage">
                 <property name="name">display</property>
-                <property name="position">1</property>
-              </packing>
+                <property name="child">
+                  <object class="GtkLabel" id="timer_name">
+                    <property name="visible">True</property>
+                    <property name="can_focus">False</property>
+                    <property name="halign">center</property>
+                    <style>
+                      <class name="dim-label"/>
+                    </style>
+                  </object>
+                </property>
+              </object>
             </child>
           </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="position">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkGrid">
@@ -86,154 +78,158 @@
                 <property name="hhomogeneous">False</property>
                 <property name="vhomogeneous">False</property>
                 <child>
-                  <object class="GtkButton" id="pause_button">
-                    <property name="visible">True</property>
-                    <property name="can_focus">True</property>
-                    <property name="receives_default">True</property>
-                    <property name="halign">center</property>
-                    <property name="valign">center</property>
-                    <signal name="clicked" handler="on_pause_button_clicked" swapped="no"/>
-                    <child>
-                      <object class="GtkImage">
+                  <object class="GtkStackPage">
+                    <property name="name">pause</property>
+                    <property name="child">
+                      <object class="GtkButton" id="pause_button">
                         <property name="visible">True</property>
-                        <property name="can_focus">False</property>
-                        <property name="icon_name">media-playback-pause-symbolic</property>
+                        <property name="can_focus">True</property>
+                        <property name="receives_default">True</property>
+                        <property name="halign">center</property>
+                        <property name="valign">center</property>
+                        <signal name="clicked" handler="on_pause_button_clicked" swapped="no"/>
+                        <child>
+                          <object class="GtkImage">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="icon_name">media-playback-pause-symbolic</property>
+                          </object>
+                        </child>
+                        <style>
+                          <class name="pill"/>
+                          <class name="large-button"/>
+                        </style>
                       </object>
-                    </child>
-                    <style>
-                      <class name="pill"/>
-                      <class name="large-button"/>
-                    </style>
+                    </property>
                   </object>
-                  <packing>
-                    <property name="name">pause</property>
-                  </packing>
                 </child>
                 <child>
-                  <object class="GtkButton" id="start_button">
-                    <property name="visible">True</property>
-                    <property name="can_focus">True</property>
-                    <property name="receives_default">True</property>
-                    <property name="halign">center</property>
-                    <property name="valign">center</property>
-                    <signal name="clicked" handler="on_start_button_clicked" swapped="no"/>
-                    <child>
-                      <object class="GtkImage">
+                  <object class="GtkStackPage">
+                    <property name="name">start</property>
+                    <property name="child">
+                      <object class="GtkButton" id="start_button">
                         <property name="visible">True</property>
-                        <property name="can_focus">False</property>
-                        <property name="icon_name">media-playback-start-symbolic</property>
+                        <property name="can_focus">True</property>
+                        <property name="receives_default">True</property>
+                        <property name="halign">center</property>
+                        <property name="valign">center</property>
+                        <signal name="clicked" handler="on_start_button_clicked" swapped="no"/>
+                        <child>
+                          <object class="GtkImage">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="icon_name">media-playback-start-symbolic</property>
+                          </object>
+                        </child>
+                        <style>
+                          <class name="suggested-action"/>
+                          <class name="pill"/>
+                          <class name="large-button"/>
+                        </style>
                       </object>
-                    </child>
-                    <style>
-                      <class name="suggested-action"/>
-                      <class name="pill"/>
-                      <class name="large-button"/>
-                    </style>
+                    </property>
                   </object>
-                  <packing>
-                    <property name="name">start</property>
-                    <property name="position">1</property>
-                  </packing>
                 </child>
+                <layout>
+                  <property name="column">1</property>
+                  <property name="row">0</property>
+                </layout>
               </object>
-              <packing>
-                <property name="left_attach">1</property>
-                <property name="top_attach">0</property>
-              </packing>
             </child>
             <child>
               <object class="GtkStack" id="reset_stack">
                 <property name="visible">True</property>
                 <property name="can_focus">False</property>
                 <child>
-                  <object class="GtkButton" id="reset_button">
-                    <property name="visible">True</property>
-                    <property name="can_focus">True</property>
-                    <property name="receives_default">True</property>
-                    <property name="halign">center</property>
-                    <property name="valign">center</property>
-                    <signal name="clicked" handler="on_reset_button_clicked" swapped="no"/>
-                    <child>
-                      <object class="GtkImage">
+                  <object class="GtkStackPage">
+                    <property name="name">button</property>
+                    <property name="child">
+                      <object class="GtkButton" id="reset_button">
                         <property name="visible">True</property>
-                        <property name="can_focus">False</property>
-                        <property name="icon_name">view-refresh-symbolic</property>
+                        <property name="can_focus">True</property>
+                        <property name="receives_default">True</property>
+                        <property name="halign">center</property>
+                        <property name="valign">center</property>
+                        <signal name="clicked" handler="on_reset_button_clicked" swapped="no"/>
+                        <child>
+                          <object class="GtkImage">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="icon_name">view-refresh-symbolic</property>
+                          </object>
+                        </child>
+                        <style>
+                          <class name="pill"/>
+                          <class name="small-button"/>
+                        </style>
                       </object>
-                    </child>
-                    <style>
-                      <class name="pill"/>
-                      <class name="small-button"/>
-                    </style>
+                    </property>
                   </object>
-                  <packing>
-                    <property name="name">button</property>
-                  </packing>
                 </child>
                 <child>
-                  <object class="GtkLabel">
-                    <property name="visible">True</property>
-                    <property name="can_focus">False</property>
-                  </object>
-                  <packing>
+                  <object class="GtkStackPage">
                     <property name="name">empty</property>
-                    <property name="position">1</property>
-                  </packing>
+                    <property name="child">
+                      <object class="GtkLabel">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                      </object>
+                    </property>
+                  </object>
                 </child>
+                <layout>
+                  <property name="column">0</property>
+                  <property name="row">0</property>
+                </layout>
               </object>
-              <packing>
-                <property name="left_attach">0</property>
-                <property name="top_attach">0</property>
-              </packing>
             </child>
             <child>
               <object class="GtkStack" id="delete_stack">
                 <property name="visible">True</property>
                 <property name="can_focus">False</property>
                 <child>
-                  <object class="GtkButton" id="delete_button">
-                    <property name="visible">True</property>
-                    <property name="can_focus">True</property>
-                    <property name="receives_default">True</property>
-                    <property name="halign">center</property>
-                    <property name="valign">center</property>
-                    <child>
-                      <object class="GtkImage">
+                  <object class="GtkStackPage">
+                    <property name="name">button</property>
+                    <property name="child">
+                      <object class="GtkButton" id="delete_button">
                         <property name="visible">True</property>
-                        <property name="can_focus">False</property>
-                        <property name="icon_name">edit-delete-symbolic</property>
+                        <property name="can_focus">True</property>
+                        <property name="receives_default">True</property>
+                        <property name="halign">center</property>
+                        <property name="valign">center</property>
+                        <child>
+                          <object class="GtkImage">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="icon_name">edit-delete-symbolic</property>
+                          </object>
+                        </child>
+                        <style>
+                          <class name="pill"/>
+                          <class name="small-button"/>
+                        </style>
                       </object>
-                    </child>
-                    <style>
-                      <class name="pill"/>
-                      <class name="small-button"/>
-                    </style>
+                    </property>
                   </object>
-                  <packing>
-                    <property name="name">button</property>
-                  </packing>
                 </child>
                 <child>
-                  <object class="GtkLabel">
-                    <property name="visible">True</property>
-                    <property name="can_focus">False</property>
-                  </object>
-                  <packing>
+                  <object class="GtkStackPage">
                     <property name="name">empty</property>
-                    <property name="position">1</property>
-                  </packing>
+                    <property name="child">
+                      <object class="GtkLabel">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                      </object>
+                    </property>
+                  </object>
                 </child>
+                <layout>
+                  <property name="column">2</property>
+                  <property name="row">0</property>
+                </layout>
               </object>
-              <packing>
-                <property name="left_attach">2</property>
-                <property name="top_attach">0</property>
-              </packing>
             </child>
           </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="position">3</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/data/ui/timer-setup.ui b/data/ui/timer-setup.ui
index 752ba543..b3595644 100644
--- a/data/ui/timer-setup.ui
+++ b/data/ui/timer-setup.ui
@@ -1,7 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <requires lib="gtk+" version="3.20"/>
-  <requires lib="libhandy" version="0.0"/>
   <object class="GtkAdjustment" id="adjustment_hours">
     <property name="upper">99</property>
     <property name="step_increment">1</property>
@@ -25,7 +23,8 @@
       <object class="AdwClamp">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
-        <property name="expand">True</property>
+        <property name="hexpand">True</property>
+        <property name="vexpand">True</property>
         <property name="valign">center</property>
         <child>
           <object class="GtkBox">
@@ -53,11 +52,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">1</property>
+                    <layout>
+                      <property name="column">0</property>
+                      <property name="row">0</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">0</property>
-                    <property name="top_attach">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -71,11 +70,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">2</property>
+                    <layout>
+                      <property name="column">1</property>
+                      <property name="row">0</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">1</property>
-                    <property name="top_attach">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -89,11 +88,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">3</property>
+                    <layout>
+                      <property name="column">2</property>
+                      <property name="row">0</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">2</property>
-                    <property name="top_attach">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -107,11 +106,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">5</property>
+                    <layout>
+                      <property name="column">3</property>
+                      <property name="row">0</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">3</property>
-                    <property name="top_attach">0</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -125,11 +124,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">30</property>
+                    <layout>
+                      <property name="column">1</property>
+                      <property name="row">1</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">1</property>
-                    <property name="top_attach">1</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -143,11 +142,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">15</property>
+                    <layout>
+                      <property name="column">0</property>
+                      <property name="row">1</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">0</property>
-                    <property name="top_attach">1</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -161,11 +160,11 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">45</property>
+                    <layout>
+                      <property name="column">2</property>
+                      <property name="row">1</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">2</property>
-                    <property name="top_attach">1</property>
-                  </packing>
                 </child>
                 <child>
                   <object class="GtkButton">
@@ -179,18 +178,13 @@
                     <property name="valign">center</property>
                     <property name="action_name">timer-setup.set-duration</property>
                     <property name="action_target">60</property>
+                    <layout>
+                      <property name="column">3</property>
+                      <property name="row">1</property>
+                    </layout>
                   </object>
-                  <packing>
-                    <property name="left_attach">3</property>
-                    <property name="top_attach">1</property>
-                  </packing>
                 </child>
               </object>
-              <packing>
-                <property name="expand">False</property>
-                <property name="fill">True</property>
-                <property name="position">0</property>
-              </packing>
             </child>
             <child>
               <object class="GtkBox">
@@ -210,22 +204,22 @@
                         <property name="visible">True</property>
                         <property name="can_focus">False</property>
                         <property name="hexpand">True</property>
+                        <layout>
+                          <property name="column">0</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">0</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkSpinButton" id="h_spinbutton">
                         <property name="visible">True</property>
                         <property name="can_focus">True</property>
-                        <property name="max_length">2</property>
-                        <property name="invisible_char">●</property>
+                        <!-- TODO GTK 4 -->
+                        <!-- <property name="max_length">2</property> -->
+                        <!-- <property name="invisible_char">●</property> -->
                         <property name="width_chars">2</property>
                         <property name="text" translatable="yes">0</property>
                         <property name="xalign">0.5</property>
-                        <property name="input_purpose">number</property>
                         <property name="orientation">vertical</property>
                         <property name="adjustment">adjustment_hours</property>
                         <property name="numeric">True</property>
@@ -236,11 +230,11 @@
                           <class name="clocks-spinbutton"/>
                           <class name="flat"/>
                         </style>
+                        <layout>
+                          <property name="column">1</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">1</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel">
@@ -250,22 +244,22 @@
                         <style>
                           <class name="clocks-timer-label"/>
                         </style>
+                        <layout>
+                          <property name="column">2</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">2</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkSpinButton" id="m_spinbutton">
                         <property name="visible">True</property>
                         <property name="can_focus">True</property>
-                        <property name="max_length">2</property>
-                        <property name="invisible_char">●</property>
+                        <!-- TODO GTK 4 -->
+                        <!-- <property name="max_length">2</property> -->
+                        <!-- <property name="invisible_char">●</property> -->
                         <property name="width_chars">2</property>
                         <property name="text" translatable="yes">0</property>
                         <property name="xalign">0.5</property>
-                        <property name="input_purpose">number</property>
                         <property name="orientation">vertical</property>
                         <property name="adjustment">adjustment_minutes</property>
                         <property name="numeric">True</property>
@@ -277,11 +271,11 @@
                           <class name="clocks-spinbutton"/>
                           <class name="flat"/>
                         </style>
+                        <layout>
+                          <property name="column">3</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">3</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel">
@@ -291,22 +285,22 @@
                         <style>
                           <class name="clocks-timer-label"/>
                         </style>
+                        <layout>
+                          <property name="column">4</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">4</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkSpinButton" id="s_spinbutton">
                         <property name="visible">True</property>
                         <property name="can_focus">True</property>
-                        <property name="max_length">2</property>
-                        <property name="invisible_char">●</property>
+                        <!-- TODO GTK 4 -->
+                        <!-- <property name="max_length">2</property> -->
+                        <!-- <property name="invisible_char">●</property> -->
                         <property name="width_chars">2</property>
                         <property name="text" translatable="yes">0</property>
                         <property name="xalign">0.5</property>
-                        <property name="input_purpose">number</property>
                         <property name="orientation">vertical</property>
                         <property name="adjustment">adjustment_seconds</property>
                         <property name="numeric">True</property>
@@ -318,45 +312,30 @@
                           <class name="clocks-spinbutton"/>
                           <class name="flat"/>
                         </style>
+                        <layout>
+                          <property name="column">5</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">5</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkLabel">
                         <property name="visible">True</property>
                         <property name="can_focus">False</property>
                         <property name="hexpand">True</property>
+                        <layout>
+                          <property name="column">6</property>
+                          <property name="row">0</property>
+                        </layout>
                       </object>
-                      <packing>
-                        <property name="left_attach">6</property>
-                        <property name="top_attach">0</property>
-                      </packing>
                     </child>
                   </object>
-                  <packing>
-                    <property name="expand">True</property>
-                    <property name="fill">True</property>
-                    <property name="position">0</property>
-                  </packing>
                 </child>
               </object>
-              <packing>
-                <property name="expand">False</property>
-                <property name="fill">True</property>
-                <property name="position">1</property>
-              </packing>
             </child>
           </object>
         </child>
       </object>
-      <packing>
-        <property name="expand">False</property>
-        <property name="fill">True</property>
-        <property name="position">0</property>
-      </packing>
     </child>
   </template>
 </interface>
diff --git a/data/ui/window.ui b/data/ui/window.ui
index 5a6b4fc8..267b82b1 100644
--- a/data/ui/window.ui
+++ b/data/ui/window.ui
@@ -1,13 +1,15 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
   <template class="ClocksWindow" parent="AdwApplicationWindow">
-    <property name="title" bind-source="header_bar" bind-property="title" bind-flags="sync-create" />
+    <!-- TODO GTK 4 -->
+    <!-- <property name="title" bind-source="header_bar" bind-property="title" bind-flags="sync-create" /> 
-->
     <child>
       <object class="AdwLeaflet" id="alarm_leaflet">
         <property name="visible">True</property>
         <property name="orientation">vertical</property>
-        <property name="visible-child">world_deck</property>
+        <property name="visible-child">world_leaflet</property>
         <property name="transition-type">under</property>
+        <property name="can-unfold">False</property>
         <signal name="notify::visible-child" handler="visible_child_changed"/>
         <child>
           <object class="ClocksAlarmRingingPanel" id="alarm_ringing_panel">
@@ -18,6 +20,7 @@
         <child>
           <object class="AdwLeaflet" id="world_leaflet">
             <property name="visible">True</property>
+            <property name="can-unfold">False</property>
             <property name="can-navigate-back">True</property>
             <signal name="notify::visible-child" handler="visible_child_changed"/>
             <child>
@@ -33,53 +36,57 @@
                   </object>
                 </child>
                 <child>
-                  <object class="GtkStack" id="stack">
-                    <property name="visible">True</property>
-                    <property name="can_focus">False</property>
+                  <object class="AdwViewStack" id="stack">
                     <property name="hexpand">True</property>
                     <property name="vexpand">True</property>
-                    <property name="homogeneous">True</property>
-                    <property name="transition-type">crossfade</property>
                     <signal name="notify::visible-child" handler="pane_changed" swapped="no"/>
                     <child>
-                      <object class="ClocksWorldFace" id="world">
-                        <property name="visible">True</property>
-                      </object>
-                      <packing>
+                      <object class="AdwViewStackPage">
                         <property name="name">world</property>
                         <property name="title" translatable="yes">World</property>
                         <property name="icon-name">globe-symbolic</property>
-                      </packing>
+                        <property name="child">
+                          <object class="ClocksWorldFace" id="world">
+                            <property name="visible">True</property>
+                          </object>
+                        </property>
+                      </object>
                     </child>
                     <child>
-                      <object class="ClocksAlarmFace" id="alarm">
-                        <property name="visible">True</property>
-                      </object>
-                      <packing>
+                      <object class="AdwViewStackPage">
                         <property name="name">alarm</property>
                         <property name="title" translatable="yes">Alarms</property>
                         <property name="icon-name">alarm-symbolic</property>
-                      </packing>
+                        <property name="child">
+                          <object class="ClocksAlarmFace" id="alarm">
+                            <property name="visible">True</property>
+                          </object>
+                        </property>
+                      </object>
                     </child>
                     <child>
-                      <object class="ClocksStopwatchFace" id="stopwatch">
-                        <property name="visible">True</property>
-                      </object>
-                      <packing>
+                      <object class="AdwViewStackPage">
                         <property name="name">stopwatch</property>
                         <property name="title" translatable="yes">Stopwatch</property>
                         <property name="icon-name">stopwatch-symbolic</property>
-                      </packing>
+                        <property name="child">
+                          <object class="ClocksStopwatchFace" id="stopwatch">
+                            <property name="visible">True</property>
+                          </object>
+                        </property>
+                      </object>
                     </child>
                     <child>
-                      <object class="ClocksTimerFace" id="timer">
-                        <property name="visible">True</property>
-                      </object>
-                      <packing>
+                      <object class="AdwViewStackPage">
                         <property name="name">timer</property>
                         <property name="title" translatable="yes">Timer</property>
                         <property name="icon-name">timer-symbolic</property>
-                      </packing>
+                        <property name="child">
+                          <object class="ClocksTimerFace" id="timer">
+                            <property name="visible">True</property>
+                          </object>
+                        </property>
+                      </object>
                     </child>
                   </object>
                 </child>
diff --git a/data/ui/world-face.ui b/data/ui/world-face.ui
index dc5e5f68..fd097ef1 100644
--- a/data/ui/world-face.ui
+++ b/data/ui/world-face.ui
@@ -5,7 +5,8 @@
       <object class="GtkStack" id="stack">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
-        <property name="homogeneous">False</property>
+        <property name="hhomogeneous">False</property>
+        <property name="vhomogeneous">False</property>
         <child>
           <object class="GtkBox" id="empty_view">
             <property name="visible">True</property>
@@ -25,9 +26,6 @@
                   <class name="dim-label"/>
                 </style>
               </object>
-              <packing>
-                <property name="position">0</property>
-              </packing>
             </child>
             <child>
               <object class="GtkButton">
@@ -41,9 +39,6 @@
                   <class name="pill"/>
                 </style>
               </object>
-              <packing>
-                <property name="position">1</property>
-              </packing>
             </child>
           </object>
         </child>
diff --git a/data/ui/world-location-dialog-row.ui b/data/ui/world-location-dialog-row.ui
index 286e40d9..c12e5b7d 100644
--- a/data/ui/world-location-dialog-row.ui
+++ b/data/ui/world-location-dialog-row.ui
@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-  <requires lib="gtk+" version="3.20"/>
   <template class="ClocksWorldLocationDialogRow" parent="GtkListBoxRow">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
@@ -25,11 +24,11 @@
               <class name="dim-label"/>
               <class name="clock-desc"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">1</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkBox">
@@ -59,22 +58,21 @@
                 </style>
               </object>
             </child>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkImage">
             <property name="visible" bind-source="ClocksWorldLocationDialogRow" 
bind-property="clock-selected" bind-flags="sync-create"/>
             <property name="icon_name">object-select-symbolic</property>
+            <layout>
+              <property name="column">2</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">2</property>
-            <property name="top_attach">0</property>
-            <property name="height">2</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/data/ui/world-location-dialog.ui b/data/ui/world-location-dialog.ui
index fea18688..25370074 100644
--- a/data/ui/world-location-dialog.ui
+++ b/data/ui/world-location-dialog.ui
@@ -28,11 +28,8 @@
               <class name="text-button"/>
             </style>
           </object>
-          <packing>
-            <property name="pack_type">start</property>
-          </packing>
         </child>
-        <child>
+        <child type="end">
           <object class="GtkButton" id="button_add">
             <property name="label" translatable="yes">_Add</property>
             <property name="visible">True</property>
@@ -48,9 +45,6 @@
               <class name="suggested-action"/>
             </style>
           </object>
-          <packing>
-            <property name="pack_type">end</property>
-          </packing>
         </child>
       </object>
     </child>
@@ -63,11 +57,6 @@
           <object class="GtkButtonBox">
             <property name="can_focus">False</property>
           </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">False</property>
-            <property name="position">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkScrolledWindow">
@@ -93,11 +82,6 @@
                         <property name="can_focus">True</property>
                         <signal name="search-changed" handler="on_search_changed" swapped="no"/>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">0</property>
-                      </packing>
                     </child>
                     <child>
                       <object class="GtkStack" id="stack">
@@ -124,11 +108,6 @@
                                   <class name="dim-label"/>
                                 </style>
                               </object>
-                              <packing>
-                                <property name="expand">False</property>
-                                <property name="fill">True</property>
-                                <property name="position">0</property>
-                              </packing>
                             </child>
                             <child>
                               <object class="GtkLabel">
@@ -139,11 +118,6 @@
                                   <class name="large-title"/>
                                 </style>
                               </object>
-                              <packing>
-                                <property name="expand">False</property>
-                                <property name="fill">True</property>
-                                <property name="position">1</property>
-                              </packing>
                             </child>
                           </object>
                         </child>
@@ -159,27 +133,14 @@
                             </style>
                             <signal name="row-activated" handler="item_activated" swapped="no"/>
                           </object>
-                          <packing>
-                            <property name="position">1</property>
-                          </packing>
                         </child>
                       </object>
-                      <packing>
-                        <property name="expand">False</property>
-                        <property name="fill">True</property>
-                        <property name="position">1</property>
-                      </packing>
                     </child>
                   </object>
                 </child>
               </object>
             </child>
           </object>
-          <packing>
-            <property name="expand">True</property>
-            <property name="fill">True</property>
-            <property name="position">1</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/data/ui/world-row.ui b/data/ui/world-row.ui
index d6cc3419..d74fd3ce 100644
--- a/data/ui/world-row.ui
+++ b/data/ui/world-row.ui
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- Generated with glade 3.22.1 -->
 <interface>
-  <requires lib="gtk+" version="3.20"/>
   <template class="ClocksWorldRow" parent="GtkListBoxRow">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
@@ -10,8 +9,8 @@
         <property name="visible">True</property>
         <property name="can_focus">False</property>
         <property name="valign">start</property>
+        <property name="margin_start">12</property>
         <property name="margin_end">12</property>
-        <property name="margin_right">12</property>
         <property name="margin_top">12</property>
         <property name="margin_bottom">12</property>
         <property name="hexpand">True</property>
@@ -29,11 +28,11 @@
             <style>
               <class name="clock-title"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="desc">
@@ -48,11 +47,11 @@
               <class name="dim-label"/>
               <class name="clock-desc"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">1</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="time_label">
@@ -69,12 +68,11 @@
             <style>
               <class name="clock-time"/>
             </style>
+            <layout>
+              <property name="column">1</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">0</property>
-            <property name="height">2</property>
-          </packing>
         </child>
         <child>
           <object class="GtkStack" id="delete_stack">
@@ -88,18 +86,12 @@
                 <property name="receives_default">True</property>
                 <property name="halign">center</property>
                 <property name="valign">center</property>
-                <property name="relief">none</property>
                 <property name="tooltip_text" translatable="yes">Delete</property>
+                <property name="icon_name">edit-delete-symbolic</property>
                 <signal name="clicked" handler="delete" object="ClocksWorldRow" swapped="no"/>
-                <child>
-                  <object class="GtkImage">
-                    <property name="visible">True</property>
-                    <property name="can_focus">False</property>
-                    <property name="icon_name">edit-delete-symbolic</property>
-                  </object>
-                </child>
                 <style>
                   <class name="circular"/>
+                  <class name="flat"/>
                 </style>
               </object>
             </child>
@@ -109,12 +101,11 @@
                 <property name="can_focus">False</property>
               </object>
             </child>
+            <layout>
+              <property name="column">2</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">2</property>
-            <property name="top_attach">0</property>
-            <property name="height">2</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/data/ui/world-standalone.ui b/data/ui/world-standalone.ui
index 9c36a684..055a4c93 100644
--- a/data/ui/world-standalone.ui
+++ b/data/ui/world-standalone.ui
@@ -7,12 +7,12 @@
     <child>
       <object class="AdwHeaderBar">
         <property name="visible">True</property>
-        <property name="show-close-button">True</property>
-        <property name="title" bind-source="ClocksWorldStandalone" bind-property="title" 
bind-flags="sync-create" />
-        <property name="subtitle" bind-source="ClocksWorldStandalone" bind-property="subtitle" 
bind-flags="sync-create" />
-        <style>
-          <class name="titlebar"/>
-        </style>
+        <property name="title-widget">
+          <object class="AdwWindowTitle">
+            <property name="title" bind-source="ClocksWorldStandalone" bind-property="title" 
bind-flags="sync-create" />
+            <property name="subtitle" bind-source="ClocksWorldStandalone" bind-property="subtitle" 
bind-flags="sync-create" />
+          </object>
+        </property>
         <child>
           <object class="GtkButton">
             <property name="visible">True</property>
@@ -20,13 +20,7 @@
             <property name="receives_default">True</property>
             <property name="action_name">win.back</property>
             <property name="tooltip-text" translatable="yes">Back</property>
-            <child>
-              <object class="GtkImage">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="icon_name">go-previous-symbolic</property>
-              </object>
-            </child>
+            <property name="icon_name">go-previous-symbolic</property>
           </object>
         </child>
       </object>
@@ -47,11 +41,11 @@
             <property name="visible">True</property>
             <property name="can_focus">False</property>
             <property name="label">  </property>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">1</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="time_label">
@@ -65,11 +59,11 @@
             <style>
               <class name="clocks-standalone-label"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="day_label">
@@ -78,11 +72,11 @@
             <style>
               <class name="clocks-secondary-standalone-label"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">2</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">2</property>
-          </packing>
         </child>
       </object>
     </child>
@@ -104,11 +98,11 @@
             <style>
               <class name="dim-label"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="label4">
@@ -118,11 +112,11 @@
             <style>
               <class name="dim-label"/>
             </style>
+            <layout>
+              <property name="column">0</property>
+              <property name="row">1</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">1</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="sunrise_label">
@@ -132,11 +126,11 @@
             <attributes>
               <attribute name="font-features" value="tnum=1"/>
             </attributes>
+            <layout>
+              <property name="column">1</property>
+              <property name="row">0</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">0</property>
-          </packing>
         </child>
         <child>
           <object class="GtkLabel" id="sunset_label">
@@ -145,11 +139,11 @@
             <attributes>
               <attribute name="font-features" value="tnum=1"/>
             </attributes>
+            <layout>
+              <property name="column">1</property>
+              <property name="row">1</property>
+            </layout>
           </object>
-          <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">1</property>
-          </packing>
         </child>
       </object>
     </child>
diff --git a/src/header-bar.vala b/src/header-bar.vala
index 86ea0411..ab5c59be 100644
--- a/src/header-bar.vala
+++ b/src/header-bar.vala
@@ -44,14 +44,14 @@ public class Clocks.HeaderBar : Adw.Bin {
         }
     }
 
-    public Gtk.Stack stack { get; set; }
+    public Adw.ViewStack stack { get; set; }
     public Adw.ViewSwitcherBar switcher_bar { get; set; }
     public string? new_label { get; set; }
 
     private ButtonMode _button_mode;
 
     [GtkChild]
-    private unowned Gtk.Stack start_button_stack;
+    private unowned Adw.ViewStack start_button_stack;
     [GtkChild]
     private unowned Adw.ViewSwitcherTitle view_switcher_title;
 
diff --git a/src/window.vala b/src/window.vala
index 0ae62965..08cb8e72 100644
--- a/src/window.vala
+++ b/src/window.vala
@@ -38,7 +38,7 @@ public class Window : Adw.ApplicationWindow {
     [GtkChild]
     private unowned Gtk.Box main_view;
     [GtkChild]
-    private unowned Gtk.Stack stack;
+    private unowned Adw.ViewStack stack;
     [GtkChild]
     private unowned World.Face world;
     [GtkChild]
@@ -104,7 +104,8 @@ public class Window : Adw.ApplicationWindow {
 
         inited = true;
 
-        header_bar.bind_property ("title", this, "title", SYNC_CREATE);
+        // TODO GTK 4
+        // header_bar.bind_property ("title", this, "title", SYNC_CREATE);
 
         pane_changed ();
 


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]