Issues with sidebar-mini & sidebar-expanded-on-hover

This public forum is for user-to-user discussions of PHPMaker. Note that this is not support forum.

Issues with sidebar-mini & sidebar-expanded-on-hover

Postby kirondedshem » Fri Oct 20, 2017 2:04 pm

I have put icons on medu items
I have enable mini sidebar by adding sidebar-mini class to the body in specific list page startup scripts.
$("body").addClass("sidebar-mini"); // Enable mini sidebar
In some cases I also add sidebar-collapse so that the navbar comes collapsed already.
$("body").addClass("sidebar-mini sidebar-collapse"); // Enable mini sidebar

The issue with this is I have menu items which have sub items under them and when the side bar is collapsed, I can hover over the parent item icon and It displays the tree on the right.
BUT when i move my mouse to the right to click on an item down the tree, the hovered tree disappers very fast.

SO Ive gone to the official Admin LTE template and tested out the collapsed mini sibar and I saw when you hover over the the parent item icon, the sub items tree dispalys as well but you can smoothly move your moue over the sub items ans still eb able to click on them while navbar is till collapsed.

So am I missing something here or is the admin lte misbehaving somehow, or are there some tweaks I can do to fix this.

As an alternative, I saw that Admin LTE supports sidebar-expanded-on-hover, I tried to add this class to the mini sidebar hopint ot atleast get the menu to uncollapse briefly when a user hovers over my parent item so they can select a child item and it collapses back automatically like it is in ADmin LTE template, but This seems not to work as exepected.

SO can someone also tell me how to use sidebar-expanded-on-hover with mini side bar, coz sems adding the class to the body wont do the trick.
kirondedshem
 
Posts: 313
Joined: Sat Jan 28, 2017 7:13 pm

Re: Issues with sidebar-mini & sidebar-expanded-on-hover

Postby sangnandar » Sat Oct 21, 2017 1:03 pm

Do you see a gap between submenus? If you do, then the submenus collapsed because your mouse hover on that gap.
To fix this set your font larger than 15px.
sangnandar
 
Posts: 283
Joined: Mon Sep 19, 2016 2:04 am

Re: Issues with sidebar-mini & sidebar-expanded-on-hover

Postby kirondedshem » Sat Oct 21, 2017 3:49 pm

thank, yo right the gap is whats causing it, when i hover over the gap the menu disappears.
I had my font set to 12.When I set my font to 16 the menu gap disappeared and now when i hover it wont disappear anymore.

Problem is I have some long menu captions which were fitting nicely with font 12 and 13 for example names like "Today's offline Outlets", "Mobile money agents" as sub menus, Now with font 16 they are overflowing the menu area.
kirondedshem
 
Posts: 313
Joined: Sat Jan 28, 2017 7:13 pm

Re: Issues with sidebar-mini & sidebar-expanded-on-hover

Postby kirondedshem » Sat Oct 21, 2017 7:27 pm

for now what ive done is rethink my menu titles to be alittle short, that way they wont overflow the edefault menu width
kirondedshem
 
Posts: 313
Joined: Sat Jan 28, 2017 7:13 pm

Re: Issues with sidebar-mini & sidebar-expanded-on-hover

Postby jjancel » Fri Jan 12, 2018 9:40 pm

Change the first level of the menu
in HTML/Styles/User
with
.sidebar-menu{ font-size: 15px; }
jjancel
 
Posts: 3
Joined: Mon Nov 24, 2014 7:58 pm


Return to General Discussion (PHPMaker)