Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Cards disappearing when exiting 'edit' mode #48

Closed
siliconsolder opened this issue Sep 13, 2023 · 10 comments
Closed

Cards disappearing when exiting 'edit' mode #48

siliconsolder opened this issue Sep 13, 2023 · 10 comments
Labels
question Further information is requested

Comments

@siliconsolder
Copy link

siliconsolder commented Sep 13, 2023 •
edited 

type: vertical-stack
cards:
  - type: custom:bubble-card
    card_type: pop-up
    hash: '#uppfarten'
    name: Uppfarten
    icon: mdi:garage
    entity: light.uppfartsbelysningen
    state: sensor.uppfarten_temperatur
    state_unit: °C
    width_desktop: 600px
    margin_top_mobile: 18px
    margin_top_desktop: 74px
    is_sidebar_hidden: false
  - square: false
    type: grid
    columns: 3
    cards:
      - type: custom:bubble-card
        card_type: button
        entity: binary_sensor.ytterdorr_open
        name: Hallen
        icon: mdi:door
        card_mod:
          style: |
            .switch-button { 
                {% if is_state(config.entity, 'on') %}
                  background-color: #990000 !important
                {% else %}
                  background-color: green !important
                {% endif %}
            }
  - type: custom:bubble-card
    card_type: separator
    name: Lampor
    icon: mdi:lightbulb-group
  - square: false
    type: grid
    columns: 2
    cards:
      - type: custom:bubble-card
        card_type: button
        button_type: switch
        entity: light.svampen
        name: Svampen
      - type: custom:bubble-card
        card_type: button
        button_type: switch
        entity: light.lilla_hallen
        icon: mdi:ceiling-light
      - type: custom:bubble-card
        card_type: button
        button_type: slider
        entity: light.vintagelampan
        icon: mdi:lamp-outline
        name: Vintagelampan
  - type: custom:bubble-card
    card_type: separator
    name: Mídia
    icon: mdi:play
  - square: false
    type: grid
    columns: 2
    cards:
      - type: custom:bubble-card
        card_type: button
        button_type: slider
        entity: media_player.tv_n_i_vardagsrummet_cc
        icon: mdi:google-chrome
        name: Chromecast

image
image
@caraar12345
Copy link

caraar12345 commented Sep 13, 2023 •
edited

Hey! You'll need to create a horizontal-buttons-stack card. The pop-up cards are designed to be hidden until the horizontal-buttons-stack card activates them 😄

This should do the trick ⬇️

type: custom:bubble-card
card_type: horizontal-buttons-stack
1_name: Uppfarten
1_icon: mdi:garage
1_link: '#uppfarten'

@siliconsolder
Copy link
Author

siliconsolder commented Sep 13, 2023 •
edited

Hey! You'll need to create a horizontal-buttons-stack card. The pop-up cards are designed to be hidden until the horizontal-buttons-stack card activates them 😄

Bro.. <3

Something is broken

image
image

@caraar12345
Copy link

The pop-up needs to be at the very top of the vertical stack - card position 1 - for it to turn the stack into a popup.

You'll also (probably?) need to put the horizontal-buttons-stack as a separate card directly on the dashboard (not part of the stack).

The fact that it's showing at the bottom of the screen is correct - that's where it positions itself 😄

@siliconsolder
Copy link
Author

siliconsolder commented Sep 13, 2023 •
edited

I'm clearly missing something out here.

image

type: custom:bubble-card
card_type: pop-up
hash: '#uppfarten'
name: Uppfarten
icon: mdi:garage
entity: light.uppfartsbelysningen
state: sensor.uppfarten_temperatur
state_unit: °C
width_desktop: 600px
margin_top_mobile: 18px
margin_top_desktop: 74px
is_sidebar_hidden: false

This is the card configuration where the Pop-up is at #1 position in the 'stack'

