Git Product home page Git Product logo

Comments (10)

nelsonamen avatar nelsonamen commented on May 20, 2024

On mobile works
On fully Kiosk browser dont

from bubble-card.

nelsonamen avatar nelsonamen commented on May 20, 2024

how i can change the part of the root?

type: custom:bubble-card
card_type: pop-up
hash: '#todasluzes'
state: sensor.luzesligadas
icon: mdi:lightbulb-group
name: ' '
margin_top_mobile: 0px
entity: null
width_desktop: 100%
card_mod:
style:
.: |

  ha-card {
    margin-top: 0 !important;
    background: none !important;
    border: none !important;
  }
  .card-content {
    width: 100% !important;
    padding: 0 !important;
  }

  @media only screen and (min-width: 870px)
  
  #root {
      top: calc(100% + 0px + 54px);
      width: calc(100% -92px) !important;
      left: calc(50% - 50% + 0px);
      margin: 0 !important;
  }

from bubble-card.

dsellers1 avatar dsellers1 commented on May 20, 2024

Wanted to throw this in here since it might be related. I noticed the popup at 90% appears under the sidebar when it is expanded.
Windows 11, Firefox 116.0, window sizes: 2560x1440 and 1480x1440.
firefox_QgeKQhtPNE
I removed the card_modded monstrosity in the screenshot just in case that was somehow messing with it but the results were the same.

When set to 100%, the popup expands up to the collapsed sidebar which could be the area that @nelsonamen showed in his screenshot. Changing to 110% does expand the popup under the collapsed sidebar but then it also pushes the close button off the screen. Attempting to change the z-index of the vertical-stack card via card mod does not bring the popup over the sidebar.

from bubble-card.

nelsonamen avatar nelsonamen commented on May 20, 2024

width: calc(100% -92px) !important;

  • 92px to 0 on the chrome inspector works
    How to do this on card mod?

from bubble-card.

samuel9554 avatar samuel9554 commented on May 20, 2024

I think PR #18 could fix this one.

from bubble-card.

Clooos avatar Clooos commented on May 20, 2024

Hi, this is fixed in the new beta with a is_sidebar_hidden variable that can be true or false.

from bubble-card.

nelsonamen avatar nelsonamen commented on May 20, 2024

👍

from bubble-card.

nelsonamen avatar nelsonamen commented on May 20, 2024

@Clooos is there a new problem but with right side?

IMG_20230930_012257
IMG_20230930_012309

from bubble-card.

Clooos avatar Clooos commented on May 20, 2024

Indeed! This issue will be fixed in the next beta.

from bubble-card.

Clooos avatar Clooos commented on May 20, 2024

This is now fixed in beta 11 :
https://github.com/Clooos/Bubble-Card/releases/tag/v0.0.1-beta.11

from bubble-card.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.