This is still not the way to change the z-index, you need to target the element, here is how you can change it:
styles: |
.horizontal-buttons-stack-card {
z-index: 5 !important;
}
1 Like
Indeed, any entity type that has a last_changed time is supported (so basically every entities), I will change that in the next release 
1 Like
Just add opacity: 1 !important; to change that 
1 Like
Thanks but it doesn’t help unfortunately - the bubble card buttons and popups are still on top of everything else, no matter what z-index I use for the button stack or the mod-card. There must be something in there that’s breaking the order maybe.
How i set this at bottom?
Hi, i have some problems with the pop up card and my theme. I use the rounded theme (🟣 Rounded - Dashboard guide) and cant get the background color for the pop up in dark/light mode right.
i have it set to var(–black1) in the picture.
would be nice… 
@Cloos I see that we can set the button_type of the popup to different things. Would it be possible to set it to a media_player? I think that would look nice and i have a use case for it. I could build out all the sub buttons myself but was curious if we could get that added as an update?
The documentation illustrates how to use a picture instead of an icon with a sub-button. Is it possible to do this with the main button icon? I tried via css but didn’t know what to replace the .bubble-sub-button with.
Any plans to add support for picture/background as header for the pop-up card? thanks
Could you share your code for this
This is currently possible. Create a vertical stack and place the pop-up card as the first card in the stack, with the media card or components as subsequent elements in the stack.
I went ahead and added it to my original post for you.
Hi, I’ve just tried and the only way to makes it fixed (sticky) is by adding this in your custom styles:
styles: |-
${card.parentNode.host.parentElement.parentElement.style.position = "sticky"}
${card.parentNode.host.parentElement.parentElement.style.bottom = "14px"}
If I understand you correctly, you’re seeking to use Jinja to dynamically show the Weather condition/value as the button text in the horizontal-button-stack, right? If so, yes it’s doable with card-mod. My Bubble Card setup is all messed up after this recent update so I don’t know how to do this from the Bubble Card styles object.
type: custom:bubble-card
card_type: horizontal-buttons-stack
1_link: '#weather'
1_name: ' '
card_mod:
style: |
ha-card .weather {
--card-mod-icon: {{ states('sensor.current_weather_mdi_value') }}; // dynamically pull icon
.name:before {
content: "{{ states('sensor.current_weather_condition') }}" // dynamically pull your weather condition sensor state
}
}
Cloos
Do you know if it would even be possible to get something similar to this effect using a bubble-button card?
I have the relevant API to get the static map as a background image but wasn’t sure if it is people to change the background in this way?
I’ve tried using these custom styles within the Button Card pop up styles object and it seems to break the pop up functionality - clicking the button that should open the popup using these custom styles only changes the location path; the popup itself doesn’t actually display.
There are some issues with the pop-up header templates in v2.0.3, but I’m on it! For example it is also impossible to template the icons at the moment.
I have also fixed many other issues and I will try to release a new version today 
4 Likes
Hmm. I have a big header for my popup card already.
without but name portion:
- type: vertical-stack
cards:
- type: custom:bubble-card
card_type: pop-up
hash: '#gretas-music'
width_desktop: 100%
- type: vertical-stack
cards:
- type: custom:bubble-card
card_type: media-player
entity: media_player.gretas_room
card_layout: large
- square: true
type: grid
cards:
- show_name: true
show_icon: true
type: button
tap_action:
action: call-service
service: mass.play_media
target:
entity_id: media_player.gretas_room
data:
media_type: artist
media_id: Taylor Swift
artist: Taylor Swift
enqueue: replace
entity: media_player.gretas_room
name: Taylor Swift
icon: mdi:music-circle-outline
theme: Mushroom Square
hold_action:
action: none
- show_name: true
show_icon: true
type: button
tap_action:
action: call-service
service: mass.play_media
target:
entity_id: media_player.gretas_room
data:
media_type: album
media_id: The Greatest Showman
enqueue: replace
album: The Greatest Showman
entity: media_player.gretas_room
icon: mdi:music-circle-outline
hold_action:
action: none
name: Greatest Showman
theme: Mushroom Square
- show_name: true
show_icon: true
type: button
tap_action:
action: call-service
service: mass.play_media
target:
entity_id: media_player.gretas_room
data:
media_type: playlist
media_id: Disney Hits
enqueue: replace
entity: media_player.gretas_room
icon: mdi:music-circle-outline
theme: Mushroom Square
hold_action:
action: none
name: Disney Hits
columns: 3
Is it cuz i have a nested vertical stack?
Edit: i removed the nested vertical stack with the same results.
I misunderstood. Media-player isn’t a supported type of bubble card, but a media card can be nested in the pop-up.