Nav links not working with (responsive) drawer layout about angular-material-design-lite

[jadjoubran]

Is that an issue with MDL itself?
Can you please post a working plnkr

[benoror]

I think you're right, it might be an MDL issue

[jadjoubran]

I originally got it from this template here: http://www.getmdl.io/templates/text-only/index.html

But apparently the drawer functionality is not there anymore.

So I just updated gh-pages to make it work just like they did. But you have to enable mobile view and choose android or ios then refresh for it to work. I don't know why this is necessary for it to work.. but this is also the case on their website

The commit can help you: 3fe75c8

Let me know if it fixes it for you :D

[benoror]

Hi Jad, thanks for the response.

Actually I don't see the drawer anymore, but I can't see the top navbar either:

[jadjoubran]

Yes, if I'm not mistaken, the same happens in the Material Design Lite template.

You need to open your Chrome dev tools and select Mobile emulation and choose a device then refresh the page.

Let me know if it works with you. And you can try it again on the demo to see if it's from the MDL library

[benoror]

It works that way, but shouldn't it be responsive when simply resizing the browser (viewport)?

Sorry for the inconvenience, I'm not a CSS expert. You can close the issue, thanks!

[jadjoubran]

No worries I'd love to help!

And usually, responsive is when you simply resize the browser/viewport. But I guess it's not the case even here right?

Give it a try. If it doesn't work, then maybe we can open a bug on MDL's main github repository:

http://www.getmdl.io/templates/text-only/index.html

[jadjoubran]

@benoror did you try it? :D

[benoror]

Sorry for the delay, I'm on holidays. Both examples worked fine on mobile
emulation. But your example didn't work when resizing the browser, as you
can see in the screenshot.

Kind regards!

On Fri, Jul 17, 2015 at 2:27 PM Jad Joubran [email protected]
wrote:

@benoror https://github.com/benoror did you try it? :D

—
Reply to this email directly or view it on GitHub
#3 (comment)
.

Sent from my phone (sorry for possible typos)
Benjamin Orozco - benoror.com

[jadjoubran]

Thank you for your reply!
Yes I am aware of that. But have you tried MDL's original example when resizing the browser? Because it doesn't work for me which means it's probably a bug in MDL's library

[benoror]

As shown in the screenshot, it works for me. Am I missing something?

[jadjoubran]

Oh!!! It was still not working on my end, but as soon as I hard refreshed it started working. So apparently they released a new version or a new code that fixes it!
Thank you very much for pointing it out
I'll look into it as soon as possible

[benoror]

Nope, it looks you are using the latest version (1.0.0):

• http://jadjoubran.github.io/angular-material-design-lite/bower_components/material-design-lite/material.min.css
• https://desolate-fjord-7338.herokuapp.com/js/material.min.js

Seems more like an implementation issue imho

[jadjoubran]

Fixed! It turned out to be a z-index problem.
Thank you very much for pointing it out and sorry it took so long to be resolved.

Feel free to open a new issue anytime!