diff --git a/locale.xml b/locale.xml
index 3705ebbf60f0c854a79f1e9aad530a879d84c611..9ca23ccf52d5a65773d698db848a21b1af449d3c 100644
--- a/locale.xml
+++ b/locale.xml
@@ -72,6 +72,14 @@
<de><![CDATA[Erweitertes Slideout Menü]]></de>
<en><![CDATA[Advanced Slideout Menu]]></en>
</locale>
+ <locale name="mobileMenu.settings.breakPoint">
+ <de><![CDATA[Zum Mobile-Menu wechseln ab]]></de>
+ <en><![CDATA[Switch to mobile menu after]]></en>
+ </locale>
+ <locale name="mobileMenu.settings.breakPoint.desc">
+ <de><![CDATA[Wert, bei dessen Unterschreitung das Menü in die mobile Version wechselt (Standardwert ist <strong>767</strong>). Diese Angabe bezieht sich auf die Monitorgröße gemessen in Pixel.]]></de>
+ <en><![CDATA[Value below which the menu will switch to the mobile version (default value is <strong>767</strong>). This specification refers to the monitor size measured in pixels.]]></en>
+ </locale>
<!-- mobile menu standard -->
<locale name="mobileMenu.standard.settings.title">
diff --git a/settings.xml b/settings.xml
index 9be59eb2c653f726c2934630b90c2cdca27d272b..1adf440faa7fba18b599ac3199b3b37305b5a3d9 100644
--- a/settings.xml
+++ b/settings.xml
@@ -18,6 +18,10 @@
<type><![CDATA[string]]></type>
<defaultvalue>slideout</defaultvalue>
</conf>
+ <conf name="breakPoint">
+ <type><![CDATA[number]]></type>
+ <defaultvalue>767</defaultvalue>
+ </conf>
</section>
<section name="mobileMenu.standard.settings">
<conf name="collapseSubmenu">
@@ -27,7 +31,7 @@
<type><![CDATA[number]]></type>
<defaultvalue>1</defaultvalue>
</conf>
- </section>
+ </section>`
<section name="mobileMenu.slideoutAdvanced.settings">
<conf name="homeLink">
<type><![CDATA[number]]></type>
@@ -102,6 +106,14 @@
<locale group="quiqqer/menu" var="mobileMenu.settings.template.slideoutAdvanced"/>
</option>
</select>
+ <input conf="mobileMenu.settings.breakPoint" type="number" min="0" max="5000">
+ <text>
+ <locale group="quiqqer/menu" var="mobileMenu.settings.breakPoint"/>
+ </text>
+ <description>
+ <locale group="quiqqer/menu" var="mobileMenu.settings.breakPoint.desc"/>
+ </description>
+ </input>
</settings>
<!-- mobile menu standard -->
diff --git a/src/QUI/Menu/MegaMenu.Independent.html b/src/QUI/Menu/MegaMenu.Independent.html
index cb3b549a63b73bfed359c077b666d45926a4e29f..e1aef65ded1d6d248058f4239b0b0268deea9842 100644
--- a/src/QUI/Menu/MegaMenu.Independent.html
+++ b/src/QUI/Menu/MegaMenu.Independent.html
@@ -1,4 +1,19 @@
-<nav class="hide-on-mobile">
+<style>
+ @media screen and (max-width: {$breakPoint}px) {
+ .megaMenu-hide-on-mobile {
+ display: none !important;
+ }
+ }
+
+ @media screen and (min-width: {$breakPoint + 1}px) {
+ .megaMenu-hide-on-desktop {
+ display: none !important;
+ }
+ }
+</style>
+
+<nav class="megaMenu-hide-on-mobile">
+
{$prepend}
<ul class="quiqqer-menu-megaMenu-list">
@@ -61,7 +76,7 @@
{$append}
</nav>
{if $Mobile}
- <div class="hide-on-desktop">
+ <div class="megaMenu-hide-on-desktop">
{$prepend}
<div class="quiqqer-menu-megaMenu-mobile">
diff --git a/src/QUI/Menu/MegaMenu.css b/src/QUI/Menu/MegaMenu.css
index 8d613896b75205766a90b77e25f7694bd463c04e..5bf901b502fec289bee6aea6b77a0ace383fe105 100644
--- a/src/QUI/Menu/MegaMenu.css
+++ b/src/QUI/Menu/MegaMenu.css
@@ -5,7 +5,7 @@
width: 100%;
}
-.quiqqer-menu-megaMenu .hide-on-desktop {
+.quiqqer-menu-megaMenu .megaMenu-hide-on-desktop {
width: 100%;
}
@@ -40,8 +40,6 @@
width: 100%;
}
-
-
/** sub menu data
================================================= */
diff --git a/src/QUI/Menu/MegaMenu.html b/src/QUI/Menu/MegaMenu.html
index 7994416da5bf0993e669f84fe115656fb5fbfad4..38dd6a946115fd940aaab3e24df6bc405ead513f 100644
--- a/src/QUI/Menu/MegaMenu.html
+++ b/src/QUI/Menu/MegaMenu.html
@@ -1,4 +1,19 @@
-<nav class="hide-on-mobile">
+<style>
+ @media screen and (max-width: {$breakPoint}px) {
+ .megaMenu-hide-on-mobile {
+ display: none !important;
+ }
+ }
+
+ @media screen and (min-width: {$breakPoint + 1}px) {
+ .megaMenu-hide-on-desktop {
+ display: none !important;
+ }
+ }
+</style>
+
+<nav class="megaMenu-hide-on-mobile">
+
{$prepend}
<ul class="quiqqer-menu-megaMenu-list">
@@ -55,7 +70,7 @@
{$append}
</nav>
{if $Mobile}
-<div class="hide-on-desktop">
+<div class="megaMenu-hide-on-desktop">
{$prepend}
<div class="quiqqer-menu-megaMenu-mobile">
diff --git a/src/QUI/Menu/MegaMenu.php b/src/QUI/Menu/MegaMenu.php
index 01e9227e05fa3ef86373727f37c72326730b8ec3..db6eb753b52438b3b21f96c551a6a0fbc5008bc0 100644
--- a/src/QUI/Menu/MegaMenu.php
+++ b/src/QUI/Menu/MegaMenu.php
@@ -44,6 +44,7 @@ public function __construct($attributes = [])
'showLevel' => 1,
'showHomeLink' => false,
'showShortDesc' => false,
+ 'breakPoint' => 767
]);
if ($this->getProject()->getConfig('menu.settings.type')) {
@@ -151,6 +152,15 @@ public function getBody()
$this->setAttribute('data-qui-options-enablemobile', $this->getAttribute('enableMobile') ? 1 : 0);
$this->setAttribute('data-qui-options-showmenuafter', $showMenuDelay);
+ $breakPoint = intval($this->getProject()->getConfig('mobileMenu.settings.breakPoint'));
+
+ if (!$breakPoint) {
+ $breakPoint = intval($this->getAttribute('breakPoint'));
+ }
+
+ if ($breakPoint < 1) {
+ $breakPoint = 767;
+ }
if ($this->getAttribute('menuId')) {
$IndependentMenu = Independent\Handler::getMenu($this->getAttribute('menuId'));
@@ -164,12 +174,12 @@ public function getBody()
'prepend' => $this->prepend,
'append' => $this->append,
'childControl' => $childControl,
- 'showMenu' => true
+ 'showMenu' => true,
+ 'breakPoint' => $breakPoint
]);
- $result = [];
- $result['html'] = $Engine->fetch(dirname(__FILE__).'/MegaMenu.Independent.html');
- $result['subMenus'] = \array_unique($this->subMenus);
+ $result = [];
+ $result['html'] = $Engine->fetch(dirname(__FILE__).'/MegaMenu.Independent.html');
} else {
$Engine->assign([
'this' => $this,
@@ -183,18 +193,20 @@ public function getBody()
'prepend' => $this->prepend,
'append' => $this->append,
'childControl' => $childControl,
- 'showMenu' => true
+ 'showMenu' => true,
+ 'breakPoint' => $breakPoint
]);
if ($this->getProject()->getConfig('menu.settings.type') == 'noMenu') {
$Engine->assign('showMenu', false);
}
- $result = [];
- $result['html'] = $Engine->fetch(dirname(__FILE__).'/MegaMenu.html');
- $result['subMenus'] = \array_unique($this->subMenus);
+ $result = [];
+ $result['html'] = $Engine->fetch(dirname(__FILE__).'/MegaMenu.html');
}
+ $result['subMenus'] = \array_unique($this->subMenus);
+
QUI\Cache\Manager::set($cache, $result);
return $result['html'];
diff --git a/src/QUI/Menu/SlideOutAdvanced.css b/src/QUI/Menu/SlideOutAdvanced.css
index 26558d7d5e9ea243cf4f4830aecf26e2925c047f..53633124fc18c4f7e2126a66961edf5aaf53d34f 100755
--- a/src/QUI/Menu/SlideOutAdvanced.css
+++ b/src/QUI/Menu/SlideOutAdvanced.css
@@ -103,18 +103,6 @@
/** page navigation -> mobile
* ========================================================== */
-@media screen and (max-width: 767px) {
- .hide-on-mobile {
- display: none !important;
- }
-}
-
-@media screen and (min-width: 768px) {
- .hide-on-desktop {
- display: none !important;
- }
-}
-
.page-menu .quiqqer-slideoutAdvanced-page-navigation-level-1 {
position: initial;
display: block;