Lovelace: Vertical Style

Share your Projects! Dashboards & Frontend
1

Hi all,

This is my first contribution on HA. Vertical Style is a custom Lovelace card for Home Assistant who let you group diferent cards in one vertical-stack card, with diferent style options, like title, card color, to have a border or not. This is very useful for cards like custom:button-card or picture-entity, giving the option for add a title and grouping in a column.

This is my github project:

Enjoy!

9 Likes
2

Great card. Thank you so much. This is what I needed. Now I can give my button cards a header.
I’ve got one suggestion: could you maybe make the header showing like the standard lovelace headings if no customization was done?

1 Like
3

Also exactly what I’ve been looking for, and works great! Thanks so much for making this!

1 Like
4

Fantastic, can you please make it part of the custom updater cards?

Having now so many custom components it is difficult to track manually updates all of them

1 Like
5

Awesome stuff! Works great indeed to group the custom:button-card nicely.

1 Like
6

Thanks for your suggestion! I release a new version, now you can just add a title, style is optional.

7

Now you can add this card to custom_updater. The json file is in my repo.

1 Like
8

Thanks you! Works perfect :slight_smile:

9

Is it done automatically updating your component, or do I need to do something on my side

10

You need to add the json url in your custom_updater component. In the github project you can see the steps for this.

12

likee this is not working

custom_updater:
card_urls:
- https://raw.githubusercontent.com/matisaul/vertical-style-card/master/vertical-style-card.js

13

You need to put the tracker.json url, not the card js file. It was my bad, sorry. Now I put the correct url.

15

It still gives error… Not sure it’s me or the json format is not correct

16

That’s strange, It works for me. Could you show me the error log?

17

Not sure where the error is.

This is all my config

custom_updater:
  track:
    - components
    - cards
    - python_scripts
  card_urls:
    - https://raw.githubusercontent.com/matisaul/vertical-style-card/master/tracker.json
    - https://raw.githubusercontent.com/kuuji/button-card/0.0.2/tracker.json
  #  - https://raw.githubusercontent.com/custom-cards/information/master/repos.json



resources:
  - url: /local/gauge-card.js?v=0.2.0
    type: js
  - url: /local/monster-card.js
    type: js
  - url: /local/custom_ui/weather-card.js
    type: js
  - url: /local/entity-attributes-card.js?v=0.1.1
    type: js
  - url: /local/bignumber-card.js?v=0.0.1
    type: js
  - url: /local/plan-coordinates.js?v=0.1.0
    type: js
  - url: /local/alarm_control_panel-card.js?v=0.4.0
    type: js
  - url: /local/thermostat-card.js
    type: module
  - url: /local/dual-gauge-card.js
    type: js
  - url: /local/light-card.js
    type: js
  - url: /local/custom-lovelace/button-card.js?v=0.0.2
    type: module
  - url: /local/tracker-card.js?v=0.1.5
    type: js
  - url: /local/mini-media-player.js?v=0.0.2
type: module
  - url: /local/lovelace-fullykiosk.js
type: js
  - url: /local/kiosk-config.js
type: js
18

Custom_updater looks ok, but you don’t have the vertical-style-card in your resources.

19

Ops, it was there, I may have not saved the file. Thanks for noting it.

SO this is solved, although I do get ?? Update as title, and clicking on upfdate does not update (but it shows the updates available, it seems)

20

That It’s a custom updater problem. Do you update to the lastest version of py file ?

21

yes I did today as well, just to make sure. Very strange

22

The custom_updater itself is in the process of debugging. We have a issue about this matter on github.
https://github.com/custom-cards/tracker-card/issues/21