From b983a34bc99175fc85b255e7097972c5ac930450 Mon Sep 17 00:00:00 2001
From: Lance Edgar <lance@edbob.org>
Date: Sat, 8 Jun 2024 19:35:45 -0500
Subject: [PATCH] Make buttons half-wide on home screen (desktop mode)

having a button take up full screen width is a bit much
---
 src/views/HomeView.vue | 58 +++++++++++++++++++++++-------------------
 1 file changed, 32 insertions(+), 26 deletions(-)

diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 55872e0..5f26d36 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -123,34 +123,40 @@ export default {
       </o-button>
     </o-field>
 
-    <div v-for="location in locationStore.locations"
-         :key="location.coordinates"
-         class="location">
-      <o-button variant="primary"
-                icon-right="arrow-right"
-                expanded
-                @click="showWeather(location)">
-        {{ location.cityState }}
-      </o-button>
-    </div>
+    <div class="columns">
+      <div class="column is-half">
 
-    <div v-if="locationStore.locations.length"
-         class="location">
-      <o-button icon-right="edit"
-                expanded
-                @click="editLocations()">
-        Edit List
-      </o-button>
-    </div>
+        <div v-for="location in locationStore.locations"
+             :key="location.coordinates"
+             class="location">
+          <o-button variant="primary"
+                    icon-right="arrow-right"
+                    expanded
+                    @click="showWeather(location)">
+            {{ location.cityState }}
+          </o-button>
+        </div>
 
-    <br />
-    <div class="location">
-      <o-button variant="primary"
-                icon-right="location-dot"
-                expanded
-                @click="useCurrentLocation()">
-        Use My Current Location
-      </o-button>
+        <div v-if="locationStore.locations.length"
+             class="location">
+          <o-button icon-right="edit"
+                    expanded
+                    @click="editLocations()">
+            Edit List
+          </o-button>
+        </div>
+
+        <br />
+        <div class="location">
+          <o-button variant="primary"
+                    icon-right="location-dot"
+                    expanded
+                    @click="useCurrentLocation()">
+            Use My Current Location
+          </o-button>
+        </div>
+
+      </div>
     </div>
 
   </main>