Encje zdefiniowane jako grupy, kod dodany jako odznaki.
karta mushroom
, wymagany browser_mod.popup

Okna:
type: custom:mushroom-chips-card
chips:
- type: template
icon: mdi:window-open
entity: group.all_windows
icon_color: blue
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Otwarte Okna
content:
type: custom:auto-entities
filter:
include:
- group: group.all_windows
state: "on"
options:
type: custom:mushroom-light-card
show_brightness_control: true
layout: horizontal
tap_action:
action: toggle
use_light_color: true
- entity_id: group.all_windows
state: "on"
options:
type: custom:mushroom-light-card
layout: horizontal
secondary_info: none
tap_action:
action: toggle
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-state-light), 0.1);
}
:host {
margin: 0px 0px 12px !important;
}
exclude: []
card:
type: custom:layout-card
cards: []
layout_type: masonry
sort:
method: friendly_name
card_mod:
style: |
.content {
margin: -12px -10px -4px -16px !important;
--ha-card-border-width: 0;
--ha-card-background: none;
--ha-card-box-shadow: 0;
--masonry-view-card-margin: -12px 0px 0px 0px;
}
card_mod:
style: |
ha-card:after {
{% set lights_on = (expand(states.group.all_windows) | selectattr('state', 'eq', 'on') | list | count) %}
{% if lights_on > 0 %}
content: "{{ lights_on }}";
{% endif %}
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-amber));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: -5px;
right: -5px;
width: 16px;
height: 16px;
font-size: 11px;
}
.content {
{% if lights_on > 0 %}
animation: boing 3s ease infinite;
{% endif %}
transform-origin: 50% 90%;
}
@keyframes boing {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}
Oświetlenie:
type: custom:mushroom-chips-card
chips:
- type: template
icon: mdi:lightbulb
entity: group.all_lights
icon_color: amber
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Włączone Swiatła
content:
type: custom:auto-entities
filter:
include:
- group: group.all_lights
state: "on"
options:
type: custom:mushroom-light-card
show_brightness_control: true
layout: horizontal
tap_action:
action: toggle
use_light_color: true
- entity_id: group.all_lights
state: "on"
options:
type: custom:mushroom-light-card
layout: horizontal
secondary_info: none
tap_action:
action: toggle
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-state-light), 0.1);
}
:host {
margin: 0px 0px 12px !important;
}
exclude: []
card:
type: custom:layout-card
cards: []
layout_type: masonry
sort:
method: friendly_name
card_mod:
style: |
.content {
margin: -12px -10px -4px -16px !important;
--ha-card-border-width: 0;
--ha-card-background: none;
--ha-card-box-shadow: 0;
--masonry-view-card-margin: -12px 0px 0px 0px;
}
card_mod:
style: |
ha-card:after {
{% set lights_on = (expand(states.group.all_lights) | selectattr('state', 'eq', 'on') | list | count) %}
{% if lights_on > 0 %}
content: "{{ lights_on }}";
{% endif %}
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-amber));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: -5px;
right: -5px;
width: 16px;
height: 16px;
font-size: 11px;
}
.content {
{% if lights_on > 0 %}
animation: boing 3s ease infinite;
{% endif %}
transform-origin: 50% 90%;
}
@keyframes boing {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}
layout: vertical
fill_container: true
Wentylatory:
type: custom:mushroom-chips-card
chips:
- type: template
icon: mdi:fan
entity: group.wszystkie_wentylatory
icon_color: white
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
style: |
--popup-border-width: 10px;
--popup-border-radius: 12px;
--dialog-backdrop-filter: blur(0.8em) brightness(1.2);
title: Włączone Wentylatory
content:
type: custom:auto-entities
filter:
include:
- group: group.wszystkie_wentylatory
state: "on"
options:
type: custom:mushroom-fan-card
show_brightness_control: false
layout: horizontal
tap_action:
action: toggle
use_light_color: true
- entity_id: group.wszystkie_wentylatory
state: "on"
options:
type: custom:mushroom-fan-card
layout: horizontal
secondary_info: none
tap_action:
action: toggle
card_mod:
style: |
ha-card {
background: rgba(var(--rgb-state-light), 0.1);
}
:host {
margin: 0px 0px 12px !important;
}
exclude: []
card:
type: custom:layout-card
cards: []
layout_type: masonry
sort:
method: friendly_name
card_mod:
style: |
.content {
margin: -12px -10px -4px -16px !important;
--ha-card-border-width: 0;
--ha-card-background: none;
--ha-card-box-shadow: 0;
--masonry-view-card-margin: -12px 0px 0px 0px;
}
card_mod:
style: |
ha-card:after {
{% set fan_on = (expand(states.group.wszystkie_wentylatory) | selectattr('state', 'eq', 'on') | list | count) %}
{% if fan_on > 0 %}
content: "{{ fan_on }}";
{% endif %}
position: absolute;
display: flex;
justify-content: center;
align-items: center;
background: rgb(var(--rgb-amber));
color: var(--card-background-color);
font-weight: bolder;
border-radius: 50%;
top: -5px;
right: -5px;
width: 16px;
height: 16px;
font-size: 11px;
}
.content {
{% if fan_on > 0 %}
animation: spin 1s linear infinite;
{% endif %}
transform-origin: 50% 50%;
}
@keyframes rotation {
0% { transform: scale3d(1, 1, 1); }
7% { transform: scale3d(1.25, 0.75, 1); }
10% { transform: scale3d(0.75, 1.25, 1); }
12% { transform: scale3d(1.15, 0.85, 1); }
16% { transform: scale3d(0.95, 1.05, 1); }
19% { transform: scale3d(1.05, 0.95, 1); }
25% { transform: scale3d(1, 1, 1); }
}