you have to go here now https://github.com/custom-cards/slider-button-card
1 Like
Thanks for the info zigomatic. The warning was just so generic. Really happy to see that the slider-button-card is going to live on.
@ zigomatic
you have to go here now https://github.com/custom-cards/slider-button-card
iāve been there and what to do there, if i have it installed and the message persists?
i have the issue, that everytime i set the position, like on 70% - the slider jumps back to 0% and then back to 70%. is there any way to fix this?
thanks
Iāve been very happy using this card, but Iāve been unable to change the icon on/off color using action-icon-color-on and action-icon-color-off card-mod options. Hereās the configuration Iām using:
type: custom:slider-button-card
card_mod:
style: |
ha-card {
border: solid 1px var(--light-primary-color);
box-shadow: none;
color: var(--light-primary-color);
}
:host {
--action-icon-color-on: darkgreen;
--action-icon-color-off: crimson;
--state-color-on: darkgreen;
--state-color-off: crimson;
}
entity: light.fireplace_lights
show_state: true
slider:
direction: left-right
background: gradient
use_state_color: true
icon:
icon: mdi:light-flood-down
use_state_color: true
tap_action:
action: more-info
action_button:
mode: toggle
Iāve tried adding !important to the CSS as well, but that makes no difference. Interestingly enough the state-color-off and state-color-on options are working fine. Anybody have any ideas?
After reading some more here and on the repository page it seems you can set the icon color via the --icon-color, but not toggle it based on the state as that would require --icon-color-on and --icon-color-off directives. The best I could come up with is to set an action_button icon and toggle the color of that. Would prefer it to be off to the left instead, but will suffice for the time being. Hereās my new config:
type: custom:slider-button-card
card_mod:
style: |
ha-card {
border: solid 1px var(--light-primary-color);
box-shadow: none;
color: var(--light-primary-color);
}
:host {
--action-icon-color-on: darkgreen;
--action-icon-color-off: crimson;
--action-spinner-color: var(--light-primary-color);
--state-color-on: darkgreen;
--state-color-off: crimson;
}
entity: light.fireplace_lights
show_state: true
slider:
direction: left-right
background: gradient
use_state_color: true
icon:
show: false
action_button:
mode: custom
icon: mdi:light-flood-down
tap_action:
action: toggle
Does this card support templating for the action button icon?
Trying to chanhge it dynamically based on media playing, something like this:
action_button:
mode: custom
icon: >
{%- set sensor = states('media_player.living_room_display') %}
{%- if sensor == 'playing' %}mdi:pause
{%- elif sensor == 'paused' %}mdi:play
{%- endif %}
Hi all!
First of all, thank you for this great card, it looks fantastic in my Lovelace dashboard.
Iām currently running into an issue though. I have a couple slider buttons on top of eachother to control my lights. On my phone, they fill the entire width of the screen. I canāt scroll down, because when I touch the slider button, it adjusts the brightness immediately. Thereās no way to scroll the screen.
Any ideas on how to fix this?
1 Like
Also experiencing the following message.
Removed repository mattieha/slider-button-card
Abandoned, community fork maintained at custom-cards/slider-button-card
I installed the latest release via HACS module and rebooted. I keep the message itās not clear to me how to solve this. Ignore is not helping and remove is not a option 
Iāve tried this on a media player entity to select the volumee (I want to limit between 0% and 30%), but he result is very odd. It shows only the range selected by min/max, but allows me exceed the range and becomes quite sensitive, as if the selection was still on the 0-100% range.
Is this a bug or am I missing something?
@qoheleth, in case you didnāt find a solution to your height issue, I found a way to do it.
I just started experimenting with this slider card over the weekend and I used card_mod to fix the height because I have a really compact UI design. I had to reduce min-height in 2 places (card uses 7rem). The rest of what I did is just fixing the vertical positions of the text and toggle.
type: 'custom:slider-button-card'
entity: fan.master_ceiling_fan
name: Fan
show_state: false
card_mod:
style: |
:host ha-card {
min-height: 1rem;
}
:host .button {
min-height: 3.5rem;
padding: 0.5rem;
}
:host .text {
position: absolute;
left: 40px;
top: 50%;
bottom: unset;
transform: translateY(-50%);
}
:host .action {
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
height: 23px;
}
2 Likes
Thanks. That works nicely.
Yep, love this too because it looks so great but I have the same problem. What would be great if the slider responds only after a horizontal slide and not the first touch contact. Then a vertical slide could just be a scrollā¦
How do I show an attribute instead of / next to the state?
For example hvac_action for a climate entity?
Same thing happens to me.
Did you find a solution?
Very strangeā¦
Iām having a problem using this card. It doesnt show up when i have it installed with HACS
I have installed Mushroom, and that shows up as custom:Mushroomā¦ but this doesnt seem to show up, and when i try to change the type manually to type: custom:Slider-button-card it says its not valid. any ideas?
Iām running
Home Assistant 2022.11.1
Supervisor 2022.10.2
Operating System 9.3
Frontend 20221102.1 - latest
Anybody knows how solve this and see always current cover % position?
Hallo, thank you for this beautiful card,
is there a chance please to have more buttons for covers/curtains (inside or somewhere on the side) of the slider button?
(more like the original cover entitiy, what shows āupā, āstopā and ādownā buttons, but with the sliding option for the position, what is really great).
The problem is, that during the movement I cant stop the cover, since the ātoggleā option continues to go in the running direction (e.g. down) until the final position (e.g. bottom) is reached.
it would be great then! 
thank you
Willy
you proably dont have the position reported by the cover?
Where can i change it?