mirror of
https://github.com/kevinveenbirkenbach/computer-playbook.git
synced 2025-03-26 03:03:32 +01:00
Optimized menu
This commit is contained in:
parent
9194abee4a
commit
9a30e0f49b
@ -1,36 +1,43 @@
|
||||
{% macro render_headings(headings, level=1) %}
|
||||
<ul class="toctree-l{{ level }}">
|
||||
{% for item in headings %}
|
||||
<li class="toctree-l{{ level }}{% if item.current %} current{% endif %}"
|
||||
{% if item.children %} x-data="{ expanded: false }" {% endif %}>
|
||||
<a class="reference internal{% if item.children %} expandable{% endif %}"
|
||||
href="{{ pathto(item.link).replace('#', '') }}{% if item.anchor %}#{{ item.anchor }}{% endif %}"
|
||||
{% if item.children %}
|
||||
@click.prevent="expanded = !expanded"
|
||||
:class="{ 'expanded': expanded }"
|
||||
{% endif %}>
|
||||
{{ item.text }}
|
||||
{% if item.children %}
|
||||
<button @click.prevent.stop="expanded = !expanded" type="button" class="toggle-button" style="background: none; border: none; padding: 0; margin-left: 5px;">
|
||||
<span x-show="!expanded">
|
||||
<svg fill="currentColor" height="18px" stroke="none" viewBox="0 0 24 24" width="18px" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
<span x-show="expanded">▼</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
</a>
|
||||
{% if item.children %}
|
||||
<div x-show="expanded">
|
||||
{{ render_headings(item.children, level+1) }}
|
||||
<ul class="toctree-l{{ level }}" style="list-style: none; padding-left: 0;">
|
||||
{% for item in headings %}
|
||||
<li class="toctree-l{{ level }}{% if item.current %} current{% endif %}"
|
||||
{% if item.children %} x-data="{ expanded: false }" {% endif %}
|
||||
style="white-space: nowrap;">
|
||||
<div class="menu-item" style="display: inline-flex; align-items: center; justify-content: space-between; width: 100%; white-space: nowrap;">
|
||||
<!-- Link- und "Datei öffnen"-Bereich -->
|
||||
<div style="display: inline-flex; align-items: center; white-space: nowrap;">
|
||||
<a class="reference internal{% if item.children %} expandable{% endif %}"
|
||||
href="{{ pathto(item.link).replace('#', '') }}{% if item.anchor %}#{{ item.anchor }}{% endif %}"
|
||||
style="text-decoration: none; white-space: nowrap;">
|
||||
{{ item.text }}
|
||||
</a>
|
||||
</div>
|
||||
<!-- Expand-Toggle-Button -->
|
||||
{% if item.children %}
|
||||
<button @click.prevent.stop="expanded = !expanded" type="button" class="toggle-button"
|
||||
style="background: none; border: none; padding: 0; margin-left: auto;">
|
||||
<span x-show="!expanded">
|
||||
<svg fill="currentColor" height="18px" stroke="none" viewBox="0 0 24 24" width="18px"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
<span x-show="expanded">▼</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% if item.children %}
|
||||
<div x-show="expanded">
|
||||
{{ render_headings(item.children, level+1) }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
{% if local_md_headings or local_subfolders %}
|
||||
<div class="local-md-headings">
|
||||
<h3 class="toctree-l1">Index</h3>
|
||||
|
Loading…
x
Reference in New Issue
Block a user