custom-cards / stack-in-card

🛠 group multiple cards into one card without the borders
MIT License
262 stars 24 forks source link

Borders not removed from Mushroom Cards in Vertical Stack #60

Open WorldOfMaze opened 11 months ago

WorldOfMaze commented 11 months ago

Checklist:

Release with the issue: Stack in Card v0.2.0; Home Assistant 2023.8.1

Last working release (if known): New installation of Stack in Card

Browser and Operating System: Firefox 115.0.2 on Windows 11 Home Assistant Companion App on Android 14

Description of problem: When combining a Mushroom Climate Card and a Mushroom Entity Card into a vertical stack, the borders of both Mushroom cards are not hidden as expected.

image

The YAML for this card is:

type: custom:stack-in-card
mode: vertical
cards:
  - type: custom:mushroom-climate-card
    entity: climate.master_bedroom
    name: Master Bedroom Thermostat
    hvac_modes:
      - heat_cool
      - heat
      - cool
      - 'off'
    show_temperature_control: true
    collapsible_controls: true
    fill_container: false
  - type: custom:mushroom-entity-card
    entity: sensor.master_bedroom_humidity
    name: Humidity

Javascript errors shown in the web inspector (if applicable):

card custom:stack-in-card Error: There is no cards parameter defined
    setConfig stack-in-card.js:204
    r create-element-base.ts:97
    h create-element-base.ts:111
    h create-element-base.ts:215
    c create-element-base.ts:172
    k create-card-element.ts:101
    value hui-stack-card.ts:102
    _cards hui-stack-card.ts:47
    value hui-stack-card.ts:46
    r create-element-base.ts:97
    h create-element-base.ts:140
    h create-element-base.ts:238
    c create-element-base.ts:172
    k create-card-element.ts:101
    value hui-stack-card.ts:102
    _cards hui-stack-card.ts:47
    value hui-stack-card.ts:46
    value hui-card-preview.ts:63
    performUpdate reactive-element.ts:1331
    scheduleUpdate reactive-element.ts:1263
    _$Ej reactive-element.ts:1235
[create-element-base.ts:182:12](https://raw.githubusercontent.com/home-assistant/frontend/20230802.0/src/panels/lovelace/create-element/create-element-base.ts)
    c create-element-base.ts:182
    k create-card-element.ts:101
    value hui-stack-card.ts:102
    _cards hui-stack-card.ts:47
    value hui-stack-card.ts:46
    r create-element-base.ts:97
    h create-element-base.ts:140
    h create-element-base.ts:238
    c create-element-base.ts:172
    k create-card-element.ts:101
    value hui-stack-card.ts:102
    _cards hui-stack-card.ts:47
    value hui-stack-card.ts:46
    value hui-card-preview.ts:63
    performUpdate reactive-element.ts:1331
    scheduleUpdate reactive-element.ts:1263
    _$Ej reactive-element.ts:1235

Additional information:

matthewcbyington commented 10 months ago

I think I am also hitting this, and if so, the border corners also look a bit odd:

  1. The first (light) card is the only one inside a stack-in-card

type: custom:stack-in-card cards:

image
matthewcbyington commented 10 months ago

Note that I do not experience the poor border UI and behavior depicted above with the vertical-stack-in-card, if that helps.

pouzak commented 7 months ago

Core version 2023.11.3, used this to remove borders:

type: custom:stack-in-card
mode: vertical
cards:
  - type: media-control
    entity: media_player.lg_webos_smart_tv
  - type: history-graph
    style: |
      ha-card {
      border: none;
      }
    entities:
      - entity: media_player.lg_webos_smart_tv
        name: ' '
FilipeOS commented 5 months ago

Card mod now only works with: card_mod: style:

not only style: