ckaczor/HomeMonitor
1
0
Fork 0
mirror of https://github.com/ckaczor/HomeMonitor.git synced 2026-02-16 10:58:32 -05:00
Code Issues 9 Packages Projects Releases Wiki Activity

Increase text size

Browse Source
This commit is contained in:
Chris Kaczor
2024-12-17 14:57:01 +00:00
parent 7edb527957
commit 5ea5019756
1 changed files with 21 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -52,9 +52,9 @@
class="kiosk-generation text-center pt-4" class="kiosk-generation text-center pt-4"
v-if="powerStore.current"> v-if="powerStore.current">
<v-icon <v-icon
class="kiosk-device" class="kiosk-device-icon"
icon="mdi-solar-power-variant" /> icon="mdi-solar-power-variant" />
<div> <div class="kiosk-device-text">
{{ (powerStore.current!.Generation < 0 ? 0 : powerStore.current!.Generation) + '&thinsp;W' }} {{ (powerStore.current!.Generation < 0 ? 0 : powerStore.current!.Generation) + '&thinsp;W' }}
</div> </div>
</div> </div>
@@ -62,9 +62,9 @@
class="kiosk-consumption text-center pt-4" class="kiosk-consumption text-center pt-4"
v-if="powerStore.current"> v-if="powerStore.current">
<v-icon <v-icon
class="kiosk-device" class="kiosk-device-icon"
icon="mdi-home-lightning-bolt" /> icon="mdi-home-lightning-bolt" />
<div> <div class="kiosk-device-text">
{{ powerStore.current.Consumption + '&thinsp;W' }} {{ powerStore.current.Consumption + '&thinsp;W' }}
</div> </div>
</div> </div>
@@ -73,9 +73,9 @@
v-if="laundryStore?.current?.washer !== undefined" v-if="laundryStore?.current?.washer !== undefined"
:class="laundryStore.current.washer.toString()"> :class="laundryStore.current.washer.toString()">
<v-icon <v-icon
class="kiosk-device" class="kiosk-device-icon"
icon="mdi-washing-machine" /> icon="mdi-washing-machine" />
<div> <div class="kiosk-device-text">
{{ laundryStore.current.washer ? 'On' : 'Off' }} {{ laundryStore.current.washer ? 'On' : 'Off' }}
</div> </div>
</div> </div>
@@ -84,9 +84,9 @@
v-if="laundryStore?.current?.dryer !== undefined" v-if="laundryStore?.current?.dryer !== undefined"
:class="laundryStore.current.dryer.toString()"> :class="laundryStore.current.dryer.toString()">
<v-icon <v-icon
class="kiosk-device" class="kiosk-device-icon"
icon="mdi-tumble-dryer" /> icon="mdi-tumble-dryer" />
<div> <div class="kiosk-device-text">
{{ laundryStore.current.dryer ? 'On' : 'Off' }} {{ laundryStore.current.dryer ? 'On' : 'Off' }}
</div> </div>
</div> </div>
@@ -94,9 +94,9 @@
class="kiosk-garage-door text-center pt-4" class="kiosk-garage-door text-center pt-4"
v-if="homeAssistantStore?.garageState"> v-if="homeAssistantStore?.garageState">
<v-icon <v-icon
class="kiosk-device" class="kiosk-device-icon"
:icon="homeAssistantStore.garageState === 'closed' ? 'mdi-garage' : 'mdi-garage-open'" /> :icon="homeAssistantStore.garageState === 'closed' ? 'mdi-garage' : 'mdi-garage-open'" />
<div> <div class="kiosk-device-text">
{{ capitalize(homeAssistantStore.garageState) }} {{ capitalize(homeAssistantStore.garageState) }}
</div> </div>
</div> </div>
@@ -104,9 +104,9 @@
class="kiosk-house-alarm text-center pt-4" class="kiosk-house-alarm text-center pt-4"
v-if="homeAssistantStore?.houseAlarmState"> v-if="homeAssistantStore?.houseAlarmState">
<v-icon <v-icon
class="kiosk-device" class="kiosk-device-icon"
icon="mdi-shield-home" /> icon="mdi-shield-home" />
<div> <div class="kiosk-device-text">
{{ capitalize(homeAssistantStore.houseAlarmState) }} {{ capitalize(homeAssistantStore.houseAlarmState) }}
</div> </div>
</div> </div>
@@ -160,22 +160,22 @@
} }
.kiosk-time { .kiosk-time {
font-size: 2rem; font-size: 2.8rem;
grid-area: kiosk-time; grid-area: kiosk-time;
} }
.kiosk-date { .kiosk-date {
font-size: 1.1rem; font-size: 1.25rem;
grid-area: kiosk-date; grid-area: kiosk-date;
} }
.kiosk-temperature { .kiosk-temperature {
font-size: 2rem; font-size: 2.8rem;
grid-area: kiosk-temperature; grid-area: kiosk-temperature;
} }
.kiosk-humidity { .kiosk-humidity {
font-size: 2rem; font-size: 2.8rem;
grid-area: kiosk-humidity; grid-area: kiosk-humidity;
} }
@@ -203,10 +203,14 @@
grid-area: kiosk-house-alarm; grid-area: kiosk-house-alarm;
} }
.kiosk-device { .kiosk-device-icon {
font-size: 2.5rem; font-size: 2.5rem;
} }
.kiosk-device-text {
font-size: 1.3rem;
}
.true { .true {
color: #d09f27; color: #d09f27;
} }