feat(components): add offcanvas component
This commit is contained in:
parent
e0ed5a5ddd
commit
c47a2eff89
14 changed files with 233 additions and 129 deletions
|
|
@ -1,20 +1,35 @@
|
|||
<ul class="msp-list-unstyle msp-accordion">
|
||||
<li>
|
||||
<a href="/">Overview</a>
|
||||
</li>
|
||||
<aside id="main-offcanvas" class="msp-offcanvas">
|
||||
<div class="msp-offcanvas-backdrop msp-offcanvas-toggle"
|
||||
data-msp-target="#main-offcanvas"></div>
|
||||
|
||||
{% for item in get_taxonomy(kind="section") | get(key="items") %}
|
||||
<li class="msp-accordion-item">
|
||||
<a class="msp-accordion-header" href="{{ get_url(path="@/" ~ item.slug ~ "/_index.md") }}">{{ item.name | title }}</a>
|
||||
<div class="msp-accordion-collapse">
|
||||
<ul class="msp-list-unstyle msp-accordion-content">
|
||||
{% for page in item.pages %}
|
||||
<li class="">
|
||||
<a href="{{ page.permalink }}">{{ page.title | default(value=page.slug) | title }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="msp-offcanvas-content">
|
||||
<div class="msp-offcanvas-body">
|
||||
<ul class="msp-list-unstyle msp-accordion">
|
||||
<li>
|
||||
<a href="/">Overview</a>
|
||||
</li>
|
||||
|
||||
{% for item in get_taxonomy(kind="section") | get(key="items") %}
|
||||
<li class="msp-accordion-item">
|
||||
<a class="msp-accordion-header" href="{{ get_url(path="@/" ~ item.slug ~ "/_index.md") }}">{{ item.name |
|
||||
title
|
||||
}}</a>
|
||||
<div class="msp-accordion-collapse">
|
||||
<ul class="msp-list-unstyle msp-accordion-content">
|
||||
{% for page in item.pages %}
|
||||
<li class="">
|
||||
<a href="{{ page.permalink }}">{{ page.title | default(value=page.slug) | title }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<nav class="msp-d-flex msp-justify-content-end">
|
||||
<button class="msp-offcanvas-toggle" data-msp-target="#main-offcanvas">Toggle</button>
|
||||
</nav>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue