[GH-ISSUE #15] Dropdown Menu Bug #14

New issue

Closed

opened 2026-05-07 00:17:16 +02:00 by BreizhHardware · 1 comment

BreizhHardware commented

2026-05-07 00:17:16 +02:00

Owner

Originally created by @luismbendix on GitHub (Jun 30, 2025).
Original GitHub issue: https://github.com/Nezz/homeassistant-visionos-theme/issues/15

Currently seeing some weird behavior with dropdown menus — they sometimes render far off (e.g. below cards or misaligned to the right). Happens both in Firefox (latest) and the Home Assistant app.

Installation method: Home Assistant Container
Core version: 2025.5.3
Frontend version: 20250516.0

Tested with multiple themes to rule that out — issue only occurs with my current theme, others render dropdowns properly. Full restart of Home Assistant and browser/app didn’t help.

Happy to help troubleshoot further — let me know if I can provide logs, screenshots, or test anything specific.

Weird Dropdowns:

Working Dropdowns:

Originally created by @luismbendix on GitHub (Jun 30, 2025). Original GitHub issue: https://github.com/Nezz/homeassistant-visionos-theme/issues/15 Currently seeing some weird behavior with dropdown menus — they sometimes render far off (e.g. below cards or misaligned to the right). Happens both in Firefox (latest) and the Home Assistant app. Installation method: Home Assistant Container Core version: 2025.5.3 Frontend version: 20250516.0 Tested with multiple themes to rule that out — issue only occurs with my current theme, others render dropdowns properly. Full restart of Home Assistant and browser/app didn’t help. Happy to help troubleshoot further — let me know if I can provide logs, screenshots, or test anything specific. Weird Dropdowns: <img width="638" alt="Image" src="https://github.com/user-attachments/assets/cef4eabd-a7cd-4c1f-b1ae-71151bf10f94" /> <img width="1508" alt="Image" src="https://github.com/user-attachments/assets/2d73c8e5-2317-4e70-b647-9a49384fdf07" /> ![Image](https://github.com/user-attachments/assets/be2f17bf-de60-4af0-9e12-5c3aea0ea5f8) Working Dropdowns: <img width="1511" alt="Image" src="https://github.com/user-attachments/assets/be453ed4-0caa-4934-a7fd-b428633fec37" /> <img width="1510" alt="Image" src="https://github.com/user-attachments/assets/12f60d30-5c5e-429e-a98f-6fccdb38c1fe" /> ![Image](https://github.com/user-attachments/assets/adfb056d-8dfb-459e-8c38-df02ccd8d2a0)

BreizhHardware referenced this issue

2026-05-07 00:17:16 +02:00

[GH-ISSUE #14] Is it Possible to remove blur from text only cards ? #15

BreizhHardware closed this issue

2026-05-07 00:17:17 +02:00

BreizhHardware commented

2026-05-07 00:17:17 +02:00

Author

Owner

@Nezz commented on GitHub (Jun 30, 2025):

Duplicate of #2. I recommend using this HACS plugin:
https://github.com/Nerwyn/service-call-tile-feature

That allows use selectors instead:

YAML:

features:
  - type: custom:service-call
    styles: ""
    entries:
      - type: selector
        entity_id: input_select.home_scene
        styles: |-
          :host {
            --color: rgba(233, 233, 233, 0.2);
            --feature-border-radius: 24px;
          }

          .selected-option {
            box-shadow: var(--ha-card-box-shadow);
          }
        options:
          - entity_id: input_select.home_scene
            option: scene.home_home
            tap_action:
              action: perform-action
              perform_action: scene.turn_on
              target:
                entity_id:
                  - scene.home_home
              data: {}
            icon: mdi:home-account
            haptics: true
            label: Home
            styles: |-
              :host {
                flex-flow: row;
                gap: 8px;
                place-content: center center;
              }
              .label {
                font-weight: 500;
                width: unset;
              }
          - entity_id: input_select.home_scene
            option: scene.home_leaving
            tap_action:
              action: perform-action
              perform_action: scene.turn_on
              target:
                entity_id:
                  - scene.home_leaving
              data: {}
            icon: mdi:home-export-outline
            haptics: true
            label: Leaving
            styles: |-
              :host {
                flex-flow: row;
                gap: 8px;
                place-content: center center;
              }
              .label {
                font-weight: 500;
                width: unset;
              }
          - entity_id: input_select.home_scene
            option: scene.home_away
            tap_action:
              action: perform-action
              perform_action: scene.turn_on
              target:
                entity_id:
                  - scene.home_away
              data: {}
            icon: mdi:home-outline
            haptics: true
            label: Away
            styles: |-
              :host {
                flex-flow: row;
                gap: 8px;
                place-content: center center;
              }
              .label {
                font-weight: 500;
                width: unset;
              }
type: tile
entity: light.all_lights
layout_options:
  grid_columns: 4
  grid_rows: 1
name: Home
hide_state: true
vertical: false
features_position: bottom

@Nezz commented on GitHub (Jun 30, 2025): Duplicate of #2. I recommend using this HACS plugin: https://github.com/Nerwyn/service-call-tile-feature That allows use selectors instead: <img width="484" alt="Image" src="https://github.com/user-attachments/assets/f2ad2e56-ffb2-4322-b5a4-31ae7b1a9d62" /> YAML: ```yaml features: - type: custom:service-call styles: "" entries: - type: selector entity_id: input_select.home_scene styles: |- :host { --color: rgba(233, 233, 233, 0.2); --feature-border-radius: 24px; } .selected-option { box-shadow: var(--ha-card-box-shadow); } options: - entity_id: input_select.home_scene option: scene.home_home tap_action: action: perform-action perform_action: scene.turn_on target: entity_id: - scene.home_home data: {} icon: mdi:home-account haptics: true label: Home styles: |- :host { flex-flow: row; gap: 8px; place-content: center center; } .label { font-weight: 500; width: unset; } - entity_id: input_select.home_scene option: scene.home_leaving tap_action: action: perform-action perform_action: scene.turn_on target: entity_id: - scene.home_leaving data: {} icon: mdi:home-export-outline haptics: true label: Leaving styles: |- :host { flex-flow: row; gap: 8px; place-content: center center; } .label { font-weight: 500; width: unset; } - entity_id: input_select.home_scene option: scene.home_away tap_action: action: perform-action perform_action: scene.turn_on target: entity_id: - scene.home_away data: {} icon: mdi:home-outline haptics: true label: Away styles: |- :host { flex-flow: row; gap: 8px; place-content: center center; } .label { font-weight: 500; width: unset; } type: tile entity: light.all_lights layout_options: grid_columns: 4 grid_rows: 1 name: Home hide_state: true vertical: false features_position: bottom ```