thomasloven / lovelace-card-mod

🔹 Add CSS styles to (almost) any lovelace card
MIT License
1.08k stars 168 forks source link

HELP PLEASE - Custom: Stack-in-card #211

Closed almighty059 closed 1 year ago

almighty059 commented 2 years ago

Home Assistant 2022.7.2 Supervisor 2022.07.0 Operating System 8.2 Frontend 20220707.0 - latest

@thomasloven I apologize for opening an issue but I'm stuck on this and would like to see if I ran into a limitation of lovelace-card-mod and custom:stack-in-card by RomRider or if I'm just doing something wrong. I have a conditional card with a horizontal-stack card inside of it for when the condition is true. Inside of that, I have four custom:stack-in-cards set to mode: vertical with each stack sharing the same set of individual cards to control four different covers. One of the cards within those individual vertical stack-in-cards is another custom:stack-in-card but this one is set to horizontal and has a custom:text-element card and a custom:button-card.

I am attempting to change the styles of both of those cards but can't. I've used the Element Panel to see what controls them and the card-mod-helper but I'm doing something wrong. I can change everything by using the Element Panel so I know I have that part correct but I don't know how to interpret that into the correct style for Lovelace. I've tried setting up the style in almost every way I know but nothing, There is a "keep" feature as part of the stack-in-card which I'm wondering if it's somehow affecting the ability to style it but according to the documentation I think card-mod overrides it.

I tried the community but could not find any help and would appreciate any help that you can provide. Thank you.

ildar170975 commented 2 years ago

... and no code is provided ...

P.S. please do not post a full code. Just a small MWE which shows the issue.

almighty059 commented 1 year ago

@ildar170975 I had this issue a while ago and I moved on to something else. I just went back and looked and I remember that this was part of it. The other part was the same but instead of styling custom:text-element I was trying to a custom:button-card. I've also tried to make it a hui-element and style it within that but I just can't find the right code to do it.

The code below is without my attempts and I think the way I had it prior to adding it to the stack-in card.

type: custom:stack-in-card
title: []
mode: vertical
cards:

I deleted the code that was right here in the vertical stack because it doesn't apply. The issue is only the card below. I only put the above so that you could see what it's inside of.

  - type: custom:stack-in-card
    title: []
    mode: horizontal
    cards:
      - type: custom:text-element
        text: Timer Off/On
        style:
          font-size: 16px
          font-weight: 400
          min-width: min-content;
          min-height: min-content;

Here is a screenshot of the styling element that I am trying to change. I get lost trying to find the right syntax to style as the code goes further inside of other code.

Screenshot 2022-08-19 184818

ildar170975 commented 1 year ago

Now I see that this is neither a bug nor a FR. It is a question. So I suggest to post this question in the dedicated community card-mod thread and leave Github for bugs and FRs.