mirror of
https://github.com/netbox-community/netbox.git
synced 2025-07-23 17:08:41 -06:00
#6797: Fix initial sidenav handling on smaller screens
This commit is contained in:
parent
da67a35328
commit
7608ee8450
@ -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', '');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user