home_automation/ha-dashboards
2
0
Fork 0
Code Issues 2 Pull Requests Projects Activity

Switch some button cards on mobile dashboard to decluttering cards

Browse Source
This commit is contained in:
Tony Stork
2024-11-09 15:32:49 -05:00
parent c2eb1e413e
commit f1189f6f15
1 changed files with 106 additions and 229 deletions
Download Patch File Download Diff File Expand all files Collapse all files

335
mobile_dashboard.yaml
View File

@ -31,7 +31,7 @@ decluttering_templates:
} }
.bubble-button-background { .bubble-button-background {
opacity: 1 !important; opacity: 1 !important;
background-color: ${state === 'on' ? 'var(--error-color)' : 'var(--background-color-2)'} !important; background-color: ${state === 'on' ? 'var(--error-color)' : 'var(--card-background-color)'} !important;
transition: background-color 1s !important; transition: background-color 1s !important;
} }
.bubble-icon-container { .bubble-icon-container {
@ -72,6 +72,11 @@ decluttering_templates:
navigation_path: '[[navigation_path]]' navigation_path: '[[navigation_path]]'
card_layout: large card_layout: large
columns: '[[columns]]' columns: '[[columns]]'
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
main_button_floors: main_button_floors:
defaults: defaults:
name: '' name: ''
@ -386,107 +391,46 @@ views:
heading: Housewide heading: Housewide
heading_style: title heading_style: title
icon: mdi:home-analytics icon: mdi:home-analytics
- type: custom:bubble-card - type: custom:decluttering-card
card_type: button template: main_button_state_red
button_type: state variables:
entity: binary_sensor.security_faults - name: Security
name: Security - entity: binary_sensor.security_faults
tap_action: - navigation_path: '#security'
action: navigate - columns: 2
navigation_path: '#security' grid_options:
double_tap_action: columns: 6
action: none rows: auto
hold_action: - type: custom:decluttering-card
action: more-info template: main_button_name
button_action: variables:
tap_action: - name: Global Scenes
action: navigate - icon: mdi:home-lightbulb-outline
navigation_path: '#security' - navigation_path: '#global-scenes'
double_tap_action: - columns: 2
action: none grid_options:
styles: |- columns: 6
.is-unavailable { rows: auto
opacity: 0.5 !important; - type: custom:decluttering-card
} template: main_button_name
.bubble-button-background { variables:
opacity: 1 !important; - name: Briefings
background-color: ${state === 'on' ? 'var(--error-color)' : 'var(--card-background-color)'} !important; - icon: mdi:text
transition: background-color 1s !important; - navigation_path: '#briefings'
} - columns: 2
.bubble-icon-container { grid_options:
background: ${state === 'on' ? 'var(--error-color)' : 'var(--card-background-color)'} !important; columns: 6
} rows: auto
.bubble-icon-container::after { - type: custom:decluttering-card
opacity: ${state === 'on' ? 0.3 : 0} !important; template: main_button_name
transition: all 1s !important; variables:
} - name: Batteries
.bubble-icon { - icon: mdi:battery-charging
display: flex !important; - navigation_path: '#batteries'
opacity: 0.5 !important; - columns: 2
} grid_options:
.is-on .bubble-icon { columns: 6
opacity: 1 !important; rows: auto
}
show_state: false
columns: 2
card_layout: large
- type: custom:bubble-card
card_type: button
button_type: name
name: Global Scenes
icon: mdi:home-lightbulb-outline
columns: 2
card_layout: large
tap_action:
action: navigate
navigation_path: '#global-scenes'
button_action:
tap_action:
action: navigate
navigation_path: '#global-scenes'
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: custom:bubble-card
card_type: button
button_type: name
name: Briefings
icon: mdi:text
columns: 2
card_layout: large
tap_action:
action: navigate
navigation_path: '#briefings'
button_action:
tap_action:
action: navigate
navigation_path: '#briefings'
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: custom:bubble-card
card_type: button
button_type: name
name: Batteries
icon: mdi:battery-charging
tap_action:
action: navigate
navigation_path: '#batteries'
button_action:
tap_action:
action: navigate
navigation_path: '#batteries'
card_layout: large
columns: 2
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: custom:bubble-card - type: custom:bubble-card
card_type: button card_type: button
button_type: name button_type: name
@ -553,144 +497,77 @@ views:
.is-on .bubble-icon { .is-on .bubble-icon {
opacity: 1 !important; opacity: 1 !important;
} }
- type: custom:bubble-card - type: custom:decluttering-card
card_type: button template: main_button_name
button_type: name variables:
name: Messaging - name: Messaging
icon: mdi:bullhorn - icon: mdi:bullhorn
columns: 2 - navigation_path: '#messaging'
card_layout: large - columns: 2
tap_action: grid_options:
action: navigate columns: 6
navigation_path: '#messaging' rows: auto
button_action: - type: custom:decluttering-card
tap_action: template: main_button_name
action: navigate variables:
navigation_path: '#messaging' - name: Temp Graphs
styles: |- - icon: mdi:chart-areaspline
.bubble-button-background { - navigation_path: '#roomtemps'
opacity: 1 !important; - columns: 2
background-color: var(--card-background-color) !important; grid_options:
} columns: 6
- type: custom:bubble-card rows: auto
card_type: button - type: custom:decluttering-card
button_type: name template: main_button_name
name: Temp Graphs variables:
tap_action: - name: Light Graphs
action: navigate - icon: mdi:chart-areaspline
navigation_path: '#roomtemps' - navigation_path: '#roomlux'
double_tap_action: - columns: 2
action: none grid_options:
hold_action: columns: 6
action: more-info rows: auto
button_action: - type: custom:decluttering-card
tap_action: template: main_button_name
action: navigate variables:
navigation_path: '#roomtemps' - name: Running
double_tap_action: - icon: mdi:database-clock
action: none - navigation_path: '#running'
show_state: false - columns: 4
columns: 2 grid_options:
card_layout: large columns: 12
icon: mdi:chart-areaspline rows: auto
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: custom:bubble-card
card_type: button
button_type: name
name: Light Graphs
tap_action:
action: navigate
navigation_path: '#roomlux'
double_tap_action:
action: none
hold_action:
action: more-info
button_action:
tap_action:
action: navigate
navigation_path: '#roomlux'
double_tap_action:
action: none
show_state: false
columns: 2
card_layout: large
icon: mdi:chart-areaspline
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: custom:bubble-card
card_type: button
button_type: name
name: Running
icon: mdi:database-clock
card_layout: large
columns: 4
visibility: visibility:
- condition: user - condition: user
users: users:
- c3909d27048140729f002aaef0391775 - c3909d27048140729f002aaef0391775
button_action: - type: custom:decluttering-card
tap_action: template: main_button_name
action: navigate variables:
navigation_path: '#running' - name: Go to Main Dashboard
tap_action: - icon: mdi:navigation-variant
action: navigate - navigation_path: /lovelace/default_view
navigation_path: '#running' - columns: 4
styles: |- grid_options:
.bubble-button-background { columns: 12
opacity: 1 !important; rows: auto
background-color: var(--card-background-color) !important;
}
- type: custom:bubble-card
card_type: button
button_type: name
name: Go to Main Dashboard
icon: mdi:navigation-variant
tap_action:
action: navigate
navigation_path: /lovelace/default_view
button_action:
tap_action:
action: navigate
navigation_path: /lovelace/default_view
card_layout: large
visibility: visibility:
- condition: screen - condition: screen
media_query: '(min-width: 0px) and (max-width: 767px)' media_query: '(min-width: 0px) and (max-width: 767px)'
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: heading - type: heading
heading: Outside Info heading: Outside Info
heading_style: title heading_style: title
icon: mdi:chart-areaspline icon: mdi:chart-areaspline
- type: custom:bubble-card - type: custom:decluttering-card
card_type: button template: main_button_name
button_type: name variables:
name: Gas Prices - name: Gas Prices
icon: mdi:gas-station - icon: mdi:gas-station
columns: 2 - navigation_path: '#gas-prices'
card_layout: large - columns: 2
tap_action: grid_options:
action: navigate columns: 6
navigation_path: '#gas-prices' rows: auto
button_action:
tap_action:
action: navigate
navigation_path: '#gas-prices'
styles: |-
.bubble-button-background {
opacity: 1 !important;
background-color: var(--card-background-color) !important;
}
- type: grid - type: grid
cards: cards:
- type: heading - type: heading