Docker/codex.docs
Docker/codex.docs
1
0
Fork 0
mirror of https://github.com/codex-team/codex.docs.git synced 2025-08-09 15:35:25 +02:00
Code Issues Releases Activity

aside style and container added

Browse source
This commit is contained in:
Umang G. Patel 2022-06-04 00:31:00 +05:30
parent 0c42733435
commit 472cf673f7
2 changed files with 40 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

75
src/backend/views/components/aside.twig
View file

@ -1,49 +1,34 @@
<div class="docs-aside-toggler" onclick="document.querySelector('.docs-aside').classList.toggle('docs-aside--toggled')">
{{ svg('menu') }} Table of contents
{{ svg('menu') }}
Table of contents
</div>
<div class="docs-aside">
{% for firstLevelPage in menu %}
<section class="docs-aside__section">
<a
{% if page is defined and page._id == firstLevelPage._id%}
class="docs-aside__section-title docs-aside__current"
{% else %}
class="docs-aside__section-title"
{% endif %}
{% if firstLevelPage.uri %}
href="/{{ firstLevelPage.uri }}"
{% else %}
href="/page/{{ firstLevelPage._id }}"
{% endif %}>
{{ firstLevelPage.title | striptags }}
</a>
{% if firstLevelPage.children is not empty %}
<ul class="docs-aside__section-list">
{% for child in firstLevelPage.children %}
<li>
<a
{% if page is defined and page._id == child._id %}
class="docs-aside__current"
{% endif %}
{% if child.uri %}
href="/{{ child.uri }}"
{% else %}
href="/page/{{ child._id }}"
{% endif %}>
{{ child.title | striptags }}
</a>
</li>
{% endfor %}
</ul>
{% endif %}
</section>
{% endfor %}
<a class="docs-aside__logo-wrapper" href="https://github.com/codex-team/codex.docs">
<div class="logo">
{{ svg('aside-logo') }}
</div>
<div class="caption">
<span>Powered by CodeX Docs</span>
</div>
</a>
<div class="docs-aside__section-wrapper">
{% for firstLevelPage in menu %}
<section class="docs-aside__section">
<a {% if page is defined and page._id == firstLevelPage._id%} class="docs-aside__section-title docs-aside__current" {% else %} class="docs-aside__section-title" {% endif %} {% if firstLevelPage.uri %} href="/{{ firstLevelPage.uri }}" {% else %} href="/page/{{ firstLevelPage._id }}" {% endif %}>
{{ firstLevelPage.title | striptags }}
</a>
{% if firstLevelPage.children is not empty %}
<ul class="docs-aside__section-list">
{% for child in firstLevelPage.children %}
<li>
<a {% if page is defined and page._id == child._id %} class="docs-aside__current" {% endif %} {% if child.uri %} href="/{{ child.uri }}" {% else %} href="/page/{{ child._id }}" {% endif %}>
{{ child.title | striptags }}
</a>
</li>
{% endfor %}
</ul>
{% endif %}
</section>
{% endfor %}
</div>
<a class="docs-aside__logo-wrapper" href="https://github.com/codex-team/codex.docs">
<div class="logo">
{{ svg('aside-logo') }}
</div>
<div class="caption">
<span>Powered by CodeX Docs</span>
</div>
</a>
</div>

10
src/frontend/styles/components/aside.pcss
View file

@ -1,6 +1,10 @@
.docs-aside {
font-size: 14px;
letter-spacing: 0.01em;
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
@media (--mobile) {
position: static;
@ -24,6 +28,11 @@
}
}
&__section-wrapper {
flex-grow: 1;
overflow: auto;
}
&__section {
margin-bottom: 30px;
@ -73,6 +82,7 @@
display: flex;
align-items: center;
gap: 18px;
padding-bottom: 20px;
.logo {
display: inline-flex;