@@ -115,25 +94,6 @@
}
.pressure-trend-arrow {
- display: inline-block;
- position: relative;
- left: 6px;
- transform: scale(1.25);
- }
-
- .down-high {
- transform: rotate(60deg) scale(1.25);
- }
-
- .down-low {
- transform: rotate(25deg) scale(1.25);
- }
-
- .up-high {
- transform: rotate(-60deg) scale(1.25);
- }
-
- .up-low {
- transform: rotate(-25deg) scale(1.25);
+ scale: 1.25;
}
diff --git a/WebDisplay/src/components/PressureTrendArrow.vue b/WebDisplay/src/components/PressureTrendArrow.vue
new file mode 100644
index 0000000..4108aa4
--- /dev/null
+++ b/WebDisplay/src/components/PressureTrendArrow.vue
@@ -0,0 +1,52 @@
+
+
+
+
+ ➜
+
+
+
+
diff --git a/WebDisplay/src/pages/kiosk.vue b/WebDisplay/src/pages/kiosk.vue
index 6543bda..de581d3 100644
--- a/WebDisplay/src/pages/kiosk.vue
+++ b/WebDisplay/src/pages/kiosk.vue
@@ -4,8 +4,10 @@
import { useLaundryStore } from '@/stores/laundryStore';
import { usePowerStore } from '@/stores/powerStore';
import { useHomeAssistantStore } from '@/stores/homeAssistantStore';
+ import { ShortenWindDirection } from '@/windFormatter';
import CalendarAgenda from '@/components/CalendarAgenda.vue';
import LongPressButton from '@/components/LongPressButton.vue';
+ import PressureTrendArrow from '@/components/PressureTrendArrow.vue';
const weatherStore = useWeatherStore();
weatherStore.start();
@@ -63,6 +65,19 @@
v-if="weatherStore.current">
{{ weatherStore.current?.Humidity?.toFixed(0) + '%' }}
+
+ {{ weatherStore.current?.WindSpeed?.toFixed(0) + ' ' + ShortenWindDirection(weatherStore.current?.WindDirection) }}
+
+
+
+ {{ (weatherStore.current?.Pressure! / 100).toFixed(0) }}
+
+
+
@@ -170,7 +185,7 @@
display: grid;
grid-template-columns: repeat(2, 50%);
- grid-template-rows: repeat(6, auto) 1fr;
+ grid-template-rows: repeat(7, auto) 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
@@ -178,6 +193,7 @@
'kiosk-time kiosk-time'
'kiosk-date kiosk-date'
'kiosk-temperature kiosk-humidity'
+ 'kiosk-wind kiosk-pressure'
'kiosk-generation kiosk-consumption'
'kiosk-washer kiosk-dryer'
'kiosk-garage-door kiosk-house-alarm';
@@ -218,6 +234,16 @@
grid-area: kiosk-humidity;
}
+ .kiosk-wind {
+ font-size: 2rem;
+ grid-area: kiosk-wind;
+ }
+
+ .kiosk-pressure {
+ font-size: 2rem;
+ grid-area: kiosk-pressure;
+ }
+
.kiosk-generation {
grid-area: kiosk-generation;
}