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

navbar-expand appears inconsistently #133

Open
4 tasks done
4levels opened this issue Jul 6, 2018 · 1 comment
Open
4 tasks done

navbar-expand appears inconsistently #133

4levels opened this issue Jul 6, 2018 · 1 comment

Comments

@4levels
Copy link

4levels commented Jul 6, 2018

Prerequisites

Please answer the following questions for yourself before submitting an issue.

  • I am running the latest version
  • I checked the documentation and found no answer
  • I checked to make sure that this issue has not already been filed
  • I'm reporting the issue to the correct repository (for multi-repository projects)

Expected Behavior

Navbar's navbar-expand-* breakpoint should be respected

Current Behavior

The navbar always toggles on the lg breakpoint, so if a different breakpoint is set by using eg. navbar-expand-sm (instead of the default navbar-expand-lg), the navbar still collapses on the lg breakpoint, leaving it unusable between the desired breakpoint and the lg breakpoint. When reaching the desired breakpoint, all looks good again

Failure Information (for bugs)

This seems to be an existing bug and was already fixed in the pro version 2.0.3, just a I found out in this issue: creativetimofficial/ct-material-kit-pro#75
Since the pro version is an empty repo, I cannot apply the fix myself

Steps to Reproduce

  1. Copy the sample code from the navbar section
  2. Adjust the navbar-expand-lg class to any other breakpoint, eg. -sm, -md, -xs
  3. Resize the browser window untill you cross the -lg breakpoint
  4. The navbar is now unusable between the lg breakpoint and the chosen breakpoint
  5. When resizing futher and reaching the desired breakpoint, all looks good again

Context

  • Device: HP Probook G3
  • Operating System: ElementaryOS - Ubuntu 16.04 LTS
  • Browser and Version: Chromium Version 66.0.3359.181 (Official Build) Built on Ubuntu , running on elementary 0.4.1 (64-bit)

Failure Logs

I can provide screenshots if needed, but this issue is so obvious and so easy to reproduce, please ask if needed

@4levels
Copy link
Author

4levels commented Jul 6, 2018

Hi,

after some digging around, I found that the offending media rule seems to be in material-design.css:12345, where regardless of the container's navbar-expand-* class, the navbar is being hidden by the @media all and (max-width: 991px) { statement on line 12329
I tried adjusting this, but this seems a bit out of my leage as there is a lot going on in that section..
When comparing to the regular boostrap media queries, they seem to be using @media min-width: xxx for each expanding class instead of the max-width.
Hope this is a quick fix for you guys as this has apparently already been resolved in the Pro version..

Kind regards,

Erik

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

No branches or pull requests

2 participants