Alexander Savin
26d86dec90
Some checks failed
Savin's Home Assistant / build (push) Failing after 1m45s
1119 lines
41 KiB
YAML
1119 lines
41 KiB
YAML
# ${card.querySelector('.bubble-state').innerText = "It's currently " + hass.states['weather.forecast_home'].state} # Change Entity Status string change show_state to false
|
||
|
||
# bubble-feedback-container margin
|
||
|
||
# var(--bubble-button-accent-color, var(--bubble-accent-color, var(--accent-color)))
|
||
|
||
# .bubble-sub-button-2 {
|
||
# background-color: rgba(${hass.states['light.led_bett'].attributes.rgb_color});
|
||
# }
|
||
|
||
---
|
||
title: Testing
|
||
icon: mdi:test-tube
|
||
panel: true
|
||
visible:
|
||
- user: 1614b22cbef54f979741cf8a6b3413ec # Alex
|
||
cards:
|
||
- type: custom:layout-card
|
||
layout_type: custom:vertical-layout
|
||
layout:
|
||
max_cols: 3
|
||
cards:
|
||
- type: vertical-stack
|
||
cards:
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
# name: Kitchen
|
||
icon: mdi:countertop-outline
|
||
sub_button:
|
||
- name: Temp
|
||
icon: mdi:thermometer-lines
|
||
entity: sensor.climate_kitchen_01_temperature
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Humidity
|
||
icon: mdi:water-percent
|
||
entity: sensor.climate_kitchen_01_humidity
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Light Level
|
||
icon: mdi:weather-sunny
|
||
entity: sensor.presence_kitchen_light_level_2
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: PM2.5
|
||
icon: mdi:blur
|
||
entity: sensor.climate_kitchen_02_pm25
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
styles: |
|
||
.bubble-feedback-container {
|
||
margin: 0px;
|
||
}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: switch
|
||
name: Light
|
||
entity: input_boolean.kitchen_light_state
|
||
icon: mdi:lightbulb-group
|
||
show_state: true
|
||
show_background: false
|
||
tap_action:
|
||
action: toggle
|
||
button_action:
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: '#kitchen'
|
||
sub_button:
|
||
- icon: mdi:lightbulb-group
|
||
entity: scene.kitchen_all
|
||
show_state: false
|
||
show_background: true
|
||
tap_action:
|
||
action: call-service
|
||
service: input_select.select_option
|
||
service_data:
|
||
entity_id: input_select.kitchen_scenes
|
||
option: "All"
|
||
- icon: mdi:countertop-outline
|
||
entity: scene.kitchen_work_zone_only
|
||
show_state: false
|
||
show_background: true
|
||
tap_action:
|
||
action: call-service
|
||
service: input_select.select_option
|
||
service_data:
|
||
entity_id: input_select.kitchen_scenes
|
||
option: "Work Zone Only"
|
||
- icon: mdi:food-turkey
|
||
entity: scene.kitchen_dinning_zone_only
|
||
show_state: false
|
||
show_background: true
|
||
tap_action:
|
||
action: call-service
|
||
service: input_select.select_option
|
||
service_data:
|
||
entity_id: input_select.kitchen_scenes
|
||
option: "Dinning Zone Only"
|
||
- icon: mdi:ceiling-light-multiple
|
||
entity: scene.kitchen_ceiling_only
|
||
show_state: false
|
||
show_background: true
|
||
tap_action:
|
||
action: call-service
|
||
service: input_select.select_option
|
||
service_data:
|
||
entity_id: input_select.kitchen_scenes
|
||
option: "Ceiling Only"
|
||
styles: |
|
||
.bubble-sub-button-1 > ha-icon {
|
||
color: ${hass.states['input_select.kitchen_scenes'].state === 'All' ? 'rgb(255, 152, 0)' : ''} !important;
|
||
}
|
||
.bubble-sub-button-2 > ha-icon {
|
||
color: ${hass.states['input_select.kitchen_scenes'].state === 'Work Zone Only' ? 'rgb(255, 152, 0)' : ''} !important;
|
||
}
|
||
.bubble-sub-button-3 > ha-icon {
|
||
color: ${hass.states['input_select.kitchen_scenes'].state === 'Dinning Zone Only' ? 'rgb(255, 152, 0)' : ''} !important;
|
||
}
|
||
.bubble-sub-button-4 > ha-icon {
|
||
color: ${hass.states['input_select.kitchen_scenes'].state === 'Ceiling Only' ? 'rgb(255, 152, 0)' : ''} !important;
|
||
}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:countertop-outline
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.kitchen_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
tap_action:
|
||
action: data
|
||
entity_id: image.kitchen_person
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.kitchen_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:sofa
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.living_room_01_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.living_room_01_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:sofa
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.living_room_02_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.living_room_02_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:stairs
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.stairway_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.stairway_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:bed-king
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.bedroom_master_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.bedroom_master_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:bed
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.bedroom_max_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.bedroom_max_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:bed
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.bedroom_olivia_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.bedroom_olivia_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:garage-variant
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.garage_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.garage_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:bubble-card
|
||
card_type: separator
|
||
icon: mdi:home-circle-outline
|
||
sub_button:
|
||
- name: People
|
||
icon: mdi:account-group
|
||
entity: sensor.pergola_person_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
- name: Cats
|
||
icon: mdi:cat
|
||
entity: sensor.pergola_cat_count
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: false
|
||
|
||
- type: custom:layout-break
|
||
- type: vertical-stack
|
||
cards:
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: switch
|
||
name: Vacuum
|
||
entity: vacuum.roborock_s5_max
|
||
icon: mdi:robot-vacuum
|
||
show_state: true
|
||
show_last_changed: true
|
||
tap_action:
|
||
action: more-info
|
||
button_action:
|
||
tap_action:
|
||
action: more-info
|
||
sub_button:
|
||
- name: Return to dock
|
||
icon: mdi:home
|
||
show_background: false
|
||
tap_action:
|
||
action: call-service
|
||
service: vacuum.return_to_base
|
||
target:
|
||
entity_id: vacuum.roborock_s5_max
|
||
- name: Pause
|
||
icon: mdi:pause
|
||
show_background: false
|
||
tap_action:
|
||
action: call-service
|
||
service: vacuum.pause
|
||
target:
|
||
entity_id: vacuum.roborock_s5_max
|
||
- name: Start
|
||
icon: mdi:play
|
||
tap_action:
|
||
action: call-service
|
||
service: vacuum.start
|
||
target:
|
||
entity_id: vacuum.roborock_s5_max
|
||
styles: >-
|
||
.bubble-button-card-container {
|
||
/* Change the background color when the vacuum get an error (optional), more details in the styles template section */
|
||
background: ${state === 'error' ? 'rgb(200, 80, 40)' : ''} !important;
|
||
}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: 'CyberPower UPS #1'
|
||
entity: sensor.ups_cyberpower_01_status
|
||
icon: mdi:power-plug-battery
|
||
show_state: true
|
||
show_attribute: true
|
||
tap_action:
|
||
action: more-info
|
||
button_action:
|
||
tap_action:
|
||
action: more-info
|
||
sub_button:
|
||
- name: Battery
|
||
entity: sensor.ups_cyberpower_01_battery_level
|
||
icon: mdi:battery
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Time Left
|
||
entity: sensor.ups_cyberpower_01_time_left
|
||
icon: mdi:timer
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Load
|
||
entity: sensor.ups_cyberpower_01_load_percentage
|
||
icon: mdi:battery-arrow-down
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Transfers
|
||
entity: sensor.ups_cyberpower_01_transfers
|
||
icon: mdi:sync
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'COMMLOST' ? 'rgb(255, 179, 179)' : '' } !important;
|
||
}
|
||
${icon.setAttribute("icon", hass.states['sensor.ups_cyberpower_01_status'].state === 'COMMLOST' ? 'mdi:power-plug-off-outline' : hass.states['sensor.ups_cyberpower_01_status'].state === 'ONBATT' ? 'mdi:car-battery' : 'mdi:power-plug-battery' )}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: 'CyberPower UPS #2'
|
||
entity: sensor.ups_cyberpower_02_status
|
||
icon: mdi:power-plug-battery
|
||
show_state: true
|
||
show_attribute: true
|
||
tap_action:
|
||
action: more-info
|
||
button_action:
|
||
tap_action:
|
||
action: more-info
|
||
sub_button:
|
||
- name: Battery
|
||
entity: sensor.ups_cyberpower_02_battery_level
|
||
icon: mdi:battery
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Time Left
|
||
entity: sensor.ups_cyberpower_02_time_left
|
||
icon: mdi:timer
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Load
|
||
entity: sensor.ups_cyberpower_02_load_percentage
|
||
icon: mdi:battery-arrow-down
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Transfers
|
||
entity: sensor.ups_cyberpower_02_transfers
|
||
icon: mdi:sync
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'COMMLOST' ? 'rgb(255, 179, 179)' : '' } !important;
|
||
}
|
||
${icon.setAttribute("icon", hass.states['sensor.ups_cyberpower_02_status'].state === 'COMMLOST' ? 'mdi:power-plug-off-outline' : hass.states['sensor.ups_cyberpower_02_status'].state === 'ONBATT' ? 'mdi:car-battery' : 'mdi:power-plug-battery' )}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: 'CyberPower UPS #3'
|
||
entity: sensor.ups_cyberpower_03_status
|
||
icon: mdi:power-plug-battery
|
||
show_state: true
|
||
show_attribute: true
|
||
tap_action:
|
||
action: more-info
|
||
button_action:
|
||
tap_action:
|
||
action: more-info
|
||
sub_button:
|
||
- name: Battery
|
||
entity: sensor.ups_cyberpower_03_battery_level
|
||
icon: mdi:battery
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Time Left
|
||
entity: sensor.ups_cyberpower_03_time_left
|
||
icon: mdi:timer
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Load
|
||
entity: sensor.ups_cyberpower_03_load_percentage
|
||
icon: mdi:battery-arrow-down
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Transfers
|
||
entity: sensor.ups_cyberpower_03_transfers
|
||
icon: mdi:sync
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'COMMLOST' ? 'rgb(255, 179, 179)' : '' } !important;
|
||
}
|
||
${icon.setAttribute("icon", hass.states['sensor.ups_cyberpower_03_status'].state === 'COMMLOST' ? 'mdi:power-plug-off-outline' : hass.states['sensor.ups_cyberpower_03_status'].state === 'ONBATT' ? 'mdi:car-battery' : 'mdi:power-plug-battery' )}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: 'CyberPower UPS #4'
|
||
entity: sensor.ups_cyberpower_04_status
|
||
icon: mdi:power-plug-battery
|
||
show_state: true
|
||
show_attribute: true
|
||
tap_action:
|
||
action: more-info
|
||
button_action:
|
||
tap_action:
|
||
action: more-info
|
||
sub_button:
|
||
- name: Battery
|
||
entity: sensor.ups_cyberpower_04_battery_level
|
||
icon: mdi:battery
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Time Left
|
||
entity: sensor.ups_cyberpower_04_time_left
|
||
icon: mdi:timer
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Load
|
||
entity: sensor.ups_cyberpower_04_load_percentage
|
||
icon: mdi:battery-arrow-down
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
- name: Transfers
|
||
entity: sensor.ups_cyberpower_04_transfers
|
||
icon: mdi:sync
|
||
show_name: false
|
||
show_icon: true
|
||
show_state: true
|
||
show_background: false
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'COMMLOST' ? 'rgb(255, 179, 179)' : state === 'ONBATT' ? 'rgb(255, 221, 153)' : '' } !important;
|
||
}
|
||
${icon.setAttribute("icon", hass.states['sensor.ups_cyberpower_04_status'].state === 'COMMLOST' ? 'mdi:power-plug-off-outline' : hass.states['sensor.ups_cyberpower_04_status'].state === 'ONBATT' ? 'mdi:car-battery' : 'mdi:power-plug-battery' )}
|
||
|
||
- type: horizontal-stack
|
||
cards:
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
entity: sun.sun
|
||
card_layout: large-2-rows
|
||
grid_options:
|
||
columns: 6
|
||
rows: 3
|
||
show_attribute: false
|
||
show_name: true
|
||
show_icon: true
|
||
scrolling_effect: true
|
||
show_state: true
|
||
hold_action:
|
||
action: navigate
|
||
navigation_path: plan
|
||
button_action:
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: plan
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: plan
|
||
button_type: state
|
||
name: Family Room
|
||
icon: mdi:television
|
||
sub_button:
|
||
- entity: sun.sun
|
||
- entity: sun.sun
|
||
- entity: sun.sun
|
||
- entity: sun.sun
|
||
styles: |
|
||
:host{
|
||
--icon-Background-Color: #FF595E ;
|
||
--color-yellow: 255, 202, 58 ;
|
||
--color-blue: 25, 130, 196 ;
|
||
--color-green: 138, 201, 38 ;
|
||
--color-purple: 106, 76, 147 ;
|
||
}
|
||
|
||
.card-content {
|
||
width: 100%;
|
||
margin: 0 !important;
|
||
}
|
||
|
||
.bubble-button-card {
|
||
display: grid;
|
||
grid-template-areas:
|
||
'n n n b'
|
||
'l l l b'
|
||
'i i . b'
|
||
'i i . b';
|
||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||
grid-template-rows: 1.5fr 0.5fr 1fr 1fr;
|
||
justify-items: center;
|
||
}
|
||
|
||
.bubble-icon-container {
|
||
grid-area: i;
|
||
border-radius: 50% !important;
|
||
width: 150% !important;
|
||
height: 150% !important;
|
||
max-width: none !important;
|
||
max-height: none !important;
|
||
position: absolute !important;
|
||
place-self: center !important;
|
||
margin: 0px 0px 0px 0px !important;
|
||
padding: 0px, 0px, 0px, 0px !important;
|
||
background-color: var(--icon-Background-Color);
|
||
}
|
||
|
||
.bubble-icon {
|
||
width: 40%;
|
||
position: relative !important;
|
||
--mdc-icon-size: 100px !important;
|
||
opacity: 0.5 !important;
|
||
}
|
||
|
||
.bubble-name-container {
|
||
grid-area: n;
|
||
justify-self: start;
|
||
margin-left: 20px;
|
||
max-width: calc(100% -(12px + 0px));
|
||
}
|
||
|
||
.bubble-name {
|
||
font-weight: bold;
|
||
font-size: 16px;
|
||
}
|
||
|
||
.bubble-state {
|
||
font-weight: bold;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.large .bubble-sub-button-container {
|
||
grid-area: b;
|
||
display: flex !important;
|
||
flex-wrap: wrap;
|
||
flex-direction: column;
|
||
gap: calc((100% - 4 * 36px)/5) !important;
|
||
justify-content: flex-start;
|
||
width: auto !important;
|
||
right: 0px !important;
|
||
padding-right: 0px !important;
|
||
height: 100% !important;
|
||
top: calc((100% - 4 * 36px)/5) !important;
|
||
}
|
||
|
||
.large .bubble-button-card-container {
|
||
height: 210px !important;
|
||
}
|
||
|
||
.large .bubble-sub-button {
|
||
height: 36px !important;
|
||
}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
entity: sun.sun
|
||
card_layout: large-2-rows
|
||
grid_options:
|
||
columns: 6
|
||
rows: 3
|
||
show_attribute: false
|
||
show_name: true
|
||
show_icon: true
|
||
scrolling_effect: true
|
||
show_state: true
|
||
hold_action:
|
||
action: navigate
|
||
navigation_path: plan
|
||
button_action:
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: plan
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: plan
|
||
button_type: state
|
||
name: Family Room
|
||
icon: mdi:television
|
||
sub_button:
|
||
- entity: sun.sun
|
||
- entity: sun.sun
|
||
- entity: sun.sun
|
||
- entity: sun.sun
|
||
styles: |
|
||
:host{
|
||
--icon-Background-Color: #FF595E ;
|
||
--color-yellow: 255, 202, 58 ;
|
||
--color-blue: 25, 130, 196 ;
|
||
--color-green: 138, 201, 38 ;
|
||
--color-purple: 106, 76, 147 ;
|
||
}
|
||
|
||
.card-content {
|
||
width: 100%;
|
||
margin: 0 !important;
|
||
}
|
||
|
||
.bubble-button-card {
|
||
display: grid;
|
||
grid-template-areas:
|
||
'n n n b'
|
||
'l l l b'
|
||
'i i . b'
|
||
'i i . b';
|
||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||
grid-template-rows: 1.5fr 0.5fr 1fr 1fr;
|
||
justify-items: center;
|
||
}
|
||
|
||
.bubble-icon-container {
|
||
grid-area: i;
|
||
border-radius: 50% !important;
|
||
width: 150% !important;
|
||
height: 150% !important;
|
||
max-width: none !important;
|
||
max-height: none !important;
|
||
position: absolute !important;
|
||
place-self: center !important;
|
||
margin: 0px 0px 0px 0px !important;
|
||
padding: 0px, 0px, 0px, 0px !important;
|
||
background-color: var(--icon-Background-Color);
|
||
}
|
||
|
||
.bubble-icon {
|
||
width: 40%;
|
||
position: relative !important;
|
||
--mdc-icon-size: 100px !important;
|
||
opacity: 0.5 !important;
|
||
}
|
||
|
||
.bubble-name-container {
|
||
grid-area: n;
|
||
justify-self: start;
|
||
margin-left: 20px;
|
||
max-width: calc(100% -(12px + 0px));
|
||
}
|
||
|
||
.bubble-name {
|
||
font-weight: bold;
|
||
font-size: 16px;
|
||
}
|
||
|
||
.bubble-state {
|
||
font-weight: bold;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.large .bubble-sub-button-container {
|
||
grid-area: b;
|
||
display: flex !important;
|
||
flex-wrap: wrap;
|
||
flex-direction: column;
|
||
gap: calc((100% - 4 * 36px)/5) !important;
|
||
justify-content: flex-start;
|
||
width: auto !important;
|
||
right: 0px !important;
|
||
padding-right: 0px !important;
|
||
height: 100% !important;
|
||
top: calc((100% - 4 * 36px)/5) !important;
|
||
}
|
||
|
||
.large .bubble-button-card-container {
|
||
height: 210px !important;
|
||
overflow: hidden !important;
|
||
}
|
||
|
||
.large .bubble-sub-button {
|
||
height: 36px !important;
|
||
}
|
||
|
||
- type: custom:layout-break
|
||
- type: vertical-stack
|
||
cards:
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: Energy
|
||
entity: sensor.power_house_total_1mon
|
||
icon: mdi:transmission-tower
|
||
show_state: true
|
||
button_action:
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: '#energy'
|
||
sub_button:
|
||
- entity: sensor.power_house_total_1d
|
||
show_background: false
|
||
show_state: true
|
||
- entity: sensor.power_house_total_1mon
|
||
show_state: true
|
||
show_background: false
|
||
icon: mdi:calendar-week
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: Gas
|
||
entity: sensor.gas_monthly
|
||
icon: mdi:meter-gas
|
||
show_state: true
|
||
button_action:
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: '#gas'
|
||
sub_button:
|
||
- entity: sensor.gas_daily
|
||
show_background: false
|
||
show_state: true
|
||
- entity: sensor.gas_monthly
|
||
show_state: true
|
||
show_background: false
|
||
icon: mdi:calendar-week
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: state
|
||
card_layout: large-2-rows
|
||
name: Water
|
||
entity: sensor.water_monthly
|
||
icon: mdi:cup-water
|
||
show_state: true
|
||
button_action:
|
||
tap_action:
|
||
action: navigate
|
||
navigation_path: '#water'
|
||
sub_button:
|
||
- entity: sensor.water_daily
|
||
show_background: false
|
||
show_state: true
|
||
- entity: sensor.water_monthly
|
||
show_state: true
|
||
show_background: false
|
||
icon: mdi:calendar-week
|
||
|
||
# remote.living_room_harmony_hub
|
||
#
|
||
# activity_list: ShTV+AVR+TV, ShTV+AVR+Prj
|
||
# current_activity: ShTV+AVR+TV
|
||
# activity_starting: null
|
||
# devices_list: LG TV, Pioneer AV Receiver VSX-LX505, LG Projector, Nvidia Shield TV Pro 2019
|
||
# last_activity: ShTV+AVR+TV
|
||
# friendly_name: Living Room Harmony Hub
|
||
# supported_features: 4
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
entity: remote.living_room_harmony_hub
|
||
sub_button:
|
||
- name: TV
|
||
icon: mdi:television
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: select.select_option
|
||
data:
|
||
option: 'ShTV+AVR+TV'
|
||
- name: Projector
|
||
icon: mdi:projector
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: select.select_option
|
||
data:
|
||
option: 'ShTV+AVR+Prj'
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'on' ? 'var(--light-theme-disabled-color)' : 'var(--light-theme-disabled-color)' } !important;
|
||
}
|
||
/* .bubble-button-card-container { background-color: ${state === 'on' ? 'rgb(255, 150, 0)' : ''} !important; opacity: 1 !important; } */
|
||
.bubble-sub-button-1 {
|
||
background-color: white !important;
|
||
}
|
||
.bubble-sub-button-1 > ha-icon {
|
||
color: ${ hass.states['remote.living_room_harmony_hub'].attributes.current_activity === 'ShTV+AVR+TV' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
.bubble-sub-button-2 {
|
||
background-color: white !important;
|
||
}
|
||
.bubble-sub-button-2 > ha-icon {
|
||
color: ${ hass.states['remote.living_room_harmony_hub'].attributes.current_activity === 'ShTV+AVR+Prj' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
|
||
# source_list: Windows 11, PlayStation 4 Pro, Nvidia Shield TV, Unifi Protect, TV/Nothing, Sonos, ChromeCast/Network, Bluetooth
|
||
# volume_level: 1
|
||
# is_volume_muted: false
|
||
# source: PlayStation 4 Pro
|
||
# sound_mode: DOLBY ATMOS/DOLBY SURROUND ··· PLII/PLIIx MOVIE
|
||
# video_out: yes,out
|
||
# video_information:
|
||
# video_input_port: HDMI 2
|
||
# input_resolution: 4K(3840x2160) 59 Hz
|
||
# input_color_schema: RGB
|
||
# input_color_depth: 24bit
|
||
# output_resolution: 4K(3840x2160) 59 Hz
|
||
# output_color_schema: RGB
|
||
# output_color_depth: 24bit
|
||
# friendly_name: VSX-LX505
|
||
# supported_features: 69516
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: switch
|
||
card_layout: normal
|
||
name: Pioneer VSX-LX505
|
||
entity: media_player.onkyo_receiver
|
||
icon: mdi:audio-video
|
||
show_state: true
|
||
show_background: false
|
||
show_attribute: true
|
||
attribute: source
|
||
button_action:
|
||
tap_action:
|
||
action: toggle
|
||
sub_button:
|
||
- entity: script.receiver_switch_to_shield_tv
|
||
icon: mdi:television-classic
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
- entity: script.receiver_switch_to_playstation
|
||
icon: mdi:controller
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
- entity: script.receiver_switch_to_security
|
||
icon: mdi:camera-metering-matrix
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
- entity: script.receiver_switch_to_windows
|
||
icon: mdi:laptop
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'on' ? 'var(--light-theme-disabled-color)' : 'var(--light-theme-disabled-color)' } !important;
|
||
}
|
||
.bubble-sub-button-1 > ha-icon {
|
||
color: ${ hass.states['media_player.onkyo_receiver'].attributes.source === 'Nvidia Shield TV' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
.bubble-sub-button-2 > ha-icon {
|
||
color: ${ hass.states['media_player.onkyo_receiver'].attributes.source === 'PlayStation 4 Pro' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
.bubble-sub-button-3 > ha-icon {
|
||
color: ${ hass.states['media_player.onkyo_receiver'].attributes.source === 'Unifi Protect' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
.bubble-sub-button-4 > ha-icon {
|
||
color: ${ hass.states['media_player.onkyo_receiver'].attributes.source === 'Windows 11' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
|
||
# media_player.playstation_4_pro
|
||
#
|
||
# playing
|
||
#
|
||
# source_list: BATTLEFIELD 4, Battlefield™ 1, Call of Duty®: Modern Warfare® 2 Campaign Remastered, DIABLO III: REAPER OF SOULS – ULTIMATE EVIL EDITION, DiRT Rally, Fall Guys, Fortnite, Gran Turismo® 7, Gran Turismo™SPORT, Grand Theft Auto V (PS4™), Terraria: PS4™ Edition, XCOM® 2
|
||
# media_content_id: CUSA00419
|
||
# media_content_type: game
|
||
# media_title: Grand Theft Auto V (PS4™)
|
||
# source: Grand Theft Auto V (PS4™)
|
||
# entity_picture: /api/media_player_proxy/media_player.playstation_4_pro?token=007ca02b0380f3ac9c545f072bbc59c1d0630ff327babffc223e2ef6bf940f71&cache=5cf70801995f315e
|
||
# friendly_name: PlayStation 4 Pro
|
||
# supported_features: 6529
|
||
|
||
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
entity: media_player.nvidia_shield_tv_living_room_2
|
||
sub_button:
|
||
- entity: switch.android_tv_youtube
|
||
icon: mdi:youtube
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
- entity: switch.android_tv_netflix
|
||
icon: mdi:netflix
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
- entity: switch.android_tv_plex
|
||
icon: mdi:plex
|
||
show_background: true
|
||
show_state: false
|
||
tap_action:
|
||
action: toggle
|
||
styles: |
|
||
.bubble-button-background {
|
||
opacity: 1 !important;
|
||
background-color: ${ state === 'on' ? 'var(--light-theme-disabled-color)' : 'var(--light-theme-disabled-color)' } !important;
|
||
}
|
||
.bubble-sub-button-1 {
|
||
background-color: white !important;
|
||
}
|
||
.bubble-sub-button-1 > ha-icon {
|
||
color: ${ hass.states['media_player.nvidia_shield_tv_living_room_2'].attributes.app_id === 'com.google.android.youtube.tv,' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
.bubble-sub-button-2 {
|
||
background-color: white !important;
|
||
}
|
||
.bubble-sub-button-2 > ha-icon {
|
||
color: ${ hass.states['media_player.nvidia_shield_tv_living_room_2'].attributes.app_id === 'com.netflix.ninja' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
.bubble-sub-button-3 {
|
||
background-color: white !important;
|
||
}
|
||
.bubble-sub-button-3 > ha-icon {
|
||
color: ${ hass.states['media_player.nvidia_shield_tv_living_room_2'].attributes.app_id === 'com.plexapp.android' ? 'rgb(255, 152, 0)' : '' } !important;
|
||
}
|
||
|
||
- type: custom:bubble-card
|
||
card_type: climate
|
||
entity: climate.living_room
|
||
sub_button:
|
||
- name: HVAC modes menu
|
||
select_attribute: hvac_modes
|
||
show_arrow: false
|
||
state_background: false
|
||
|
||
|
||
- type: vertical-stack
|
||
cards:
|
||
- type: custom:bubble-card
|
||
card_type: pop-up
|
||
hash: '#kitchen'
|
||
name: Kitchen
|
||
icon: mdi:fridge
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: slider
|
||
name: Sink
|
||
entity: light.kitchen_sink_01
|
||
show_state: true
|
||
tap_action:
|
||
action: toggle
|
||
button_action:
|
||
tap_action:
|
||
action: toggle
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: slider
|
||
name: LED
|
||
entity: light.kitchen_led_01
|
||
show_state: true
|
||
tap_action:
|
||
action: toggle
|
||
button_action:
|
||
tap_action:
|
||
action: toggle
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: slider
|
||
name: 'Ceiling #1'
|
||
entity: light.kitchen_ceiling_01
|
||
show_state: true
|
||
tap_action:
|
||
action: toggle
|
||
button_action:
|
||
tap_action:
|
||
action: toggle
|
||
- type: custom:bubble-card
|
||
card_type: button
|
||
button_type: slider
|
||
name: 'Ceiling #2'
|
||
entity: light.kitchen_ceiling_02
|
||
show_state: true
|
||
tap_action:
|
||
action: toggle
|
||
button_action:
|
||
tap_action:
|
||
action: toggle
|