When adding the 'horizontal-buttons-stack' at top (empty) it does not change the problem :(

'''
title: blabla123
views:

  • title: Hem
    path: hem
    subview: true
    badges: []
    cards:
    • type: custom:bubble-card
      card_type: horizontal-buttons-stack
    • type: vertical-stack
      cards:
      • type: custom:bubble-card
        card_type: pop-up
        hash: '#uppfarten'
        name: Uppfarten
        icon: mdi:garage
        entity: light.uppfartsbelysningen
        state: sensor.uppfarten_temperatur
        state_unit: °C
        width_desktop: 600px
        margin_top_mobile: 18px
        margin_top_desktop: 74px
        is_sidebar_hidden: false
      • square: false
        type: grid
        columns: 3
        cards:
        • type: custom:bubble-card
          card_type: button
          entity: binary_sensor.ytterdorr_open
          name: Hallen
          icon: mdi:door
          card_mod:
          style: |
          .switch-button {
          {% if is_state(config.entity, 'on') %}
          background-color: #990000 !important
          {% else %}
          background-color: green !important
          {% endif %}
          }
      • type: custom:bubble-card
        card_type: separator
        name: Lampor
        icon: mdi:lightbulb-group
      • square: false
        type: grid
        columns: 2
        cards:
        • type: custom:bubble-card
          card_type: button
          button_type: switch
          entity: light.svampen
          name: Svampen
        • type: custom:bubble-card
          card_type: button
          button_type: switch
          entity: light.lilla_hallen
          icon: mdi:ceiling-light
        • type: custom:bubble-card
          card_type: button
          button_type: slider
          entity: light.vintagelampan
          icon: mdi:lamp-outline
          name: Vintagelampan
      • type: custom:bubble-card
        card_type: separator
        name: Mídia
        icon: mdi:play
      • square: false
        type: grid
        columns: 2
        cards:
        • type: custom:bubble-card
          card_type: button
          button_type: slider
          entity: media_player.tv_n_i_vardagsrummet_cc
          icon: mdi:google-chrome
          name: Chromecast
  • title: asdf
    path: asdf
    type: panel
    badges: []
    cards:
    • type: vertical-stack
      cards:
      • type: custom:bubble-card
        card_type: pop-up
        hash: '#psala'
        name: Uppfarten
        icon: mdi:garage
        entity: light.uppfartsbelysningen
        state: sensor.uppfarten_temperatur
        state_unit: °C
        width_desktop: 600px
        margin_top_mobile: 18px
        margin_top_desktop: 74px
        is_sidebar_hidden: false
      • square: false
        type: grid
        columns: 3
        cards:
        • type: custom:bubble-card
          card_type: button
          entity: binary_sensor.ytterdorr_open
          name: Hallen
          icon: mdi:door
          card_mod:
          style: |
          .switch-button {
          {% if is_state(config.entity, 'on') %}
          background-color: #990000 !important
          {% else %}
          background-color: green !important
          {% endif %}
          }
      • type: custom:bubble-card
        card_type: separator
        name: Lampor
        icon: mdi:lightbulb-group
      • square: false
        type: grid
        columns: 2
        cards:
        • type: custom:bubble-card
          card_type: button
          button_type: switch
          entity: light.svampen
          name: Svampen
        • type: custom:bubble-card
          card_type: button
          button_type: switch
          entity: light.lilla_hallen
          icon: mdi:ceiling-light
        • type: custom:bubble-card
          card_type: button
          button_type: slider
          entity: light.vintagelampan
          icon: mdi:lamp-outline
          name: Vintagelampan
      • type: custom:bubble-card
        card_type: separator
        name: Mídia
        icon: mdi:play
      • square: false
        type: grid
        columns: 2
        cards:
        • type: custom:bubble-card
          card_type: button
          button_type: slider
          entity: media_player.tv_n_i_vardagsrummet_cc
          icon: mdi:google-chrome
          name: Chromecast
          '''

@caraar12345
Copy link

That looks right to me 👀

@siliconsolder
Copy link
Author

That looks right to me 👀

Same for me, however when I leave the edit mode all my cards magically disappear 🚀

@caraar12345
Copy link

They should do until you click the Uppfarten button at the bottom when they should pop up 😄

@Clooos
Copy link
Owner

Clooos commented Sep 13, 2023 •
edited

That looks right to me 👀

Same for me, however when I leave the edit mode all my cards magically disappear 🚀

Yes this is a feature and not a bug, the pop-ups are hidden until you open them, the horizontal-buttons-stack must be the last card of your view and it can't be inside a pop-up.

This should work:

title: blabla123
views:
  - title: Hem
    path: hem
    subview: true
    badges: []
    cards:
      - type: vertical-stack
        cards:
           - type: custom:bubble-card
              card_type: pop-up
              hash: '#uppfarten'
              name: Uppfarten
              icon: mdi:garage
              entity: light.uppfartsbelysningen
              state: sensor.uppfarten_temperatur
              state_unit: °C
              width_desktop: 600px
              margin_top_mobile: 18px
              margin_top_desktop: 74px
              is_sidebar_hidden: false
      - type: custom:bubble-card
        card_type: horizontal-buttons-stack
        1_name: Uppfarten
        1_icon: mdi:garage
        1_link: '#uppfarten'

@Clooos Clooos added the question Further information is requested label Sep 13, 2023
@siliconsolder
Copy link
Author

Thank you, my brain started the defragmentation, more clear as of now :)

@Clooos
Copy link
Owner

Clooos commented Sep 13, 2023

You're welcome! 🥳

@Clooos Clooos closed this as completed Sep 13, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
question Further information is requested
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@caraar12345 @Clooos @siliconsolder