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

md-snackbar not showing above drawer in documentation #1134

Closed
lucasfernog opened this issue Nov 14, 2017 · 4 comments
Closed

md-snackbar not showing above drawer in documentation #1134

lucasfernog opened this issue Nov 14, 2017 · 4 comments
Assignees
@marcosmoura
Labels
needs repro

Comments

@lucasfernog
Copy link

screenshot from 2017-11-14 08-12-46

Steps to reproduce

Access https://vuematerial.io/components/snackbar, choose Left position snackbar and open it.

Which browser?

Firefox 56.0
Ubuntu 17.04

What is expected?

Snackbar above everything, including drawer.

What is actually happening?

Navigation drawer is covering the snackbar.

Reproduction Link

https://vuematerial.io/components/snackbar
@marcosmoura
Copy link
Member

@lucasfernog This is really strange. I just tested it on mac, with this exactly same version. I will try to boot in a Linux env to take a look at this. Can you test it again?

@marcosmoura marcosmoura self-assigned this Nov 14, 2017
@lucasfernog
Copy link
Author

Testing with latest Firefox and Arch Linux, I found the steps to reproduce the error:
1- Open the snackbar docs page.
2- Open a centered snackbar and wait for the auto dismiss.
3- Open a left-position snackbar. It will be shown below the drawer.

It could be a caching position problem, but it's weird because it didn't happen with Chromium. I can debug it with the source code tomorrow.

@Samuell1
Copy link
Member

Samuell1 commented Dec 1, 2017 •
edited
Loading

Looks like removing z-index from main-nav fix this issue for Firefox, but it can add some new issues with overflowing.

Samuell1 added a commit that referenced this issue Dec 5, 2017
@Samuell1
docs: remove z-index from main-nav (#1134)
7c7d0d8
@Samuell1 Samuell1 mentioned this issue Dec 5, 2017
Merged
@Samuell1 Samuell1 closed this as completed Dec 6, 2017
marcosmoura pushed a commit that referenced this issue Dec 19, 2017
@Samuell1 @marcosmoura
fix: z-index issues (#1264)
843056d 
* feat(MdCard): remove z-index to prevent card overlap FAB

* fix(MdSelect): fix select content under dialog

* refactor(MdSelect): change order of scss

* docs: remove z-index from main-nav (#1134)

* Revert "feat(MdCard): remove z-index to prevent card overlap FAB"

This reverts commit 9e12806.

* feat(MdButton): add fab z-index to prevent overlap
@funder7
Copy link

funder7 commented Nov 29, 2019

Hi,
I'm sorry but I'm out of time now and I cannot open a new issue for a problem similar to this one.
The problem is that I have added an external date picker, as the included one unfortunately is lacking a feature that I need (datetime range).

I've included this picker inside a card content, but when the calendar shows, it appears behind the card content. I've tried to increase its z-index, and other various fixes, but I had not luck.

The only solution that appears to be working, is to completely remove the z-index property attached to the md-card element which contains the datepicker input.

The page is still at a inital stage, I don't exclude at 100% some markup problems, but I wanted to point this out just to don't forget. Maybe in future I will check in for updates, if the problem gets solved by let's say, fixing the page markup.

bye :-)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@marcosmoura marcosmoura

Labels
needs repro
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@marcosmoura @Samuell1 @funder7 @lucasfernog