Options
Sidebar Size CSS
Alex_Marsh
Premier Partner Advanced IT Monkey ✭✭✭
I've made the sidebar a little bigger (100px) in the CSS to cope with the increased text size required, however when the subpanel appears it is slightly behind the bigger sidebar. I can see from monitoring the css with the dev tools that the panel hides when not selected and appears at a position of 80px from the left when it appears. How can I go about adjusting this?
Hope that makes sense!
Hope that makes sense!
0
Best Answer
-
Options
Martin_Blomgren
Customer Ninja IT Monkey ✭✭✭✭
There are two ways to accomplish this!
1. Use custom CSS, with this alternative you have tor animate the smooth flyout animation when the subpanel appears..nav_trigger.nav_open .sub_panel {<br> animation: movesubpanel 0.2s linear forwards;<br>}<br><br>@keyframes movesubpanel {<br> from { left: -220px; }<br> to { left: 100px; }<br>}
2. Use custom JS and overwrite the standard function which returns the sidebar width. Probably not supported, however it's easy to disable if you encounter problems of any sort!$(document).ready(function (){<br> app.getSideNavWidth = function(){ return 100 }<br>}
6
Answers
1. Use custom CSS, with this alternative you have tor animate the smooth flyout animation when the subpanel appears.
.nav_trigger.nav_open .sub_panel {<br> animation: movesubpanel 0.2s linear forwards;<br>}<br><br>@keyframes movesubpanel {<br> from { left: -220px; }<br> to { left: 100px; }<br>}2. Use custom JS and overwrite the standard function which returns the sidebar width. Probably not supported, however it's easy to disable if you encounter problems of any sort!
$(document).ready(function (){<br> app.getSideNavWidth = function(){ return 100 }<br>}