My Lovelace Plugins

Has anybody had any luck with card-tools and the stock Samsung browser on Android? It says it can’t find card-tools and throws an error in the log:
https://redacted:8123/local/card-tools.js?v=445b68:140:50 Uncaught SyntaxError: Unexpected token ...

It works on any desktop browser and Chrome on Android. Have tried every trick in the book to clear the cache, but no dice…

Thanks for all your work! Card Modder gets used the most out of all my custom cards and has made setting up my views MUCH easier.

I recently was redesigning a view for a smaller tablet and stumbled upon your updated card-modder that allows resizing. I put card tools and card modder in place and cleared out my cache. Now I am getting the following error in logging when trying to view the cards.

local/card-modder.js:7:1 Uncaught SyntaxError: Unexpected token <

Any idea what I may have done wrong? Most of my card modder views are configured from an older version. Here is a sample config that I use on most items.

          - type: custom:card-modder
            card:       
              type: media-control
              name: WorkoutRoomTV
              entity: media_player.workout_room_tv
              column_width: calc(100% / 1)
              style:
                - text-transform: none
            style:                 
              background-image: url("/local/cardbackK.png")
              background-repeat: no-repeat
              background-color: rgba(50,50,50,0.3)
              background-size: 100% 68px
              border-radius: 20px
              border: solid 1px rgba(100,100,100,0.3)
              box-shadow: 3px 3px rgba(0,0,0,0.4)

Any help is much appreciated!

Guess I am getting a similar error as you, except I am using chrome on desktop and getting it.

Unexpected token < means you didn’t download the Raw file from github.

1 Like

Well… that is a bit embarrassing. I don’t know why I decided to try and download from the save as link instead of the proper way like I have done every other time… Appreciate the response and patience. That definitely fixed the issue. Appreciate all the hard work!

Another question here from me. So sorry, but I absolutely love card-modder!!!

I’m now trying to style a vertical-stack, but don’t seem to be getting anywhere. All I get is a small line about 20px high at the start and end of the card. The cards inside the vertical stack work fine, I just can’t style the vertical-stack.

Any ideas? Is it even possible? I don’t see a ha-card element. Only hui-vertical-stack-card.

  - type: vertical-stack
    cards:
      - type: custom:card-modder
        card: 
          type: custom:monster-card
          card:
            type: entities
            show_header_toggle: false
            title: Device Trackers
          filter:
            include:
              - entity_id: device_tracker

          style:
            - text-transform: none
        style:
          background-image: url("/local/cardbackK.png")
          background-repeat: no-repeat
          background-color: rgba(50,50,50,0.3)
          background-size: 100% 68px
          border-radius: 20px
          border: solid 1px rgba(100,100,100,0.3)
          box-shadow: 3px 3px rgba(0,0,0,0.4)
      - type: custom:card-modder
        card: 
          type: history-graph
          title: "Device Tracker History"
          entities:
            - entity: device_tracker

          style:
            - text-transform: none
        style:
          background-image: url("/local/cardbackK.png")
          background-repeat: no-repeat
          background-color: rgba(50,50,50,0.3)
          background-size: 100% 68px
          border-radius: 20px
          border: solid 1px rgba(100,100,100,0.3)
          box-shadow: 3px 3px rgba(0,0,0,0.4)

Not sure if this will help, but its my yaml from a vertical stack that is modded with card-modder and also using the custom:monster-card too inside the stack.

Is it possible to use the tap_action inside a custom-layout card?

Will you share the cardbackK.png? I need it but cannot find it…

cardbackK

Please and thank you.

1 Like

The stack cards themself have no visible entities, so there’s really nothing to style.
What are you actually trying to do?

@thomasloven I’m trying to style it to look like a card, and then place a few cards inside and remove their backgrounds so it all looks like one big card.

If it can’t be done, then I’ll make do.

Check out vertical-stack-in-card.

I’m getting an error

card-modder.js:45:20 Uncaught TypeError: Cannot read property 'forEach' of undefined

Try the latest version.

The latest version of card-modder.js? I downloaded it already and I also updated ha there is no change. I also downloaded state-card-custom-ui and no change.

Then the update failed somehow. Make sure your cache is invalidated.
The error says that there is a problem with forEach on line 45 of the script.
Line 45 of the script reads: " "

It has the exact same results. Guess I’ll just have to make do without doing what I wanted. :frowning_face: Oh well.

I’ll reply to myself for the sake of helping anyone facing the same issue in the future :stuck_out_tongue:.

If you want to use lovelace-gen.py while using home-assistant (not hassio) in a docker container, you have to do it from within said container ! (As a beginner, it was hard to understand at first).

So lets say your container’s called hass, then you have to run the following:

# docker exec -it hass /bin/bash
# cd /config ./lovelace-gen.py

It should work (and make you happy).

Then you can use a trick where any card can also be an entity row.

- type: entities
  entities:
    - type: custom:card-modder
      style:
        ...
      card:
        type: hui-entities-card
        entities:
          ...
    - type: custom:card-modder
      style:
        ...
      card:
        type: hui-glance-card
        entities:
          ...

And so on.