diff --git a/src/backend/views/components/aside.twig b/src/backend/views/components/leftAside.twig similarity index 100% rename from src/backend/views/components/aside.twig rename to src/backend/views/components/leftAside.twig diff --git a/src/backend/views/components/rightAside.twig b/src/backend/views/components/rightAside.twig new file mode 100644 index 0000000..a99d375 --- /dev/null +++ b/src/backend/views/components/rightAside.twig @@ -0,0 +1,34 @@ +
+ {{ svg('menu') }} + Table of contents +
+
+
+ {% for firstLevelPage in menu %} +
+ + {{ firstLevelPage.title | striptags }} + + {% if firstLevelPage.children is not empty %} + + {% endif %} +
+ {% endfor %} +
+ + +
+ Powered by CodeX Docs +
+ +
diff --git a/src/backend/views/layout.twig b/src/backend/views/layout.twig index afecadf..8ad9dfb 100644 --- a/src/backend/views/layout.twig +++ b/src/backend/views/layout.twig @@ -17,14 +17,17 @@ {% include "components/header.twig" with res.locals.isAuthorized %}
-
{% if config.yandexMetrikaId is not empty %} diff --git a/src/frontend/styles/components/header.pcss b/src/frontend/styles/components/header.pcss index b80065b..51b2ebd 100644 --- a/src/frontend/styles/components/header.pcss +++ b/src/frontend/styles/components/header.pcss @@ -7,6 +7,7 @@ font-size: 18px; flex-wrap: wrap; position: fixed; + top: 0; box-sizing: border-box; width: 100%; z-index: 2; diff --git a/src/frontend/styles/layout.pcss b/src/frontend/styles/layout.pcss index bec6498..a83dbba 100644 --- a/src/frontend/styles/layout.pcss +++ b/src/frontend/styles/layout.pcss @@ -1,10 +1,9 @@ .docs { - display: flex; @media (--mobile) { flex-wrap: wrap; } - &__aside { + &__left-aside { width: var(--layout-width-aside); padding: 0px 22px; border-right: solid 1px var(--color-line-gray); @@ -24,8 +23,6 @@ } &__content { - flex-grow: 2; - word-wrap: break-word; margin-top: var(--layout-height-header); @media (--mobile) { @@ -39,7 +36,15 @@ } } - &__aside, + &__right-aside { + padding: 0px 22px; + position: fixed; + top: var(--layout-height-header); + right: 0; + } + + &__left-aside, + &__right-aside, &__content { padding-top: var(--layout-padding-vertical);