Hide empty subnavigations and their buttons in mobile view

This commit is contained in:
Björn Fromme
2021-10-26 17:46:50 +02:00
parent 32de49bfc2
commit 01d19d900e
@@ -124,27 +124,31 @@
title="{subitem.title}">
{subitem.title}
</a>
<button type="button"
class="focus:outline-none"
data-action="collapse#toggle">
<svg class="h-6 w-6 transform text-white" data-collapse-target="icon">
<use href="#icon-chevron-down"></use>
</svg>
</button>
</div>
<div class="transform pt-2"
data-collapse-target="container">
<f:for each="{subitem.children}" as="subsubitem">
<a href="{subsubitem.link}"{f:if(condition: '{subsubitem.data.doktype} == 3', then: ' _target="blank"')}
class="flex items-center space-x-2 text-lg leading-loose text-white hover:text-white focus:text-white"
title="{subsubitem.title}">
<svg class="w-4 h-4 text-white">
<use href="#icon-chevron-right"></use>
<f:if condition="{subitem.children}">
<button type="button"
class="focus:outline-none"
data-action="collapse#toggle">
<svg class="h-6 w-6 transform text-white" data-collapse-target="icon">
<use href="#icon-chevron-down"></use>
</svg>
<span>{subsubitem.title}</span>
</a>
</f:for>
</button>
</f:if>
</div>
<f:if condition="{subitem.children}">
<div class="transform pt-2"
data-collapse-target="container">
<f:for each="{subitem.children}" as="subsubitem">
<a href="{subsubitem.link}"{f:if(condition: '{subsubitem.data.doktype} == 3', then: ' _target="blank"')}
class="flex items-center space-x-2 text-lg leading-loose text-white hover:text-white focus:text-white"
title="{subsubitem.title}">
<svg class="w-4 h-4 text-white">
<use href="#icon-chevron-right"></use>
</svg>
<span>{subsubitem.title}</span>
</a>
</f:for>
</div>
</f:if>
</li>
</f:for>
</ul>