thomasloven / lovelace-layout-card

🔹 Get more control over the placement of lovelace cards.
MIT License
1.04k stars 126 forks source link

Layout tab not showing #249

Open piersm2 opened 1 year ago

piersm2 commented 1 year ago

My Home Assistant version: 2023.5.4

Layout-card version (FROM BROWSER CONSOLE): 2.4.4

What I am doing: Updating view type of my dashboard to "layout-card" format

What I expected to happen: Layout tab to be visible

What happened instead: It is not showing up

Minimal steps to reproduce: followed steps via github, also cleared my cache on my browser and still not visible

# The least amount of code possible to reproduce my error

# End of code

Error messages from the browser console:


By putting an X in the boxes ([X]) below, I indicate that I:

bartbergmans commented 1 year ago

The "Layout Options" box is the textfield at the bottom of the "Settings" tab, the "View type" also can be found on this tab.

Trakkasure commented 1 year ago

Adding my 2 cense... I have the same issue.. However, the max columns is visually restricted to 2, no matter what max_cols is set to (tried 8, 10, etc) Inside a layout-card, the number of cards in a row is also restricted to 4.

What I am trying to achieve is a single row with all of my battery operated device % levels in them (about 10 of them) I would use the gauge card and a max width with about 90 or 100.

dsellers1 commented 1 year ago

@Trakkasure This works for me and my custom:button-cards.

  - type: grid
    view_layout:
      grid-area: footer2
    columns: 7
    square: false
    cards:
      - type: custom:button-card
        template: battery_custom_button
        entity: sensor.s22_ultra_battery_level
        name: Phone
[...shortened from 5 entities...]

image Columns set to 7 but I only use 5 (room to grow). Just in case it is useful, here's my view's layout:

type: custom:layout-card
layout_type: grid
layout:
  grid-template-columns: 49% 51%
  grid-template-rows: 350px 175px 190px 13px
  grid-template-areas: |
    "col1 main" 
    "gap gap1"
    "gap2 gap3"
    "footer1 gap4"
    "footer1 footer2"
  margin: '-4px 4px -4px -4px'
  padding: 0
  card_margin: 0