Can't hide three dot button on Light Card

Configuration Frontend
1

I tried using card-mod to hide the three dot button on the light card, but it still shows up. What am I doing wrong? Card mod is installed. Here’s my code:

type: vertical-stack
style: |
  mwc-icon-button {
  display: none;
  }
cards:
  - type: custom:stack-in-card
    mode: horizontal
    cards:
      - type: light
        entity: light.living_room_light_level
        name: Living Room
        style: |
          mwc-icon-button  {
          display: none; }
      - type: light
        entity: light.mantle_light
        name: Mantle
      - type: button
        tap_action:
          action: toggle
        entity: switch.fireplace
  - type: custom:stack-in-card
    mode: horizontal
    cards:
      - type: light
        entity: light.kitchen_light_level
        name: Kitchen
      - type: light
        entity: light.dining_room_light_level
        name: Dining
      - type: light
        entity: light.counter_lights_level
        name: Counter
  - type: custom:stack-in-card
    mode: horizontal
    cards:
      - type: light
        entity: light.foyer_light_level
        name: Foyer
      - type: light
        entity: light.hall_light_level
        name: Hall
2

Solved it by using ha-icon-button instead of mwc-icon-button.

3

The solutions which worked for me:

  - type: light
    entity: light.kitchen_lights
    name: 'Kitchen'
    icon: ''
    card_mod:
      style: |
        ha-icon-button.more-info {
        display: none;
        }

By adding the “.more-info” will not hide the main Icon

1 Like