From 0ce54f904009dd19958104ddf625d3280fc42bfd Mon Sep 17 00:00:00 2001 From: kyle Date: Wed, 31 Dec 2025 04:26:34 -0800 Subject: [PATCH] Add dashboard-kiosk-final.yaml --- dashboard-kiosk-final.yaml | 200 +++++++++++++++++++++++++++++++++++++ 1 file changed, 200 insertions(+) create mode 100644 dashboard-kiosk-final.yaml diff --git a/dashboard-kiosk-final.yaml b/dashboard-kiosk-final.yaml new file mode 100644 index 0000000..c240104 --- /dev/null +++ b/dashboard-kiosk-final.yaml @@ -0,0 +1,200 @@ +title: Kiosk Dashboard +path: dashboard-kiosk +icon: mdi:view-dashboard +panel: false +type: sidebar +views: + - title: Kiosk View + path: default_view + cards: + - type: markdown + content: | + #
{{ now().strftime('%A, %B %d, %Y') }}
+ ##
{{ now().strftime('%I:%M %p') }}
+ card_mod: + style: | + ha-card { + font-size: 4em !important; + padding: 60px !important; + text-align: center; + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + color: white !important; + min-height: 100vh !important; + } + h1 { font-size: 1.2em !important; margin: 20px 0 !important; } + h2 { font-size: 0.8em !important; margin: 10px 0 !important; } + - type: weather-forecast + entity: weather.forecast_home + name: Current Weather + show_forecast: true + forecast_type: daily + card_mod: + style: | + ha-card { + font-size: 2.5em !important; + padding: 50px !important; + min-height: 500px; + } + .weather-icon { width: 120px !important; height: 120px !important; } + .temp { font-size: 3em !important; } + * { font-size: 1.5em !important; } + - type: entities + title: 🌅 Sun Information + card_mod: + style: | + ha-card { + font-size: 2.5em !important; + padding: 50px !important; + min-height: 500px; + } + .card-content { font-size: 2em !important; } + .entity-row { min-height: 80px !important; padding: 20px 0 !important; } + .entity-row .info { font-size: 1.8em !important; } + .entity-row .secondary { font-size: 1.5em !important; } + entities: + - entity: sun.sun + name: Sun Position + icon: mdi:weather-sunny + - entity: sensor.sun_next_rising + name: Sunrise + icon: mdi:weather-sunset-up + - entity: sensor.sun_next_setting + name: Sunset + icon: mdi:weather-sunset-down + - entity: sensor.sun_next_dawn + name: Dawn + icon: mdi:weather-sunset-up + - entity: sensor.sun_next_dusk + name: Dusk + icon: mdi:weather-sunset-down + - type: entities + title: 🚆 Public Transport + card_mod: + style: | + ha-card { + font-size: 2.5em !important; + padding: 50px !important; + min-height: 500px; + } + .card-content { font-size: 2em !important; } + .entity-row { min-height: 80px !important; padding: 20px 0 !important; } + .entity-row .info { font-size: 1.8em !important; } + .entity-row .secondary { font-size: 1.5em !important; } + entities: + - entity: sensor.roslagsbanan_line_28_to_stockholms_ostra + name: To Stockholm Östra + icon: mdi:train + - entity: sensor.roslagsbanan_line_28_to_akersberga + name: To Åkersberga + icon: mdi:train + - entity: sensor.sl_departure_sensor_9636_bravalavagen + name: SL Departure + icon: mdi:bus + - entity: sensor.next_departure_time + name: Next Departure + icon: mdi:clock-outline + - type: entities + title: 📹 Camera Status + card_mod: + style: | + ha-card { + font-size: 2.5em !important; + padding: 50px !important; + min-height: 500px; + } + .card-content { font-size: 2em !important; } + .entity-row { min-height: 80px !important; padding: 20px 0 !important; } + .entity-row .info { font-size: 1.8em !important; } + .entity-row .secondary { font-size: 1.5em !important; } + entities: + - entity: binary_sensor.backyard_motion + name: Backyard Motion + icon: mdi:motion-sensor + - entity: binary_sensor.frontdoor_motion + name: Front Door Motion + icon: mdi:motion-sensor + - entity: binary_sensor.driveway_motion + name: Driveway Motion + icon: mdi:motion-sensor + - entity: binary_sensor.roofcam_motion + name: Roof Camera Motion + icon: mdi:motion-sensor + - type: entities + title: 👥 Occupancy Summary + card_mod: + style: | + ha-card { + font-size: 2.5em !important; + padding: 50px !important; + min-height: 500px; + } + .card-content { font-size: 2em !important; } + .entity-row { min-height: 80px !important; padding: 20px 0 !important; } + .entity-row .info { font-size: 1.8em !important; } + .entity-row .secondary { font-size: 1.5em !important; } + entities: + - entity: sensor.backyard_person_count + name: Backyard People + icon: mdi:account-group + - entity: sensor.frontdoor_person_count + name: Front Door People + icon: mdi:account-group + - entity: sensor.driveway_person_count + name: Driveway People + icon: mdi:account-group + - entity: sensor.roofcam_person_count + name: Roof Camera People + icon: mdi:account-group + - type: entities + title: 🌐 Network Status + card_mod: + style: | + ha-card { + font-size: 2.5em !important; + padding: 50px !important; + min-height: 500px; + } + .card-content { font-size: 2em !important; } + .entity-row { min-height: 80px !important; padding: 20px 0 !important; } + .entity-row .info { font-size: 1.8em !important; } + .entity-row .secondary { font-size: 1.5em !important; } + entities: + - entity: sensor.xe75_download_speed + name: Download Speed + icon: mdi:download + - entity: sensor.xe75_upload_speed + name: Upload Speed + icon: mdi:upload + - entity: sensor.external_ip + name: External IP + icon: mdi:ip-network + - entity: binary_sensor.xe75_wan_status + name: WAN Status + icon: mdi:router-wireless + card_mod: + style: | + #view { + overflow: hidden; + height: 100vh; + position: relative; + } + #view > ha-view { + animation: scrollCards 40s infinite; + animation-timing-function: ease-in-out; + } + @keyframes scrollCards { + 0%, 12.5% { transform: translateY(0); } + 12.6%, 25% { transform: translateY(-100vh); } + 25.1%, 37.5% { transform: translateY(-200vh); } + 37.6%, 50% { transform: translateY(-300vh); } + 50.1%, 62.5% { transform: translateY(-400vh); } + 62.6%, 75% { transform: translateY(-500vh); } + 75.1%, 87.5% { transform: translateY(-600vh); } + 87.6%, 100% { transform: translateY(-700vh); } + } + ha-card { + min-height: 100vh !important; + margin-bottom: 0 !important; + display: flex !important; + flex-direction: column !important; + }