From aa12f028a575615b992b41f35d3b5a3d26c27883 Mon Sep 17 00:00:00 2001
From: Lance Edgar <lance@edbob.org>
Date: Sat, 8 Jun 2024 20:32:02 -0500
Subject: [PATCH] Tighten up the forecast period panels a bit

---
 src/views/WeatherView.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/views/WeatherView.vue b/src/views/WeatherView.vue
index 2d46308..2c144a5 100644
--- a/src/views/WeatherView.vue
+++ b/src/views/WeatherView.vue
@@ -50,6 +50,10 @@ export default {
             this.coordinates = this.weatherStore.coordinates
         },
 
+        getShortForecast(period) {
+            return period.shortForecast.replace(/Showers And Thunderstorms/g, 'T-storms')
+        },
+
         showHourly(period) {
             this.$router.push('/hourly')
         },
@@ -96,7 +100,7 @@ export default {
                 <img :src="period.icon" />
               </div>
 
-              <p>{{ period.shortForecast }}</p>
+              <p>{{ getShortForecast(period) }}</p>
 
               <p>
                 <span v-if="period.isDaytime">Hi</span>
@@ -138,7 +142,8 @@ export default {
 <style scoped>
 
 .weather-period {
-    min-width: 100px;
+    width: 100px;
+    flex-shrink: 0;
     display: flex;
     flex-direction: column;
     align-items: center;