I had to make two scripts for setting temperature, after that it worked
increment_climate_temperature:
alias: increment_climate_temperature
sequence:
- service: climate.set_temperature
data_template:
entity_id: climate.vent_vsr500
temperature: '{{(state_attr(''climate.vent_vsr500'' , ''temperature'')|round(0))
+ 1 }}'
target:
entity_id: climate.vent_vsr500
mode: single
decrease_climate_temperature:
alias: decrease_climate_temperature
sequence:
- service: climate.set_temperature
data_template:
entity_id: climate.vent_vsr500
temperature: '{{(state_attr(''climate.vent_vsr500'' , ''temperature'')|round(0))
- 1 }}'
target:
entity_id: climate.vent_vsr500
mode: single
Those are the scripts that are called upon when hitting + or -
1 Like
Where I can I find icons to include notifications - like your basket?
Is there anyway to change the person card state name? It now says home or not_home but i want to translate it to dutch (Thuis or Afwezig).
rphlwnk
(Raphael)
December 2, 2021, 7:31pm
515
1 Like
rphlwnk
(Raphael)
December 2, 2021, 8:21pm
516
The state is read from the person object that was passed through the variables (label: "[[[ return states[variables.ulm_card_person_entity].state ]]]"
), so the home/away text is read from Home Assistant entity and that can only be changed in some system-files.
But it should be possible to map this to a custom variable, so it can be integrated in the language-file for custom naming, but that is up to @paddy0174
You could probably do a template sensor that translates the state of the person, and then call that state in the card instead?
Probably an easier way - but it’s what I’ve been doing whenever I need to change state of something
bms
(Bavo)
December 2, 2021, 9:34pm
518
@rphlwnk
You can always override the label with your own custom value by adding label: your own text
to the person card.
xator91
(Xator91)
December 3, 2021, 6:11am
520
How can i add this to my conf?
basbrus
(Bas)
December 3, 2021, 9:25am
521
I just made a custom card template to show the light colors in the icon and in the slider (if used).
By just adding the custom templates needed as stated on Changing template - UI-Lovelace-Minimalist you can accomplish the same result.
Light mode:
Dark mode:
card_light_slider_collapse_color:
template:
- ulm_language_variables
variables:
ulm_card_light_slider_collapse_name: "[[[ return entity.attributes.friendly_name ]]]"
show_icon: false
show_name: false
show_label: false
state:
- operator: template
value: "[[[ return entity.state == 'on' ]]]"
styles:
card:
- background-color: >
[[[
if (states['sun.sun'].state == "below_horizon"){
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',var(--opacity-bg))'
}
else{
return 'rgba(var(--color-yellow),var(--opacity-bg))'
}
}else if (states['sun.sun'].state == "above_horizon")
return 'rgba(var(--color-background-yellow),var(--opacity-bg))';
]]]
grid:
- row-gap: 12px
styles:
grid:
- grid-template-areas: '"item1" "item2"'
- grid-template-columns: 1fr
- grid-template-rows: min-content min-content
card:
- border-radius: var(--border-radius)
- box-shadow: var(--box-shadow)
- padding: 12px
custom_fields:
item1:
card:
type: 'custom:button-card'
template:
- icon_info
- color_slider
entity: "[[[ return entity.entity_id ]]]"
label: >-
[[[
if (entity.state !='unavailable'){
if (entity.state =='off'){
return variables.ulm_off;
} else if (entity.state == 'on'){
if (entity.attributes.brightness != null){
var bri = Math.round(entity.attributes.brightness / 2.55);
return (bri ? bri : '0') + '%';
} else {
return variables.ulm_on
}
}
} else {
return variables.ulm_unavailable;
}
]]]
name: "[[[ return variables.ulm_card_light_slider_collapse_name ]]]"
styles:
card:
- box-shadow: none
- border-radius: var(--border-radius) var(--border-radius) var(--border-radius) var(--border-radius)
- padding: 0px
item2:
card:
type: conditional
conditions:
- entity: "[[[ return entity.entity_id ]]]"
state: 'on'
card:
type: 'custom:my-slider'
entity: '[[[ return entity.entity_id ]]]'
radius: 14px
height: 42px
mainSliderColor: >
[[[
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',1)'
}
else{
return 'rgba(var(--color-yellow),1)'
}
]]]
secondarySliderColor: >
[[[
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',0.2)';
}
else{
return 'rgba(var(--color-yellow),0.2)';
}
]]]
mainSliderColorOff: rgba(var(--color-theme),0.05)
secondarySliderColorOff: rgba(var(--color-theme),0.05)
thumbHorizontalPadding: '0px'
thumbVerticalPadding: '0px'
thumbWidth: 0px
card_mod:
style: |
ha-card {
border-radius: 14px;
box-shadow: none;
}
color_slider:
state:
- styles:
icon:
- color: >
[[[
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',1)';
}
else{
return 'rgba(var(--color-yellow),1)';
}
]]]
label:
- color: >
[[[
if (states['sun.sun'].state == "below_horizon"){
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',1)'
}
else{
return 'rgba(var(--color-yellow-text),1)'
}
}else if (states['sun.sun'].state == "above_horizon")
return 'rgba(var(--color-yellow-text),1)';
]]]
name:
- color: >
[[[
if (states['sun.sun'].state == "below_horizon"){
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',1)'
}
else{
return 'rgba(var(--color-yellow-text),1)'
}
}else if (states['sun.sun'].state == "above_horizon")
return 'rgba(var(--color-yellow-text),1)';
]]]
img_cell:
- background-color: >
[[[
var color = entity.attributes.rgb_color;
if (color){
return 'rgba(' + entity.attributes.rgb_color + ',0.2)';
}
else{
return 'rgba(var(--color-yellow),0.2)';
}
]]]
card:
- background-color: 'rgba(0,0,0,0)'
value: 'on'
If don’t want to affect the slider color just change these parameters in the card_light_slider_collapse_color template to:
mainSliderColor: rgba(var(--color-yellow),1)
secondarySliderColor: rgba(var(--color-yellow),0.2)
5 Likes
sergio_pt
(Sergio_PT)
December 3, 2021, 10:42am
522
Hi all,
Just to share something I just found out.
The reason why icons in the chips appear as black and white in chrome is due to “bold” option.
From chips template:
styles:
label:
- justify-self: center
- padding: 0px 6px
- font-weight: bold
- font-size: 14px
You get:
If you comment out the bold:
styles:
label:
- justify-self: center
- padding: 0px 6px
#- font-weight: bold
- font-size: 14px
You get:
Hope I helped
4 Likes
mase
December 3, 2021, 10:42am
523
anyone knows if there is a buttoncard-template for this card?
would like to change it to use it for a room button like this:
arrow up: tap to turn on/off lights in that room
pause: open a popup card to control covers/blinds in that room
arrow down: popup card to controll the heater in the room.
also i´m having an isse with the Light Slider Card (collapse)
, when i add it to my lovelace.yaml it will stay empty and not load.
used it like this:
- type: 'custom:button-card'
template: card_light_slider_collapse
variables:
ulm_card_light_slider_collapse_name: Office
entity: light.office
1 Like
So I’ve been tinkering with the Cover card - to make a card that I can dim the lights with.
card_dim_kleskap:
variables:
ulm_card_cover_with_buttons_name: "n/a"
triggers_update:
- "[[[ variables.ulm_card_cover_with_buttons_entity ]]]"
styles:
grid:
- grid-template-areas: '"item1" "item2"'
- grid-template-columns: 1fr
- grid-template-rows: min-content min-content
- row-gap: 12px
card:
- border-radius: var(--border-radius)
- box-shadow: var(--box-shadow)
- padding: 12px
custom_fields:
item1:
card:
type: 'custom:button-card'
template:
- icon_info
- ulm_language_variables
- dimmer_with_buttons
tap_action:
action: more-info
entity: '[[[ return variables.ulm_card_cover_with_buttons_entity ]]]'
name: '[[[ return variables.ulm_card_cover_with_buttons_name ]]]'
item2:
card:
type: 'custom:button-card'
template: list_items
custom_fields:
item1:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: script.dim_ned_lys
icon: 'mdi:arrow-down'
item2:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: light.toggle
service_data:
entity_id: '[[[ return variables.ulm_card_cover_with_buttons_entity ]]]'
icon: 'mdi:power'
item3:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: script.dim_opp_kleskap
icon: 'mdi:arrow-up'
dimmer_with_buttons:
tap_action:
action: more-info
label: >-
[[[
if (entity.state !='unavailable'){
if (entity.state =='off'){
return variables.ulm_off;
} else if (entity.state == 'on'){
if (entity.attributes.brightness != null){
var bri = Math.round(entity.attributes.brightness / 2.55);
return (bri ? bri : '0') + '%';
} else {
return variables.ulm_on
}
}
} else {
return variables.ulm_unavailable;
}
]]]
state:
- operator: template
value: "[[[ return states[entity.entity_id].attributes.current_position != 0; ]]]"
styles:
icon:
- color: "rgba(var(--color-blue),1)"
img_cell:
- background-color: "rgba(var(--color-blue),0.2)"
I can’t figure out how I can make the background turn yellow when the light is on - like the regular buttons.
I tried adding the yellow template
card_dim_kleskap:
template:
- yellow
…..
But that did nothing.
1 Like
Br3b
(Br3b)
December 3, 2021, 6:14pm
525
Hey there, nice idea. Could you please share the yaml code for this card?
thanks /danke
rphlwnk
(Raphael)
December 3, 2021, 6:25pm
527
To get the background colorized you can use this state trigger:
state:
- operator: template
value: "[[[ return entity.state == 'on' ]]]"
styles:
card:
- background-color: 'rgba(var(--color-background-yellow),var(--opacity-bg))'
I tried adding it like this, but then the button just disappeared:
card_dim_kleskap:
variables:
ulm_card_cover_with_buttons_name: "n/a"
triggers_update:
- "[[[ variables.ulm_card_cover_with_buttons_entity ]]]"
state:
- operator: template
value: "[[[ return entity.state == 'on' ]]]"
styles:
card:
- background-color: 'rgba(var(--color-background-yellow),var(--opacity-bg))'
styles:
grid:
- grid-template-areas: '"item1" "item2"'
- grid-template-columns: 1fr
- grid-template-rows: min-content min-content
- row-gap: 12px
card:
- border-radius: var(--border-radius)
- box-shadow: var(--box-shadow)
- padding: 12px
custom_fields:
item1:
card:
type: 'custom:button-card'
template:
- icon_info
- ulm_language_variables
- dimmer_with_buttons
tap_action:
action: more-info
entity: '[[[ return variables.ulm_card_cover_with_buttons_entity ]]]'
name: '[[[ return variables.ulm_card_cover_with_buttons_name ]]]'
item2:
card:
type: 'custom:button-card'
template: list_items
custom_fields:
item1:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: script.dim_ned_lys
icon: 'mdi:arrow-down'
item2:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: light.toggle
service_data:
entity_id: '[[[ return variables.ulm_card_cover_with_buttons_entity ]]]'
icon: 'mdi:power'
item3:
card:
type: 'custom:button-card'
template: widget_icon
tap_action:
action: call-service
service: script.dim_opp_kleskap
icon: 'mdi:arrow-up'
state:
- operator: template
value: "[[[ variables.ulm_card_cover_with_buttons_entity == 'on' ]]]"
styles:
card:
- background-color: 'rgba(var(--color-background-yellow),var(--opacity-bg))'
This made the button show again - but no color change
bms
(Bavo)
December 3, 2021, 7:26pm
530
I think you will need to add some id’s to your states defined in the card. Check the Merge by id in the documentation.
I’m on my phone right now so I can’t investigate further. But I had the same symptoms as well, and it was due to the incorrect merging of the states.
Hope this helps
panhans
(Panhans)
December 3, 2021, 8:13pm
531
Hey, whats the magic to show the button vertically aligned like this? Didn’t found anything in the docs or here in this thread.
2 Likes
@panhans
Don’t know if this is the right way of doing it. But this is what I use:
- type:vertical-stack
cards:
- type: horizontal-stack
cards:
- type: "custom:button-card"
template: edge
- type: 'custom:button-card'
template: card_input_boolean
entity: input_boolean.guest_mode
- type: "custom:button-card"
template: edge
- type: 'custom:button-card'
template: card_input_boolean
entity: input_boolean.guest_mode
- type: "custom:button-card"
template: edge
- type: 'custom:button-card'
template: card_input_boolean
entity: input_boolean.guest_mode
- type: "custom:button-card"
template: edge
- type: 'custom:button-card'
template: card_input_boolean
entity: input_boolean.guest_mode
Hope it helps.
panhans
(Panhans)
December 3, 2021, 9:34pm
534
Thx, but I had no success.
And I have another issue: There are no states in my cards. For example the off-state is missing.
//EDIT: ok, I found a template called vertical_buttons. Seems this is the solution