Procházet zdrojové kódy

refactor(ui): Use matchMedia for desktop breakpoint detection

Replace hardcoded width check with Bootstrap's lg breakpoint (992px)
using matchMedia API. Adds constant with comment linking to navbar
configuration for maintainability.
Martin Hauser před 1 týdnem
rodič
revize
105e58a433

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 0
netbox/project-static/dist/netbox.js


Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 0
netbox/project-static/dist/netbox.js.map


+ 4 - 1
netbox/project-static/src/sidenav.ts

@@ -4,6 +4,9 @@ import { getElements, isElement } from './util';
 type NavState = { pinned: boolean };
 type BodyAttr = 'show' | 'hide' | 'hidden' | 'pinned';
 
+// Keep in sync with Bootstrap's `lg` breakpoint and `navbar-expand-lg` in base/layout.html.
+const SIDENAV_DESKTOP_MEDIA = '(min-width: 992px)';
+
 class SideNav {
   /**
    * Sidenav container element.
@@ -63,7 +66,7 @@ class SideNav {
       toggler.addEventListener('click', event => this.onMobileToggle(event));
     }
 
-    if (window.innerWidth >= 1200) {
+    if (window.matchMedia(SIDENAV_DESKTOP_MEDIA).matches) {
       if (this.state.get('pinned')) {
         this.pin();
       } else {

Některé soubory nejsou zobrazeny, neboť je v těchto rozdílových datech změněno mnoho souborů