Update dashboard designs

This commit is contained in:
2022-06-25 17:37:38 +03:00
parent 11e0619fd4
commit 882d7c8a8c
12 changed files with 274 additions and 134 deletions
+9 -3
View File
@@ -34,10 +34,16 @@ lovelace:
dashboards: dashboards:
lovelace-home: lovelace-home:
mode: yaml mode: yaml
title: Home title: Mobile
icon: mdi:home icon: mdi:cellphone
show_in_sidebar: true show_in_sidebar: false
filename: ui-lovelace.yaml filename: ui-lovelace.yaml
lovelace-desktop:
mode: yaml
title: Desktop
icon: mdi:desktop-mac-dashboard
show_in_sidebar: false
filename: desktop-lovelace.yaml
lovelace-floorlan: lovelace-floorlan:
mode: yaml mode: yaml
title: Floorplan title: Floorplan
+65
View File
@@ -0,0 +1,65 @@
decluttering_templates: !include_dir_merge_named lovelace/decluttering_templates
button_card_templates: !include_dir_merge_named lovelace/button_card_templates
popup_cards: !include lovelace/popup_cards.yaml
kiosk_mode:
hide_overflow: true
title: Desktop
views:
- title: Living Room
path: default_view
icon: "mdi:sofa"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPad/Media Room.jpg") #6b8988 fixed'
cards: !include lovelace/home_dashboard/living_room_dashboard.yaml
theme: sarah-noctis-grey
- title: Bedroom
path: bedroom
icon: "mdi:bed-empty"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPad/Bedroom.jpg") #9489d1 fixed'
cards: !include lovelace/home_dashboard/bedroom_dashboard.yaml
theme: sarah-noctis-grey
- title: Kitchen
path: kitchen
icon: "mdi:chef-hat"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPad/Kitchen.jpg") #bacd8c fixed'
cards: !include lovelace/home_dashboard/kitchen_dashboard.yaml
theme: sarah-noctis-grey
- title: Bathroom
path: bathroom
icon: "mdi:shower-head"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPad/Bathroom.jpg") #2982c4 fixed'
cards: !include lovelace/home_dashboard/bathroom_dashboard.yaml
theme: sarah-noctis-grey
- title: Hallway
path: hallway
icon: "mdi:door-closed"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPad/Hallway.jpg") #b1633e fixed'
cards: !include lovelace/home_dashboard/hallway_dashboard.yaml
theme: sarah-noctis-grey
- title: Terrarium
path: terrarium
icon: "mdi:snake"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers-3/terrarium.jpg") #5E3C0F fixed'
cards: !include lovelace/home_dashboard/terrarium_dashboard.yaml
theme: sarah-noctis-grey
- title: Guest Bedroom
path: guest_bedroom
icon: "mdi:numeric-2-box-outline"
panel: true
background: '#0040A0'
cards: !include lovelace/home_dashboard/guest_bedroom_dashboard.yaml
theme: sarah-noctis-grey
- title: Preferences
path: Preferences
icon: "mdi:cogs"
panel: true
background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPad/Work-Bench.jpg") #8aaec3 fixed'
cards: !include lovelace/home_dashboard/preferences_dashboard.yaml
theme: sarah-noctis-grey
+77 -1
View File
@@ -36,4 +36,80 @@ views:
margin: 10px; margin: 10px;
padding: 10px; padding: 10px;
} }
- !include lovelace/home_dashboard/kitchen_dashboard_card.yaml - type: custom:decluttering-card
template: v3_title
variables:
- title: Kitchen
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_badge_temp
entity: sensor.kitchen_weather_temperature
- type: custom:button-card
template: v3_badge_humidity
entity: sensor.kitchen_weather_humidity
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_motion_occupancy
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_window
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_door
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Lights
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button_light
entity: light.kitchen
name: All
- type: custom:button-card
template: v3_button_light
entity: light.kitchen_main
name: Main
- type: custom:button-card
template: v3_button_light
entity: light.kitchen_secondary
name: Secondary
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Devices
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button
entity: media_player.kitchen
name: Sonos
- type: custom:button-card
template: v3_button
entity: binary_sensor.sonos_is_kitchen_grouped
name: Sonos Grouped
tap_action:
action: call-service
service: "[[[ return entity.state == 'on' ? 'script.sonos_kitchen_unjoin' : 'script.sonos_kitchen_join' ]]]"
- type: custom:button-card
template: v3_button_radiator
entity: climate.kitchen_radiator_mode
name: Radiator
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button
entity: vacuum.vacuum
name: Vacuum
- type: custom:button-card
template: v3_button_brita_water
- type: custom:button-card
template: v3_button_power
entity: switch.kitchen_outlet
name: Outlet
variables:
power_sensor: sensor.kitchen_outlet_electric_consumption_w
@@ -12,6 +12,7 @@ v3_title:
ha-card > ha-markdown { ha-card > ha-markdown {
font-size: 22px; font-size: 22px;
padding: 20px 20px 20px 0; padding-left: 0;
padding-bottom: 14px;
letter-spacing: -1px; letter-spacing: -1px;
} }
@@ -3,7 +3,7 @@
layout-card: layout-card:
.: | .: |
* { * {
--primary-color: #FF7900 --primary-color: #2982c4
} }
$: $:
@@ -3,7 +3,7 @@
layout-card: layout-card:
.: | .: |
* { * {
--primary-color: #871CAB --primary-color: #9489d1
} }
$: $:
@@ -41,6 +41,8 @@
state_display: "[[[return entity.state.split(' ')[0] + ' pm2.5']]]" state_display: "[[[return entity.state.split(' ')[0] + ' pm2.5']]]"
variables: variables:
state_size: "11px" state_size: "11px"
- type: horizontal-stack
cards:
- type: custom:button-card - type: custom:button-card
template: v3_badge_icon template: v3_badge_icon
entity: binary_sensor.bedroom_left_window entity: binary_sensor.bedroom_left_window
@@ -3,7 +3,7 @@
layout-card: layout-card:
.: | .: |
* { * {
--primary-color: #188A9C --primary-color: #b1633e
} }
$: $:
@@ -37,6 +37,8 @@
- type: custom:button-card - type: custom:button-card
template: v3_badge_icon template: v3_badge_icon
entity: group.hallway_motion entity: group.hallway_motion
- type: horizontal-stack
cards:
- type: custom:button-card - type: custom:button-card
template: v3_badge_icon template: v3_badge_icon
entity: binary_sensor.hallway_motion_occupancy entity: binary_sensor.hallway_motion_occupancy
@@ -3,7 +3,7 @@
layout-card: layout-card:
.: | .: |
* { * {
--primary-color: #58892D --primary-color: #bacd8c
} }
$: $:
@@ -14,4 +14,93 @@
margin: 0 20px; margin: 0 20px;
grid-gap: 20px; grid-gap: 20px;
} }
card: !include kitchen_dashboard_card.yaml card:
type: custom:layout-card
layout_type: custom:horizontal-layout
layout:
max_cols: 3
cards:
- type: vertical-stack
cards:
- type: custom:decluttering-card
template: v3_title
variables:
- title: Kitchen
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_badge_temp
entity: sensor.kitchen_weather_temperature
- type: custom:button-card
template: v3_badge_humidity
entity: sensor.kitchen_weather_humidity
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_motion_occupancy
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_window
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_door
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Lights
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button_light
entity: light.kitchen
name: All
- type: custom:button-card
template: v3_button_light
entity: light.kitchen_main
name: Main
- type: custom:button-card
template: v3_button_light
entity: light.kitchen_secondary
name: Secondary
- type: vertical-stack
cards:
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Devices
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button
entity: media_player.kitchen
name: Sonos
- type: custom:button-card
template: v3_button
entity: binary_sensor.sonos_is_kitchen_grouped
name: Sonos Grouped
tap_action:
action: call-service
service: "[[[ return entity.state == 'on' ? 'script.sonos_kitchen_unjoin' : 'script.sonos_kitchen_join' ]]]"
- type: custom:button-card
template: v3_button_radiator
entity: climate.kitchen_radiator_mode
name: Radiator
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button
entity: vacuum.vacuum
name: Vacuum
- type: custom:button-card
template: v3_button_brita_water
- type: custom:button-card
template: v3_button_power
entity: switch.kitchen_outlet
name: Outlet
variables:
power_sensor: sensor.kitchen_outlet_electric_consumption_w
@@ -1,87 +0,0 @@
type: custom:layout-card
layout_type: custom:horizontal-layout
layout:
max_cols: 3
cards:
- type: vertical-stack
cards:
- type: custom:decluttering-card
template: v3_title
variables:
- title: Kitchen
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_badge_temp
entity: sensor.kitchen_weather_temperature
- type: custom:button-card
template: v3_badge_humidity
entity: sensor.kitchen_weather_humidity
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_motion_occupancy
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_window
- type: custom:button-card
template: v3_badge_icon
entity: binary_sensor.kitchen_door
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Lights
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button_light
entity: light.kitchen
name: All
- type: custom:button-card
template: v3_button_light
entity: light.kitchen_main
name: Main
- type: custom:button-card
template: v3_button_light
entity: light.kitchen_secondary
name: Secondary
- type: vertical-stack
cards:
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Devices
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button
entity: media_player.kitchen
name: Sonos
- type: custom:button-card
template: v3_button
entity: binary_sensor.sonos_is_kitchen_grouped
name: Sonos Grouped
tap_action:
action: call-service
service: "[[[ return entity.state == 'on' ? 'script.sonos_kitchen_unjoin' : 'script.sonos_kitchen_join' ]]]"
- type: custom:button-card
template: v3_button_radiator
entity: climate.kitchen_radiator_mode
name: Radiator
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_button
entity: vacuum.vacuum
name: Vacuum
- type: custom:button-card
template: v3_button_brita_water
- type: custom:button-card
template: v3_button_power
entity: switch.kitchen_outlet
name: Outlet
variables:
power_sensor: sensor.kitchen_outlet_electric_consumption_w
@@ -3,7 +3,7 @@
layout-card: layout-card:
.: | .: |
* { * {
--primary-color: #0040A0 --primary-color: #6b8988
} }
$: $:
@@ -26,6 +26,17 @@
template: v3_title template: v3_title
variables: variables:
- title: Living room - title: Living room
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_badge_temp
entity: sensor.multisensor_6_temperature
- type: custom:button-card
template: v3_badge_humidity
entity: sensor.multisensor_6_relative_humidity
- type: custom:button-card
template: v3_badge
entity: sensor.aqara_tvoc_voc
- type: horizontal-stack - type: horizontal-stack
cards: cards:
- type: custom:button-card - type: custom:button-card
@@ -40,17 +51,6 @@
styles: styles:
card: card:
- background-image: url("/local/images/people/maya.jpg") - background-image: url("/local/images/people/maya.jpg")
- type: custom:button-card
template: v3_badge_temp
entity: sensor.multisensor_6_temperature
- type: custom:button-card
template: v3_badge_humidity
entity: sensor.multisensor_6_relative_humidity
- type: horizontal-stack
cards:
- type: custom:button-card
template: v3_badge
entity: sensor.aqara_tvoc_voc
- type: custom:button-card - type: custom:button-card
template: v3_badge_icon template: v3_badge_icon
entity: binary_sensor.toshiba_ac_conditions_met entity: binary_sensor.toshiba_ac_conditions_met
@@ -28,24 +28,6 @@
- title: Preferences - title: Preferences
- type: horizontal-stack - type: horizontal-stack
cards: cards:
- type: custom:button-card
template: v3_button_person
entity: input_boolean.georgi_home
styles:
card:
- background-image: url("/local/images/people/georgi.jpg")
- type: custom:button-card
template: v3_button_person
entity: input_boolean.player_2_home
styles:
card:
- background-image: url("/local/images/people/maya.jpg")
# - type: custom:button-card
# template: v3_button_person
# entity: input_boolean.player_2_home
# styles:
# card:
# - background-image: url("/local/images/people/milena.jpg")
- type: custom:button-card - type: custom:button-card
template: v3_badge template: v3_badge
entity: binary_sensor.someone_home entity: binary_sensor.someone_home
@@ -53,6 +35,10 @@
template: v3_badge template: v3_badge
entity: binary_sensor.someone_sleeping entity: binary_sensor.someone_sleeping
- type: custom:decluttering-card
template: v3_section_title
variables:
- title: Toggles
- type: horizontal-stack - type: horizontal-stack
cards: cards:
- type: custom:button-card - type: custom:button-card
+7 -7
View File
@@ -15,42 +15,42 @@ views:
path: default_view path: default_view
icon: "mdi:sofa" icon: "mdi:sofa"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/living_room.jpg") #0040A0 fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPhone/Media Room.jpg") #6b8988 fixed'
cards: !include lovelace/home_dashboard/living_room_dashboard.yaml cards: !include lovelace/home_dashboard/living_room_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey
- title: Bedroom - title: Bedroom
path: bedroom path: bedroom
icon: "mdi:bed-empty" icon: "mdi:bed-empty"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/bedroom.jpg") #871CAB fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPhone/Bedroom.jpg") #9489d1 fixed'
cards: !include lovelace/home_dashboard/bedroom_dashboard.yaml cards: !include lovelace/home_dashboard/bedroom_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey
- title: Kitchen - title: Kitchen
path: kitchen path: kitchen
icon: "mdi:chef-hat" icon: "mdi:chef-hat"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/kitchen_3.jpg") #58892D fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPhone/Kitchen.jpg") #bacd8c fixed'
cards: !include lovelace/home_dashboard/kitchen_dashboard.yaml cards: !include lovelace/home_dashboard/kitchen_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey
- title: Bathroom - title: Bathroom
path: bathroom path: bathroom
icon: "mdi:shower-head" icon: "mdi:shower-head"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/bathroom_2.jpg") #FF7900 fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPhone/Bathroom.jpg") #2982c4 fixed'
cards: !include lovelace/home_dashboard/bathroom_dashboard.yaml cards: !include lovelace/home_dashboard/bathroom_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey
- title: Hallway - title: Hallway
path: hallway path: hallway
icon: "mdi:door-closed" icon: "mdi:door-closed"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/hallway_2.jpg") #188A9C fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPhone/Hallway.jpg") #b1633e fixed'
cards: !include lovelace/home_dashboard/hallway_dashboard.yaml cards: !include lovelace/home_dashboard/hallway_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey
- title: Terrarium - title: Terrarium
path: terrarium path: terrarium
icon: "mdi:snake" icon: "mdi:snake"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/terrarium.jpg") #5E3C0F fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers-3/terrarium.jpg") #5E3C0F fixed'
cards: !include lovelace/home_dashboard/terrarium_dashboard.yaml cards: !include lovelace/home_dashboard/terrarium_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey
- title: Guest Bedroom - title: Guest Bedroom
@@ -64,6 +64,6 @@ views:
path: Preferences path: Preferences
icon: "mdi:cogs" icon: "mdi:cogs"
panel: true panel: true
background: 'center / cover no-repeat url("/local/images/wallpapers-3/preferences.jpg") #6A737A fixed' background: 'top / 100% no-repeat url("/local/images/wallpapers/comic/iPhone/Work-Bench.jpg") #8aaec3 fixed'
cards: !include lovelace/home_dashboard/preferences_dashboard.yaml cards: !include lovelace/home_dashboard/preferences_dashboard.yaml
theme: sarah-noctis-grey theme: sarah-noctis-grey