Neu Custom Breakpoint mobile Navigation

[omed]

Hallo zusammen,

wir verwenden das Nova Theme. Im Standard springt das Mobile-Menü ja bei 992px an. Wir würden gerne schon bei 1092px starten. CSS-technisch haben wir es schon soweit umgebaut und einige eigene Media Queries gesetzt, allerdings stehen jetzt einige container vermutlich per javascript >992px noch auf "disabled".

Gibt es eine saubere Lösung das "Anspringen" des Mobile Menus zu definieren ohne CSS Stückwerk zu basteln? In den Variablen habe ich den md Breakpoint bereits auf 1092px geändert, das scheint aber nicht wirklich etwas zu ändern.

Ich wäre dankbar, wenn mir jemand weiterhelfen könnte!

 

[MHillmann]

Hallo,

es werden auf jeden Fall auch im Javascript nochmal breakpoints definiert, in der Datei NOVA/js/app/globals.js
Ich habe jetzt aber nicht probiert ob es schon reicht die Zahl dort zu ändern.
Diese Variable wird auf jeden Fall benutzt um an ein paar stellen auf isMobile zu prüfen (NOVA/js/app/helpers.js):

export let isMobile = () => window.innerWidth < globals.breakpoints.lg

Viele Grüße
Michael

 

[webksde]

Da hast du Recht, die werden dort auch definiert:

export const breakpoints = {
  xl: 1680,
  lg: 1100,
  md: 768,
  sm: 576
};

Nur leider scheint sich die Datei im Template nicht überschreiben zu lassen :/

<JS Name="jtl3.js">
    <File Path="js/app/globals.js" override="true" />
</JS>

Nach Cache clear weiterhin /templates/NOVA/js/app/globals.js

Die globals.js aus dem custom theme wird einfach als weiterer JS File ergänzt und da breakpoints eine Konstante ist auch nicht überschreibbar.
Übersehe ich etwas?

Edit:

Ja, ich habe tatsächlch etwas übersehen breakpoints ist zwar eine Konstante, aber das spielt keine Rolle, in window.globals lässt sich das Ganze ja überschreiben.
Folgendermaßen klappt es (mit einer eigenen globals_custom.js):

const customBreakpoints = {
  xl: 1680,
  lg: 1100,
  md: 768,
  sm: 576
};
window.globals = {
  breakpoints: customBreakpoints
};

Was allerdings offenbar nichts bringt, weil die Nova Scripts vorher initialisiert werden.. mit den default Nova Werten.

Entsprechend ist die "Lösung" aktuell: Friss oder stirb? Mit den default Breakpoints leben, oder das halbe Nova JS im Custom Theme neu implmentieren?