Added a back button for mobile

data/ui/main.blp

@@ -55,21 +55,24 @@ Adw.ApplicationWindow mainWindow {
         Gtk.ListBox searchResults {}
       }
 
-      Adw.Clamp {
+      Adw.Clamp detailsClamp {
+        width-request: 300;
         maximum-size: 450;
         tightening-threshold: 400;
 
-        Gtk.Label seeDetailsText {
-          hexpand: true;
-          label: "Select a result to see details";
-        }
-
         Gtk.Box detailsBox {
           orientation: vertical;
           visible: false;
           margin-start: 14;
           margin-end: 14;
 
+          Gtk.Button detailsBack {
+            visible: false;
+            hexpand: false;
+            label: "Back to results";
+            margin-bottom: 8;
+          }
+
           Gtk.Label detailsTitle {
             halign: start;
             styles ["title-1"]
@@ -123,6 +126,20 @@ Adw.ApplicationWindow mainWindow {
               }
             }
           }
+
+          Gtk.Label {
+            styles ["heading"]
+            halign: start;
+            label: "Hours";
+            margin-top: 16;
+          }
+
+          Gtk.ListBox detailsHoursBox {
+            styles ["boxed-list"]
+            selection-mode: none;
+            margin-top: 8;
+            hexpand: true;
+          }
         }
       }
     }

src/modules/views/main.cr

@@ -19,6 +19,11 @@ module Wince
     
     @@main_window_id = window.id
 
+    DETAILS_BACK.clicked_signal.connect do
+      BUSINESS_LIST.unselect_all
+      LEAFLET.visible_child = SCROLL_VIEW
+    end
+
     SEARCH_BUTTON.clicked_signal.connect do
       handle_search
     end
@@ -117,9 +122,15 @@ module Wince
     DETAILS_PHONE.text = response_json["display_phone"].as_s? || "no phone number"
     DETAILS_URL.uri = response_json["url"].as_s? || ""
 
-    SEE_DETAILS_TEXT.visible = false
+    # If we're in the small layout we want to show the back button
+    if LEAFLET.folded
+      DETAILS_BACK.visible = true
+    else
+      DETAILS_BACK.visible = false
+    end
+
     DETAILS_BOX.visible = true
-    LEAFLET.visible_child = DETAILS_BOX
+    LEAFLET.visible_child = DETAILS_CLAMP
   end
 
   APP.activate_signal.connect(->activate(Adw::Application))

src/wince.cr

@@ -14,7 +14,6 @@ module Wince
   POWERD_BY_TEXT = Gtk::Label.cast(B_UI["poweredByText"])
   SCROLL_VIEW = Gtk::ScrolledWindow.cast(B_UI["scrollWindow"])
   LEAFLET = Adw::Leaflet.cast(B_UI["leaflet"])
-  SEE_DETAILS_TEXT = Gtk::Label.cast(B_UI["seeDetailsText"])
   DETAILS_BOX = Gtk::Box.cast(B_UI["detailsBox"])
   DETAILS_TITLE = Gtk::Label.cast(B_UI["detailsTitle"])
   DETAILS_IS_OPEN = Gtk::Label.cast(B_UI["detailsIsOpen"])
@@ -23,6 +22,8 @@ module Wince
   DETAILS_ADDRESS = Gtk::Label.cast(B_UI["detailsAddress"])
   DETAILS_PHONE = Gtk::Label.cast(B_UI["detailsPhone"])
   DETAILS_URL = Gtk::LinkButton.cast(B_UI["detailsUrl"])
+  DETAILS_CLAMP = Adw::Clamp.cast(B_UI["detailsClamp"])
+  DETAILS_BACK = Gtk::Button.cast(B_UI["detailsBack"])
 
   APP = Adw::Application.new("dev.wince", Gio::ApplicationFlags::None)
 end