Tighten up the forecast period panels a bit

This commit is contained in:
Lance Edgar 2024-06-08 20:32:02 -05:00
parent 757e5ce6c8
commit aa12f028a5

View file

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