Add dedicated mobile navigation
This commit is contained in:
+1
-1
@@ -3,7 +3,7 @@ name: ep-reisen
|
|||||||
type: typo3
|
type: typo3
|
||||||
docroot: public
|
docroot: public
|
||||||
php_version: "7.3"
|
php_version: "7.3"
|
||||||
webserver_type: nginx-fpm
|
webserver_type: apache-cgi
|
||||||
router_http_port: "80"
|
router_http_port: "80"
|
||||||
router_https_port: "443"
|
router_https_port: "443"
|
||||||
xdebug_enabled: false
|
xdebug_enabled: false
|
||||||
|
|||||||
@@ -14,6 +14,8 @@ plugin.tx_eptheme {
|
|||||||
topNavPid =
|
topNavPid =
|
||||||
# cat=eptheme/200/110; type=string; label=Main navigation PID
|
# cat=eptheme/200/110; type=string; label=Main navigation PID
|
||||||
mainNavPid =
|
mainNavPid =
|
||||||
|
# cat=eptheme/200/115; type=string; label=Mobile navigation PID
|
||||||
|
mobileNavPid =
|
||||||
# cat=eptheme/200/120; type=string; label=Footer navigation PID
|
# cat=eptheme/200/120; type=string; label=Footer navigation PID
|
||||||
footerNavPid =
|
footerNavPid =
|
||||||
# cat=eptheme/200/130; type=string; label=Default homepage UID
|
# cat=eptheme/200/130; type=string; label=Default homepage UID
|
||||||
|
|||||||
@@ -31,6 +31,7 @@ plugin.tx_eptheme {
|
|||||||
settings {
|
settings {
|
||||||
footerNavPid = {$plugin.tx_eptheme.settings.footerNavPid}
|
footerNavPid = {$plugin.tx_eptheme.settings.footerNavPid}
|
||||||
mainNavPid = {$plugin.tx_eptheme.settings.mainNavPid}
|
mainNavPid = {$plugin.tx_eptheme.settings.mainNavPid}
|
||||||
|
mobileNavPid = {$plugin.tx_eptheme.settings.mobileNavPid}
|
||||||
topNavPid = {$plugin.tx_eptheme.settings.topNavPid}
|
topNavPid = {$plugin.tx_eptheme.settings.topNavPid}
|
||||||
legalNoticePageUid = {$plugin.tx_eptheme.settings.legalNoticePageUid}
|
legalNoticePageUid = {$plugin.tx_eptheme.settings.legalNoticePageUid}
|
||||||
termsAndConditionsPageUid = {$plugin.tx_eptheme.settings.termsAndConditionsPageUid}
|
termsAndConditionsPageUid = {$plugin.tx_eptheme.settings.termsAndConditionsPageUid}
|
||||||
|
|||||||
@@ -122,7 +122,7 @@ new Vue({
|
|||||||
this.searchBoxVisible = false;
|
this.searchBoxVisible = false;
|
||||||
},
|
},
|
||||||
toggleMobileNavigation () {
|
toggleMobileNavigation () {
|
||||||
$('#ep-navbar-burger-menu').collapse('toggle');
|
$('[data-mobile-menu]').collapse('toggle');
|
||||||
},
|
},
|
||||||
toggleAreaNavigation () {
|
toggleAreaNavigation () {
|
||||||
const $nav = $('.area-nav');
|
const $nav = $('.area-nav');
|
||||||
|
|||||||
@@ -8,7 +8,12 @@
|
|||||||
<div class="navbar-main-wrapper" :class="{ 'searchbar-fixed': searchbarFixed }">
|
<div class="navbar-main-wrapper" :class="{ 'searchbar-fixed': searchbarFixed }">
|
||||||
<nav class="container navbar navbar-default navbar-main{f:if(condition: data.tx_eptheme_hide_searchbar, then: ' navbar-main--no-searchbar')}">
|
<nav class="container navbar navbar-default navbar-main{f:if(condition: data.tx_eptheme_hide_searchbar, then: ' navbar-main--no-searchbar')}">
|
||||||
<f:render section="NavbarHeader" arguments="{_all}"/>
|
<f:render section="NavbarHeader" arguments="{_all}"/>
|
||||||
<f:render section="FirstLevel" arguments="{_all}"/>
|
<div class="hidden-xs hidden-sm">
|
||||||
|
<f:render section="FirstLevel" arguments="{navPid: settings.mainNavPid, mobile: 0}"/>
|
||||||
|
</div>
|
||||||
|
<div class="hidden-md hidden-lg">
|
||||||
|
<f:render section="FirstLevel" arguments="{navPid: settings.mobileNavPid, mobile: 1}"/>
|
||||||
|
</div>
|
||||||
<f:if condition="{data.tx_eptheme_hide_searchbar}">
|
<f:if condition="{data.tx_eptheme_hide_searchbar}">
|
||||||
<f:else>
|
<f:else>
|
||||||
<f:cObject typoscriptObjectPath="lib.searchBox"/>
|
<f:cObject typoscriptObjectPath="lib.searchBox"/>
|
||||||
@@ -20,7 +25,7 @@
|
|||||||
|
|
||||||
<f:section name="NavbarHeader">
|
<f:section name="NavbarHeader">
|
||||||
<div class="navbar-header">
|
<div class="navbar-header">
|
||||||
<a @click.prevent="toggleMobileNavigation()" type="button" class="navbar-toggle collapsed" id="navtoggle">
|
<a @click.prevent="toggleMobileNavigation()" href="#" class="navbar-toggle collapsed" id="navtoggle">
|
||||||
<span class="sr-only">Toggle navigation</span>
|
<span class="sr-only">Toggle navigation</span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
@@ -40,9 +45,9 @@
|
|||||||
</f:section>
|
</f:section>
|
||||||
|
|
||||||
<f:section name="FirstLevel">
|
<f:section name="FirstLevel">
|
||||||
<div class="collapse navbar-collapse" id="ep-navbar-burger-menu">
|
<div class="collapse navbar-collapse"{f:if(condition: mobile, then: ' data-mobile-menu')}>
|
||||||
<ul class="nav navbar-nav">
|
<ul class="nav navbar-nav">
|
||||||
<v:menu pageUid="{settings.mainNavPid}" entryLevel="1" useShortcutUid="true">
|
<v:menu pageUid="{navPid}" entryLevel="1" useShortcutUid="true">
|
||||||
<f:for each="{menu}" as="topitem" iteration="outerIteration">
|
<f:for each="{menu}" as="topitem" iteration="outerIteration">
|
||||||
<li class="dropdown">
|
<li class="dropdown">
|
||||||
<f:if condition="{topitem.hasSubPages}">
|
<f:if condition="{topitem.hasSubPages}">
|
||||||
|
|||||||
Reference in New Issue
Block a user