NeoAnd/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2025-07-23 17:08:41 -06:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

#6797: Fix initial sidenav handling on smaller screens

Browse Source
This commit is contained in:
Matt 2021-08-05 09:35:36 -07:00
parent da67a35328
commit 7608ee8450
1 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
netbox/templates/base/base.html
View File

@ -80,20 +80,25 @@
{# Additional <head> content #} {# Additional <head> content #}
{% block head %}{% endblock %} {% block head %}{% endblock %}
</head> </head>
<body> <body>
<script type="text/javascript"> <script type="text/javascript">
(function() { (function() {
// Check localStorage to see if the sidebar should be pinned. // Check localStorage to see if the sidebar should be pinned.
var sideNavRaw = localStorage.getItem('netbox-sidenav'); var sideNavRaw = localStorage.getItem('netbox-sidenav');
// Determine if the device has a small screeen. This media query is equivalent to
// bootstrap's media-breakpoint-down(lg) breakpoint mixin, which is what the sidenav's
// CSS uses.
var isSmallScreen = window.matchMedia('(max-width: 991.98px)').matches;
if (typeof sideNavRaw === 'string') { if (typeof sideNavRaw === 'string') {
var sideNavState = JSON.parse(sideNavRaw); var sideNavState = JSON.parse(sideNavRaw);
if (sideNavState.pinned === true) { if (sideNavState.pinned === true && !isSmallScreen) {
// If the sidebar should be pinned, set the appropriate body attributes prior to the // If the sidebar should be pinned and this is not a small screen, set the appropriate
// rest of the content rendering. This prevents jumpy/glitchy behavior on page reloads. // body attributes prior to the rest of the content rendering. This prevents
// jumpy/glitchy behavior on page reloads.
document.body.setAttribute('data-sidenav-pinned', ''); document.body.setAttribute('data-sidenav-pinned', '');
document.body.setAttribute('data-sidenav-show', ''); document.body.setAttribute('data-sidenav-show', '');
} else if (sideNavState.pinned === false) { } else {
document.body.setAttribute('data-sidenav-hidden', ''); document.body.setAttribute('data-sidenav-hidden', '');
} }
} }