light-bootstrap-dashboard icon indicating copy to clipboard operation
light-bootstrap-dashboard copied to clipboard

[Bug] Sidebar and Navbar problem when shrinking window

Open lukednguyen opened this issue 5 years ago • 3 comments

Version

2.0.1

Reproduction link

https://github.com/creativetimofficial/light-bootstrap-dashboard

Operating System

Windows 10

Device

Laptop

Browser & Version

Firefox 68.0

Steps to reproduce

Sorry for the link, but this can be reproduce by just downloading the package and run the example files

  1. Open the dashboard to any size
  2. Shrink the window so that sidebar disappears
  3. Zoom the window back to the original state

What is expected?

  1. Unchanged sidebar
  2. Items in dropdowns stay under dropdowns (when shrinked)

What is actually happening?

  1. Sidebar now filled with links from navbar
  2. Items in dropdowns scroll with the page (when shrinked)

Solution

Additional comments

lukednguyen avatar Jul 05 '19 17:07 lukednguyen

To solve this issue , open your light-bootstrap-dashboard.js file and replace following on line 60 , $(window).resize(function () { if ($(window).width() <= 991) { lbd.initRightMenu(); } } with following code, // activate collapse right menu when the windows are resized $(window).resize(function () { if ($(window).width() <= 991) { lbd.initRightMenu(); } else { // reset all the additions that we made for the sidebar wrapper only if the screen is bigger than 991px $sidebar_wrapper.find('.navbar-form').remove(); $sidebar_wrapper.find('.nav-mobile-menu').remove(); mobile_menu_initialized = false; } });

Reply to me whether it worked or not. Worked perfectly for me.

sabine33 avatar Jul 20 '19 17:07 sabine33

nope the issue still exist

alshoja avatar Oct 28 '19 07:10 alshoja

To solve this issue , open your light-bootstrap-dashboard.js file and replace following on line 60 , $(window).resize(function () { if ($(window).width() <= 991) { lbd.initRightMenu(); } } with following code, // activate collapse right menu when the windows are resized $(window).resize(function () { if ($(window).width() <= 991) { lbd.initRightMenu(); } else { // reset all the additions that we made for the sidebar wrapper only if the screen is bigger than 991px $sidebar_wrapper.find('.navbar-form').remove(); $sidebar_wrapper.find('.nav-mobile-menu').remove(); mobile_menu_initialized = false; } });

Reply to me whether it worked or not. Worked perfectly for me.

Worked. Thanks

Jeromesciortino avatar Aug 06 '21 15:08 Jeromesciortino