spice urchin
I'm currently trying to make it so I can choose which TTS engine will be used, that whole side is working, but for some reason I am completely unable to figure out how to actually make the dropdown menu not be contained inside of it's section, I want the dropdown menu itself to just be free and out.
The only other option I've had work is calling the more-info on a tap action, but that is not the way I want it to work.
little talon
I'm currently trying to make it so I can choose which TTS engine will be used, t...
Can you post your whole code for the section?
I added an input_select to a section and didn't have any issues with it showing on top of the other cards beneath it. I even tried putting it in a 2-column grid card and still had no issues.
spice urchin
Sorry, I haven't really had the time until now, here is the section.
type: custom:layout-card
layout_type: grid
layout:
grid-template-columns: 1fr
grid-template-rows: 1fr auto
height: 100%
grid-gap: 0
grid_options:
columns: 21
rows: 5
cards:
- type: markdown
text_only: false
content: |
{{ states('input_text.snarky_weather') }}
card_mod:
style: |
ha-card {
padding: 0;
border-width: 0;
box-shoadw: none;
}
- type: custom:layout-card
layout_type: grid
layout:
grid-template-columns: 1fr 1fr
grid-gap: 0
height: 100%
cards:
- type: custom:mushroom-template-card
primary: Speak
icon: mdi:play
card_mod:
style: |
ha-card {
padding: 0;
margin: 0;
border-width: 0;
box-shadow: none;
}
layout_options:
grid_row: end
tap_action:
action: call-service
service: script.speak_snarky_weather
- type: entities
entities:
- entity: input_select.tts_entity
name: TTS Engine
card_mod:
style: |
ha-card {
padding: 0;
margin: 0;
border-width: 0;
box-shadow: none;
height: 100%;
}
.mdc-select {
--mdc-theme-primary: var(--primary-color);
height: 100%;
}
.mdc-select__anchor {
height: 100%;
}
.mdc-select__selected-text {
height: 100%;
display: flex;
align-items: center;
}
.mdc-menu-surface {
z-index: 9999 !important;
position: fixed !important;
}
layout_options:
grid_row: end
Initially, I thought the issue seemed to be caused by the layout-cards. I swapped them out with vertical- and horizontal-stacks and it all worked. (But then you'd loose your layout configuration.) Changing to a custom:stack-in-card caused the same issue. I tried embedding the Entities card inside a custom:button-card and the issue showed up there, too. (The custom:button-card surprised me because I've never had issues with embedding other cards before.)
I see you already tried changing the z-index which is what I was going to try.
It seems more likely that the issue is with the Entities card itself. Changing to a custom:mushroom-select-card seemed to make everything work.