|
|
|
|
@ -110,163 +110,3 @@
|
|
|
|
|
--ha-card-box-shadow: 0px;
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
[Ссылка на источник](https://community.home-assistant.io/t/mushroom-cards-build-a-beautiful-dashboard-easily-part-1/388590/2691)
|
|
|
|
|
## Pop-Up включенный свет
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Общий код с карточкой и поп-апом:
|
|
|
|
|
|
|
|
|
|
??? tip
|
|
|
|
|
|
|
|
|
|
```yaml
|
|
|
|
|
type: grid
|
|
|
|
|
cards:
|
|
|
|
|
- type: heading
|
|
|
|
|
heading: Новый раздел
|
|
|
|
|
- type: vertical-stack
|
|
|
|
|
cards:
|
|
|
|
|
- type: custom:bubble-card
|
|
|
|
|
card_type: pop-up
|
|
|
|
|
hash: "#test"
|
|
|
|
|
- type: custom:mushroom-title-card
|
|
|
|
|
title: "Включенный свет:"
|
|
|
|
|
- type: entity-filter
|
|
|
|
|
entities:
|
|
|
|
|
- light.light_1
|
|
|
|
|
- light.rozetka_11
|
|
|
|
|
- light.light_dim_21
|
|
|
|
|
state_filter:
|
|
|
|
|
- "on"
|
|
|
|
|
- type: custom:mushroom-template-card
|
|
|
|
|
primary: ""
|
|
|
|
|
secondary: >-
|
|
|
|
|
|
|
|
|
|
{{expand(state_attr('light.1_light_all', 'entity_id')) |
|
|
|
|
|
selectattr('state','eq','on') | list | count }}
|
|
|
|
|
icon: mdi:town-hall
|
|
|
|
|
tap_action:
|
|
|
|
|
action: navigate
|
|
|
|
|
navigation_path: "#test"
|
|
|
|
|
icon_color: |-
|
|
|
|
|
{% if is_state('light.1_light_all', 'on') %}
|
|
|
|
|
orange
|
|
|
|
|
{% endif %}
|
|
|
|
|
grid_options:
|
|
|
|
|
columns: 3
|
|
|
|
|
rows: 1
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
Требуется создать группу на свет и после заменить `1_light_all` на свое название группы
|
|
|
|
|
|
|
|
|
|
[Ссылка на источник](https://community.home-assistant.io/t/mushroom-cards-build-a-beautiful-dashboard-easily-part-1/388590/1990)
|
|
|
|
|
|
|
|
|
|
## Климатическая карточка
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
??? tip
|
|
|
|
|
|
|
|
|
|
```yaml
|
|
|
|
|
type: custom:stack-in-card
|
|
|
|
|
cards:
|
|
|
|
|
- type: custom:mushroom-climate-card
|
|
|
|
|
entity: climate.thermostat_sejour
|
|
|
|
|
hvac_modes:
|
|
|
|
|
- heat
|
|
|
|
|
- auto
|
|
|
|
|
- fan_only
|
|
|
|
|
show_temperature_control: true
|
|
|
|
|
layout: horizontal
|
|
|
|
|
name: Climat
|
|
|
|
|
icon: mdi:thermometer-auto
|
|
|
|
|
double_tap_action:
|
|
|
|
|
action: more-info
|
|
|
|
|
- type: custom:stack-in-card
|
|
|
|
|
cards:
|
|
|
|
|
- type: grid
|
|
|
|
|
square: false
|
|
|
|
|
columns: 2
|
|
|
|
|
cards:
|
|
|
|
|
- type: custom:mushroom-entity-card
|
|
|
|
|
entity: sensor.sonde_salon_temp
|
|
|
|
|
primary_info: state
|
|
|
|
|
secondary_info: name
|
|
|
|
|
name: Temperature
|
|
|
|
|
icon_color: green
|
|
|
|
|
- type: custom:mushroom-entity-card
|
|
|
|
|
entity: sensor.sonde_salon_hum
|
|
|
|
|
primary_info: state
|
|
|
|
|
secondary_info: name
|
|
|
|
|
name: Humidity
|
|
|
|
|
icon: mdi:water-percent
|
|
|
|
|
icon_color: blue
|
|
|
|
|
- type: custom:mini-graph-card
|
|
|
|
|
entities:
|
|
|
|
|
- entity: sensor.sonde_salon_temp
|
|
|
|
|
name: Temperature
|
|
|
|
|
color: green
|
|
|
|
|
- entity: sensor.sonde_salon_hum
|
|
|
|
|
name: Humidity
|
|
|
|
|
color: '#2196f3'
|
|
|
|
|
y_axis: secondary
|
|
|
|
|
hours_to_show: 24
|
|
|
|
|
points_per_hour: 2
|
|
|
|
|
line_width: 3
|
|
|
|
|
font_size: 50
|
|
|
|
|
animate: true
|
|
|
|
|
show:
|
|
|
|
|
name: false
|
|
|
|
|
icon: false
|
|
|
|
|
labels: true
|
|
|
|
|
state: false
|
|
|
|
|
legend: false
|
|
|
|
|
fill: fade
|
|
|
|
|
card_mod:
|
|
|
|
|
style: |
|
|
|
|
|
mushroom-shape-icon {
|
|
|
|
|
{% if is_state(config.entity, 'heat_cool') %}
|
|
|
|
|
--card-mod-icon: mdi:autorenew;
|
|
|
|
|
animation: spin 3s ease-in-out infinite alternate;
|
|
|
|
|
{% elif is_state(config.entity, 'heat') %}
|
|
|
|
|
--card-mod-icon: mdi:fire;
|
|
|
|
|
animation: heat 2s infinite;
|
|
|
|
|
{% elif is_state(config.entity, 'cool') %}
|
|
|
|
|
--card-mod-icon: mdi:snowflake;
|
|
|
|
|
animation: cool 6s ease-in-out infinite;
|
|
|
|
|
{% elif is_state(config.entity, 'dry') %}
|
|
|
|
|
--card-mod-icon: mdi:water-percent;
|
|
|
|
|
animation: dry 1.5s linear infinite;
|
|
|
|
|
{% elif is_state(config.entity, 'fan_only') %}
|
|
|
|
|
--card-mod-icon: mdi:fan;
|
|
|
|
|
animation: spin 1s linear infinite;
|
|
|
|
|
{% else %}
|
|
|
|
|
--card-mod-icon: mdi:air-conditioner;
|
|
|
|
|
{% endif %}
|
|
|
|
|
display: flex;
|
|
|
|
|
}
|
|
|
|
|
@keyframes cool {
|
|
|
|
|
0%, 100% { transform: rotate(25deg); }
|
|
|
|
|
25% { transform: rotate(-25deg); }
|
|
|
|
|
50% { transform: rotate(50deg); }
|
|
|
|
|
75% { transform: rotate(-50deg); }
|
|
|
|
|
}
|
|
|
|
|
@keyframes heat {
|
|
|
|
|
0%, 100% { --icon-color: rgba(var(--rgb-red), 1); }
|
|
|
|
|
10%, 90% { --icon-color: rgba(var(--rgb-red), 0.8); }
|
|
|
|
|
20%, 80% { --icon-color: rgba(var(--rgb-red), 0.6); }
|
|
|
|
|
30%, 70% { --icon-color: rgba(var(--rgb-red), 0.4); }
|
|
|
|
|
40%, 60% { --icon-color: rgba(var(--rgb-red), 0.2); }
|
|
|
|
|
50% { --icon-color: rgba(var(--rgb-red), 0); }
|
|
|
|
|
}
|
|
|
|
|
@keyframes dry {
|
|
|
|
|
0%, 100% { --icon-symbol-size: 21px; }
|
|
|
|
|
10%, 90% { --icon-symbol-size: 22px; }
|
|
|
|
|
20%, 80% { --icon-symbol-size: 23px; }
|
|
|
|
|
30%, 70% { --icon-symbol-size: 24px; }
|
|
|
|
|
40%, 60% { --icon-symbol-size: 25px; }
|
|
|
|
|
50% { --icon-symbol-size: 26px; }
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
[Ссылка на источник]()
|
|
|
|
|
|
|
|
|
|
|