lovelace-card-mod: READ THIS FIRST! - CARD-MOD 3.4.0 IS NOT WORKING?

If card-mod 3.4.0 is not working for you, please check your configuration.

style: |
  ... styles go here...

has not been the recommended way to do things for more than two years and has been causing trouble since the start, so I didn’t think twice about removing it.

If you have that in your configuration, use the following instead:

card_mod:
  style: |
    ...styles go here...

You know… as it says in the readme. …which you claim to have re-read when you check the box at the bottom of the issue template:

Have followed the troubleshooting steps of the “Common Problems” section of https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins.

It’s really there to avoid wasting both of our time 😉

About this issue

Original URL
State: open
Created 6 months ago
Reactions: 18
Comments: 25 (11 by maintainers)

Commits related to this issue

remove deprecated stylesheet convention (see https://github.com/thomasloven/lovelace-card-mod/issues/332 for more details) — committed to tmack8001/ha-rivian-card by tmack8001 5 months ago
remove deprecated stylesheet convention (see https://github.com/thomasloven/lovelace-card-mod/issues/332 for more details) — committed to tmack8001/ha-rivian-card by tmack8001 5 months ago
Update config.yaml for card-mod 3.4 update Card-mod version 3.4 depreciated an old way to add CSS styles. Having card_mod: above style is now mandatory so this fixes that. More info here on that upda... — committed to riskitforabiscuit1252/YouTube by riskitforabiscuit1252 3 months ago
Update config.yaml for card-mod 3.4 update Card-mod version 3.4 depreciated an old way to add CSS styles. Having card_mod: above style is now mandatory so this fixes that. More info here on that upda... — committed to Sian-Lee-SA/YouTube by riskitforabiscuit1252 3 months ago

Most upvoted comments

I’m surprised that nobody has mentioned that a major change should be a major version bump, not a minor one.

The change was in a major version bump. https://github.com/thomasloven/lovelace-card-mod/releases/tag/3.0.0

thomasloven on Jan 8, 2024

The answer is here: https://github.com/thomasloven/lovelace-card-mod/releases

pcb1962 on Jan 29, 2024

Yes. I admit I should have communicated this more clearly. But after the two years, I honestly forgot about it and didn’t even remember that there was anything to communicate…

Sorry.

thomasloven on Jan 9, 2024

Hello,

I cannot get the new card-mod 3.4.0 working.

I use the code:

    type: custom:mushroom-template-card
    primary: ''
    secondary: ''
    icon: mdi:arrow-left-bold
    icon_color: '#A49B9B'
    card_mod:
      style: |
        ha-card {margin-left: '-10px'; width: 70px;border: solid 0px ;
        background: rgba(0,0,0,0)}

What ever part do change, nothing happens in the layout of the card. In the old version (3.3) it worked well.

Even if I do copy/paste the lines from the manual in a new card:

  card_mod:
  style: |
    ha-card {
      color: red;
    }

Nothing red comes up.

Card-mot is installed (actualy:updated). I tried with and without

frontend:
  extra_module_url:
    - /local/card-mod.js

in th config yaml

What do I do wrong?

brinkgit on Jan 4, 2024

In the YAML editors you can select a block of code and hit tab, it will move the entire block the text indented in (no need to use spacebar or individual lines). If you need to outdent, you can do a block and use shift+tab. Vscode is also a great suggestion.

– Geoff Hallford

On Sun, Dec 31, 2023, 8:09 AM Thomas Lovén @.***> wrote:

Well. A good editor, like Visual Studio Code https://code.visualstudio.com/ (or vim), should let you indent a whole block by selecting it and pressing tab (or >) once. That’s a start.

— Reply to this email directly, view it on GitHub https://github.com/thomasloven/lovelace-card-mod/issues/332#issuecomment-1872945312, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEH3ED7AQ3LDGGNNS3YDZ33YMFPZPAVCNFSM6AAAAABBGSDPUKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQNZSHE2DKMZRGI . You are receiving this because you were mentioned.Message ID: @.***>

ghallford on Dec 31, 2023

Well. A good editor, like Visual Studio Code (or vim), should let you indent a whole block by selecting it and pressing tab (or >) once. That’s a start.

thomasloven on Dec 31, 2023