Mushroom light card card_mod | Home Assistant | Page 1

hoary current Sep 4, 2024, 8:29 AM

#

Initially, I had a message typed out saying this was probably not going to be an easy thing to do. I inspected the card, but I don't know much about CSS and did not think it was doable. But, before I sent the message, I decided to consult the almighty Google to see what I could find. I came across this Reddit post: card-mod mushroom-card combined text & slider how?
I took what was there and adapted it into the following, but you may have to inspect yours to get the right numbers. This is what worked for me.

#

type: custom:mushroom-light-card
entity: light.living_room_lights
name: Playroom
icon: mdi:power
icon_color: '#48CFCB'
primary_info: name
secondary_info: none
fill_container: true
show_brightness_control: true
layout: horizontal
collapsible_controls: false
card_mod:
  style:
    .: |
      div.actions {
        margin-left: -75%;
      }
      mushroom-state-info {
        text-align: center;
        width: 402px;
        // width: 120% also seems to work well; it gave me 404px while the slider was 402px
      }
       mushroom-slider {
        --main-color:  #006B61;
        --slider-color: #007C71;
      }
      ha-card {
        --card-primary-font-size: 16px;
      }
```EDIT: Forgot your original slider snippet.

solemn stag Sep 4, 2024, 1:35 PM

#

Holy crap.... Of all the things to google. How did I not find it.

#

Thank you

hoary current Sep 4, 2024, 1:54 PM

#

Maybe it was just the right combination of keywords. I searched for "mushroom light card name in slider". Reddit was the first result with the one that I linked to as the third option.

solemn stag Sep 4, 2024, 1:55 PM

#

There is one thing that itsn't quite working right.. and its probably how i have the card stacked. but when i turn the light on.. the word playroom is gone when the dimmer is max. actually that could just be the font color thing.
but on its own card its what i am looking for.. so now its a matter of manipulating.

#

but totally appreciate it

hoary current Sep 5, 2024, 1:09 AM

#

I didn't see your message earlier. I actually just noticed the same on the Companion App for Android and came to say the same thing. I'll play with it some more this evening. It will probably just a matter of applying a z-index to each and opacity to the slider so the text can show through. It will affect your colors though.

#Mushroom light card card_mod