[gnome-clocks] alarm-row: Port to GtkBox

[Bilal Elmoussaoui <bilelmoussaoui src gnome org>]

commit 8a6959319cb3a1666ec64158c5962b00ccac0f1f
Author: Maximiliano Sandoval R <msandova gnome org>
Date:   Mon Dec 13 13:55:27 2021 +0100

    alarm-row: Port to GtkBox
    
    Instead of Grid.

 data/css/gnome-clocks.css |  10 +---
 data/ui/alarm-row.ui      | 125 ++++++++++++++++++++--------------------------
 2 files changed, 56 insertions(+), 79 deletions(-)
---
diff --git a/data/css/gnome-clocks.css b/data/css/gnome-clocks.css
index 25173ba1..3ce3d0ee 100644
--- a/data/css/gnome-clocks.css
+++ b/data/css/gnome-clocks.css
@@ -29,24 +29,16 @@ row.snoozing {
        font-weight: bold;
 }
 
-.alarm-row button, .repeats button {
+.repeats button {
        min-width: 24px;
        min-height: 24px;
 }
 
-.alarm-name {
-       font-weight: bold;
-}
-
 .alarm-time {
        font-size: 2.5em;
        font-weight: 300;
 }
 
-.alarm-repeat {
-       font-size: 9pt;
-}
-
 .clocks-ampm-toggle-button {
        font-size: 18pt;
 }
diff --git a/data/ui/alarm-row.ui b/data/ui/alarm-row.ui
index aff99784..881938d8 100644
--- a/data/ui/alarm-row.ui
+++ b/data/ui/alarm-row.ui
@@ -4,101 +4,86 @@
     <property name="activatable">True</property>
     <property name="selectable">False</property>
     <child>
-      <object class="GtkGrid">
+      <object class="GtkBox">
         <property name="valign">center</property>
         <property name="margin_start">12</property>
         <property name="margin_end">12</property>
         <property name="margin_top">12</property>
         <property name="margin_bottom">12</property>
         <property name="hexpand">True</property>
-        <property name="column_spacing">12</property>
         <child>
-          <object class="GtkSwitch" id="toggle">
-            <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>
-        </child>
-        <child>
-          <object class="GtkButton">
-            <property name="receives_default">True</property>
-            <property name="tooltip_text" translatable="yes">Delete</property>
-            <property name="halign">center</property>
-            <property name="valign">center</property>
-            <property name="icon_name">edit-delete-symbolic</property>
-            <signal name="clicked" handler="delete" swapped="no"/>
-            <style>
-              <class name="circular"/>
-              <class name="flat"/>
-            </style>
-            <layout>
-              <property name="column">4</property>
-              <property name="row">0</property>
-            </layout>
-          </object>
-        </child>
-        <child>
-          <object class="GtkRevealer" id="repeats_reveal">
+          <object class="GtkBox">
+            <property name="orientation">vertical</property>
             <child>
-              <object class="GtkLabel" id="repeats">
-                <property name="tooltip_text" translatable="yes">Repeats</property>
+              <object class="GtkRevealer" id="title_reveal">
+                <property name="transition_type">slide-up</property>
+                <child>
+                  <object class="GtkLabel" id="title">
+                    <property name="hexpand">True</property>
+                    <property name="label">Name</property>
+                    <property name="ellipsize">end</property>
+                    <property name="xalign">0</property>
+                    <style>
+                      <class name="heading"/>
+                    </style>
+                  </object>
+                </child>
+              </object>
+            </child>
+            <child>
+              <object class="GtkLabel" id="time">
                 <property name="hexpand">True</property>
-                <property name="ellipsize">end</property>
                 <property name="xalign">0</property>
                 <style>
-                  <class name="dim-label"/>
-                  <class name="alarm-repeat"/>
+                  <class name="alarm-time"/>
+                  <class name="numeric"/>
                 </style>
               </object>
             </child>
-            <layout>
-              <property name="column">0</property>
-              <property name="row">2</property>
-            </layout>
-          </object>
-        </child>
-        <child>
-          <object class="GtkLabel" id="time">
-            <property name="hexpand">True</property>
-            <property name="label">12:34</property>
-            <property name="xalign">0</property>
-            <style>
-              <class name="alarm-time"/>
-            </style>
-            <layout>
-              <property name="column">0</property>
-              <property name="row">1</property>
-            </layout>
+            <child>
+              <object class="GtkRevealer" id="repeats_reveal">
+                <child>
+                  <object class="GtkLabel" id="repeats">
+                    <property name="tooltip_text" translatable="yes">Repeats</property>
+                    <property name="hexpand">True</property>
+                    <property name="ellipsize">end</property>
+                    <property name="xalign">0</property>
+                    <style>
+                      <class name="dim-label"/>
+                      <class name="caption"/>
+                    </style>
+                  </object>
+                </child>
+              </object>
+            </child>
           </object>
         </child>
         <child>
-          <object class="GtkRevealer" id="title_reveal">
-            <property name="transition_type">slide-up</property>
+          <object class="GtkBox">
+            <property name="spacing">12</property>
             <child>
-              <object class="GtkLabel" id="title">
-                <property name="hexpand">True</property>
-                <property name="label">Name</property>
-                <property name="ellipsize">end</property>
-                <property name="xalign">0</property>
+              <object class="GtkSwitch" id="toggle">
+                <property name="tooltip_text" translatable="yes">Active</property>
+                <property name="valign">center</property>
+              </object>
+            </child>
+            <child>
+              <object class="GtkButton">
+                <property name="receives_default">True</property>
+                <property name="tooltip_text" translatable="yes">Delete</property>
+                <property name="halign">center</property>
+                <property name="valign">center</property>
+                <property name="icon_name">edit-delete-symbolic</property>
+                <signal name="clicked" handler="delete" swapped="no"/>
                 <style>
-                  <class name="numeric"/>
-                  <class name="alarm-name"/>
+                  <class name="circular"/>
+                  <class name="flat"/>
                 </style>
               </object>
             </child>
-            <layout>
-              <property name="column">0</property>
-              <property name="row">0</property>
-            </layout>
           </object>
         </child>
       </object>
     </child>
-    <style>
-      <class name="alarm-row"/>
-    </style>
   </template>
 </interface>