dynamic popup height #649

Silther · 2024-07-11T21:29:16Z

Silther
Jul 11, 2024

Currently there is a lot of space lost because you have to hardcode the height, would be cool if it could dynamically adjust the height to the selected cards.

I mean I have some conditional cards inside the popup, so it should be smaller if the some cards are hidden and larger if not.

Also a hardcoded height doesn't handle zoom inside the browser very well.

Silther · 2024-07-11T21:30:34Z

Silther
Jul 11, 2024
Author

type: vertical-stack
cards:

type: custom:bubble-card
card_type: pop-up
hash: '#music'
name: Music Zone
icon: mdi:speaker
show_icon: false
show_name: false
scrolling_effect: false
card_layout: normal
sub_button: []
hide_backdrop: false
show_state: false
show_last_changed: false
show_attribute: false
force_icon: false
tap_action:
service: da
target:
entity_id: media_player.music_zone
action: none
double_tap_action:
action: none
hold_action:
action: none
button_type: name
bg_opacity: '75'
bg_blur: '25'
shadow_opacity: '25'
margin_top_desktop: 50px
margin_top_mobile: 50px
rows: 4
type: horizontal-stack
cards:
- type: custom:mushroom-title-card
  title: ''
  subtitle: Music
  title_tap_action:
  action: navigate
  navigation_path: /mobile-dashboard/office-music
- type: custom:mushroom-title-card
  title: ''
  subtitle: ''
- type: custom:mushroom-title-card
  title: ''
  subtitle: ''
- type: custom:mushroom-title-card
  title: ''
  subtitle: ''
- type: custom:mushroom-media-player-card
  entity: media_player.music_zone
  fill_container: false
  volume_controls:
  - volume_mute
    icon_type: none
    primary_info: none
    collapsible_controls: true
    use_media_info: false
    show_volume_level: false
    secondary_info: none
    hold_action:
    action: toggle
    tap_action:
    action: toggle
    double_tap_action:
    action: toggle
    card_mod:
    style: |
    ha-card {
    background: rgba(0,0,0,0);
    border: none;
    }
type: custom:vertical-stack-in-card
cards:
- type: custom:mushroom-media-player-card
  entity: media_player.music_zone
  use_media_info: true
  volume_controls:
  - volume_set
    collapsible_controls: true
    fill_container: true
    show_volume_level: true
    icon_type: entity-picture
    layout: horizontal
    name: Music Zone
- type: custom:mushroom-media-player-card
  entity: media_player.music_zone
  fill_container: true
  media_controls:
  - previous
  - play_pause_stop
  - next
  - repeat
  - shuffle
  - on_off
    show_volume_level: false
    use_media_info: false
    collapsible_controls: false
    icon_type: none
    primary_info: none
    secondary_info: none
type: custom:mushroom-title-card
title: ''
type: conditional
conditions:
- entity: media_player.music_zone
  state_not: 'off'
- entity: media_player.music_zone
  state_not: unavailable
- entity: media_player.music_zone
  state_not: standby
  card:
  type: vertical-stack
  cards:
  - type: custom:vertical-stack-in-card
    cards:
    - type: custom:mushroom-media-player-card
      entity: media_player.nest_mini_2
      show_volume_level: false
      volume_controls: []
      fill_container: true
      name: Nest Mini 2
    - type: custom:mushroom-media-player-card
      entity: media_player.nest_mini_2
      show_volume_level: true
      volume_controls:
      - volume_set
      - volume_mute
        fill_container: true
        name: Nest Mini 2
        primary_info: none
        secondary_info: none
        icon_type: none
  - type: custom:vertical-stack-in-card
    cards:
    - type: custom:mushroom-media-player-card
      entity: media_player.bose_home_speaker
      show_volume_level: false
      volume_controls: []
      fill_container: true
      name: Bose Home
    - type: custom:mushroom-media-player-card
      entity: media_player.bose_home_speaker
      show_volume_level: true
      volume_controls:
      - volume_set
      - volume_mute
        fill_container: true
        name: Bose Home
        primary_info: none
        secondary_info: none
        icon_type: none
  - type: conditional
    conditions:
    - condition: state
      entity: media_player.monitor
      state_not: unavailable
      card:
      type: custom:vertical-stack-in-card
      cards:
      - type: custom:mushroom-media-player-card
        entity: media_player.monitor
        show_volume_level: false
        volume_controls: []
        fill_container: true
        name: Monitor
      - type: custom:mushroom-media-player-card
        entity: media_player.monitor
        show_volume_level: true
        volume_controls:
        
        volume_set
        
        volume_mute
        fill_container: true
        name: Monitor
        primary_info: none
        secondary_info: none
        icon_type: none
type: conditional
conditions:
- entity: media_player.music_zone
  state_not: playing
- entity: media_player.music_zone
  state_not: paused
- entity: media_player.music_zone
  state_not: buffering
- entity: media_player.music_zone
  state_not: idle
  card:
  type: vertical-stack
  cards:
  - type: custom:vertical-stack-in-card
    cards:
    - type: custom:mushroom-media-player-card
      entity: media_player.nest_mini_2
      use_media_info: false
      volume_controls:
      - volume_set
      - volume_mute
      - volume_buttons
        collapsible_controls: false
        fill_container: true
        show_volume_level: false
        icon_type: entity-picture
        layout: horizontal
        name: Nest Mini 2
    - type: custom:mushroom-media-player-card
      entity: media_player.nest_mini_2
      fill_container: true
      media_controls:
      - previous
      - play_pause_stop
      - next
      - repeat
      - shuffle
      - on_off
        show_volume_level: false
        use_media_info: true
        collapsible_controls: false
        icon_type: none
        primary_info: none
        secondary_info: none
  - type: custom:vertical-stack-in-card
    cards:
    - type: custom:mushroom-media-player-card
      entity: media_player.bose_home_speaker
      use_media_info: false
      volume_controls:
      - volume_set
      - volume_mute
      - volume_buttons
        collapsible_controls: false
        fill_container: true
        show_volume_level: false
        icon_type: entity-picture
        layout: horizontal
        name: Bose Home
    - type: custom:mushroom-media-player-card
      entity: media_player.bose_home_speaker
      fill_container: true
      media_controls:
      - previous
      - play_pause_stop
      - next
      - repeat
      - shuffle
      - on_off
        show_volume_level: false
        use_media_info: true
        collapsible_controls: false
        icon_type: none
        primary_info: none
        secondary_info: none
  - type: conditional
    conditions:
    - condition: state
      entity: media_player.monitor
      state_not: unavailable
      card:
      type: custom:vertical-stack-in-card
      cards:
      - type: custom:mushroom-media-player-card
        entity: media_player.monitor
        use_media_info: false
        volume_controls:
        
        volume_set
        
        volume_mute
        
        volume_buttons
        collapsible_controls: false
        fill_container: true
        show_volume_level: false
        icon_type: entity-picture
        layout: horizontal
        name: Monitor
      - type: custom:mushroom-media-player-card
        entity: media_player.monitor
        fill_container: true
        media_controls:
        
        previous
        
        play_pause_stop
        
        next
        
        repeat
        
        shuffle
        
        on_off
        show_volume_level: false
        use_media_info: true
        collapsible_controls: false
        icon_type: none
        primary_info: none
        secondary_info: none

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

dynamic popup height #649

{{title}}

Replies: 1 comment

{{title}}

Select a reply

dynamic popup height #649

Silther Jul 11, 2024

Replies: 1 comment

Silther Jul 11, 2024 Author

Silther
Jul 11, 2024

Silther
Jul 11, 2024
Author