This is probably not card-mod related but is it possible to use an node anchor and override/merge some values of the anchor or pass a variable to the anchor?
Thereās one feature Iāve been missing since custom-header was deprecated. I would like to change the lovelace tab icons depending on a jinja template. I have spent hours looking for a code sample and trying to achieve it myself, but with no luck. Is it possible with card-mod themes? Has anyone done it and can share a code snippet? Thanks!
Does anyone know how to remove the margin from #root within a grid layout? Iāve tried injecting card-mod in multiple areas/ways and I canāt seem to target this.
Iām getting 4px left/right which isnāt particularly noticeable on desktop but when shrunk to mobile it is.
Hey guys, I made a site to help with card-mod selectors, mainly for themes but can be used to understand the structure of cards too https://matt8707.github.io/card-mod-helper/
For now I changed the padding only. I notice is half works. The styles only show it when I change tabs and then go back to the tab where the grid-card is. So on opening the tab for the first time there is no change, than opening a different tab and going back shows the style from theme. Am I doing something wrong or is this a card_mod bug?
Iām trying to hide the header after Kiosk mode no longer works on my older generation ipad on 2021.6. Seems pretty straightforward, but cannot get it to work. I added this to my theme:
NOTE: card-mod only works on cards that contain a ha-card element. This includes almost every card which can be seen, but not e.g. conditional, entity_filter, vertical-stack, horizontal-stack, grid.
From what I can tell, this should be working: card-mod-view-yaml styles inside of hui-view grid-layout$ styles inside of the grid-layoutshadow-root hui-grid-card goes into the hui-grid-card $: goes into the first shadow-root h1 applies the style to the h1 tag
Clearly though this isnāt working as you can see that āOfficeā below has left padding, normal font-weight and is not red. The card-header class is applied by the layout-card, however my styles arenāt even being applied, let alone being overridden (which shouldnāt matter due to !important)
I used that once and got the exact code line which worked moddig titles of a grid card (tho it had some other issues) the code itself was proven correct.
Interestingly though, Iām actually modifying @Mattias_Persson theme and having the issue. Perhaps Iāve misunderstood how the themeing works, but if I do this instead, it works:
The actual grid-layout element is the same, the only difference is the configuration above it, and its not nested so im unsure as to why this would make it work
I try to apply some custom style to the title area of a (entities) card. Unfortunately this isnĀ“t working, all style changes are āonlyā applied to the card below the title area.
Read the docs and follow the code. Itās explained there why you need mod_card (which is part of card_mod, but for advanced usages like styling cards without ha-element, like grid, vertical etc). And how to use the code line.
Sidenote: this is meant to style individual cards, not entire themes. So getting kina off-topic since this thread is for card mod for themes. I suggest moving over to this topic if you need more help with styling cards outside of themes: š¹ Card-mod - Add css styles to any lovelace card
Thanks, I know this custom card and already use it. But as stated it indeed ...and likely to bring more problems than it solves.
That whole CSS hacking is just quite complicated and I was really looking forward to find some plug n play solution (full example - code and place where to put it at) here for that simple task (centering a cards title). My skills are simply not advanced enough to find that solution on my own, to be honest. CanĀ“t be that far away though.