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.

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

Fixes for smaller screen #18

Closed
wants to merge 4 commits into from
Closed

Fixes for smaller screen #18

wants to merge 4 commits into from

Conversation

samuel9554
Copy link
Contributor

@samuel9554 samuel9554 commented Aug 30, 2023

Some fixes the smaller devices screen with the separator.
Z-index fix.

I also decided to put a max-width and clip the overflow.

#root.open-pop-up > * {
    /* Block child items to overflow and if they do clip them */
    max-width: calc(100vw - 38px);
    overflow-x: clip;
  }

src/bubble-card.js Outdated Show resolved Hide resolved
@Clooos
Copy link
Owner

Clooos commented Sep 4, 2023

Hi, I've added some of your modifications to the new beta, but some are creating new bugs:

  • z-index: 9999 is hidding the more info panel (so I've changed it to 1, it's the max value to don't hide it).
  • I've also changed the code for the :before in the footer

But thanks a lot for helping me!

@Clooos Clooos closed this Sep 4, 2023
@samuel9554
Copy link
Contributor Author

Yes i did realize that the z-index was blocking the info panel.

Most important will be to menage the content to go pass the width of the device.
I did a lot of testing and this seem to be working nicely.

#root.open-pop-up > * {
                  /* Block child items to overflow and if they do clip them */
                  max-width: calc(100vw - 38px);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants