ckaczor/HomeMonitor
1
0
Fork 0
mirror of https://github.com/ckaczor/HomeMonitor.git synced 2026-01-13 17:22:54 -05:00
Code Issues Packages Projects Releases Wiki Activity

UI tweaks

Browse Source
This commit is contained in:
Chris Kaczor
2025-02-10 21:44:23 +00:00
parent 766fa7c0cf
commit 6454bba7c8
3 changed files with 15 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
WebDisplay/package.json
View File

@@ -1,7 +1,7 @@
{
"name": "web-display",
"version": "1.0.0",
"packageManager": "pnpm@9.15.0",
"packageManager": "pnpm@10.2.1",
"scripts": {
"dev": "cross-env NODE_OPTIONS='--no-warnings' vite",
"build": "vue-tsc --noEmit && vite build",

14
WebDisplay/src/pages/kiosk.vue
View File

@@ -102,6 +102,7 @@
@click="showFeelsLike = !showFeelsLike"
v-if="weatherStore.current">
<div class="display-item">
<span class="display-item-header">Temperature</span>
<span class="display-item-value">{{ getTemperature() }}</span>
<span class="display-item-label">{{ showFeelsLike ? 'Feels Like' : 'Actual' }}</span>
</div>
@@ -110,8 +111,9 @@
class="kiosk-humidity text-center pb-3"
v-if="weatherStore.current">
<div class="display-item">
<span class="display-item-header">Dew Point</span>
<span class="display-item-value">
{{ weatherStore.current?.Humidity?.toFixed(0) + '%' }}
{{ weatherStore.current?.DewPoint?.toFixed(0) + '°' }}
</span>
<span class="display-item-label">{{ dewPointDescription(weatherStore.current?.DewPoint) }}</span>
</div>
@@ -120,6 +122,7 @@
class="kiosk-wind text-center pb-3"
v-if="weatherStore.current">
<div class="display-item">
<span class="display-item-header">Wind</span>
<span class="display-item-value">
<span>
{{ weatherStore.current?.WindSpeed?.toFixed(1) }}
@@ -133,13 +136,14 @@
class="kiosk-pressure text-center pb-3"
v-if="weatherStore.current">
<div class="display-item">
<span class="display-item-header">Pressure</span>
<span class="display-item-value">
<span>
{{ (weatherStore.current?.Pressure! / 100).toFixed(0) }}
</span>
<PressureTrendArrow :pressureDifference="weatherStore.current?.PressureDifferenceThreeHour" />
</span>
<span class="display-item-label">MB</span>
<span class="display-item-label">hPa</span>
</div>
</div>
<div
@@ -363,7 +367,11 @@
}
.display-item-value {
height: calc(1em + 10px);
line-height: calc(100% + 2px);
}
.display-item-header {
font-size: 10pt;
}
.display-item-label {

4
WebDisplay/src/stores/weatherStore.ts
View File

@@ -32,7 +32,9 @@ export const useWeatherStore = defineStore('weather', {
await this._connection.start();
this._connection.on('LatestReading', (message: string) => {
this.$patch({ current: JSON.parse(message) });
const json: WeatherUpdate = JSON.parse(message);
this.$patch({ current: json });
});
},
async stop() {