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')"> <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>
<div class="docs-aside"> <div class="docs-aside">
{% for firstLevelPage in menu %} <div class="docs-aside__section-wrapper">
<section class="docs-aside__section"> {% for firstLevelPage in menu %}
<a <section class="docs-aside__section">
{% if page is defined and page._id == firstLevelPage._id%} <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 %}>
class="docs-aside__section-title docs-aside__current" {{ firstLevelPage.title | striptags }}
{% else %} </a>
class="docs-aside__section-title" {% if firstLevelPage.children is not empty %}
{% endif %} <ul class="docs-aside__section-list">
{% if firstLevelPage.uri %} {% for child in firstLevelPage.children %}
href="/{{ firstLevelPage.uri }}" <li>
{% else %} <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 %}>
href="/page/{{ firstLevelPage._id }}" {{ child.title | striptags }}
{% endif %}> </a>
{{ firstLevelPage.title | striptags }} </li>
</a> {% endfor %}
{% if firstLevelPage.children is not empty %} </ul>
<ul class="docs-aside__section-list"> {% endif %}
{% for child in firstLevelPage.children %} </section>
<li> {% endfor %}
<a </div>
{% if page is defined and page._id == child._id %} <a class="docs-aside__logo-wrapper" href="https://github.com/codex-team/codex.docs">
class="docs-aside__current" <div class="logo">
{% endif %} {{ svg('aside-logo') }}
{% if child.uri %} </div>
href="/{{ child.uri }}" <div class="caption">
{% else %} <span>Powered by CodeX Docs</span>
href="/page/{{ child._id }}" </div>
{% endif %}> </a>
{{ 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> </div>

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

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