jm-cook commented 1 month ago

When I use the grid layout as the view directly in a dashboard all is fine and cards are rendered with rounded corners. However (#287) in order to render correctly on a nest hub, it is necessary to use a panel view with a layout-card inside (I know, it says not recommended, but I have no choice). Using the layout-card with a grid-layout is necessary to render the dashboard on a nest hub, but the ha-card-border-radius is lost, ie it is reset to zero somewhere and the cards are rendered with square corners.

The only workaround I have found is to use card_mod on every card to set the border-radius and I don't want to do that.

It makes no difference whether or not I use a theme that sets the border-radius.

My Home Assistant version: 2024.5.4

Layout-card version (FROM BROWSER CONSOLE): 2.4.5

What I am doing:

Using layout-card to render a panel

What I expected to happen:

The panel should be rendered with rounded corners in the individual cards

What happened instead:

The ha-card-border-radius is set to zero

Minimal steps to reproduce:

Create a new dashboard and replace the raw yaml with this:

# The least amount of code possible to reproduce my error
views:
  - title: test again
    path: test-again
    type: panel
    cards:
      - type: custom:layout-card
        layout_type: custom:grid-layout
        layout:
          grid-template-columns: repeat(3,auto)
          grid-template-rows: auto
          grid-template-areas: |
            "r1c1 r1c2 r1c3"
            "r2c1 r2c2 r2c3"
        cards:
          - type: markdown
            view_layout:
              grid-area: r1c1
            content: '## Placeholder'
          - type: markdown
            view_layout:
              grid-area: r1c2
            content: '## Placeholder'
          - type: markdown
            view_layout:
              grid-area: r1c3
            content: '## Placeholder'

# End of code

Using a grid-layout view:

Error messages from the browser console:

None

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

[x] Understand that this is a channel for reporting bugs, not a support forum (https://community.home-assistant.io/).
[x] Have made sure I am using the latest version of the plugin.
[x] Have followed the troubleshooting steps of the "Common Problems" section of https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins.
[x] Understand that leaving one or more boxes unticked or failure to follow the template above may increase the time required to handle my bug-report, or cause it to be closed without further action.

jm-cook commented 1 month ago

PS: I noticed that a single layout-card with layout-type: custom:grid-layout inside a view that is a grid-layout card works just fine :-)

Edit: but I forgot, then it doesnt work when casted :-(

jm-cook commented 4 weeks ago

284 describes the same issue.

I tried the workaround https://github.com/thomasloven/lovelace-layout-card/issues/284#issuecomment-2048424148 and it worked viewing the dashboard in a web browser. The workaround needs adding to your theme. Also be sure to read about themes in lovelace card mod https://github.com/thomasloven/lovelace-card-mod/tree/2.0.0 for the workaround to be able to reference your theme correctly.

Casted dashboard not yet tested.

thomasloven / lovelace-layout-card

layout-card resets style #289

284 describes the same issue.