From 65c6ca1c4453f2dfab239e40bde7a3b900e67a2f Mon Sep 17 00:00:00 2001
From: "Umang G. Patel" <23169768+robonetphy@users.noreply.github.com>
Date: Sat, 18 Jun 2022 00:31:04 +0530
Subject: [PATCH] removed the old changes

---
 .../components/{leftAside.twig => aside.twig} | 16 +++---
 src/backend/views/components/rightAside.twig  | 22 --------
 src/backend/views/layout.twig                 |  9 ++--
 src/frontend/styles/components/aside.pcss     | 51 ++-----------------
 src/frontend/styles/components/header.pcss    |  2 +-
 src/frontend/styles/layout.pcss               |  8 +--
 6 files changed, 22 insertions(+), 86 deletions(-)
 rename src/backend/views/components/{leftAside.twig => aside.twig} (50%)
 delete mode 100644 src/backend/views/components/rightAside.twig

diff --git a/src/backend/views/components/leftAside.twig b/src/backend/views/components/aside.twig
similarity index 50%
rename from src/backend/views/components/leftAside.twig
rename to src/backend/views/components/aside.twig
index c15d325..a99d375 100644
--- a/src/backend/views/components/leftAside.twig
+++ b/src/backend/views/components/aside.twig
@@ -1,19 +1,19 @@
-<div class="docs-aside-toggler" onclick="document.querySelector('.docs-left-aside').classList.toggle('docs-left-aside--toggled')">
+<div class="docs-aside-toggler" onclick="document.querySelector('.docs-aside').classList.toggle('docs-aside--toggled')">
 	{{ svg('menu') }}
 	Table of contents
 </div>
-<div class="docs-left-aside">
-	<div class="docs-left-aside__section-wrapper">
+<div class="docs-aside">
+	<div class="docs-aside__section-wrapper">
 		{% for firstLevelPage in menu %}
-			<section class="docs-left-aside__section">
-				<a {% if page is defined and page._id == firstLevelPage._id%} class="docs-left-aside__section-title docs-left-aside__current" {% else %} class="docs-left-aside__section-title" {% endif %} {% if firstLevelPage.uri %} href="/{{ firstLevelPage.uri }}" {% else %} href="/page/{{ firstLevelPage._id }}" {% endif %}>
+			<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-left-aside__section-list">
+					<ul class="docs-aside__section-list">
 						{% for child in firstLevelPage.children %}
 							<li>
-								<a {% if page is defined and page._id == child._id %} class="docs-left-aside__current" {% endif %} {% if child.uri %} href="/{{ child.uri }}" {% else %} href="/page/{{ child._id }}" {% endif %}>
+								<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>
@@ -23,7 +23,7 @@
 			</section>
 		{% endfor %}
 	</div>
-	<a class="docs-left-aside__logo-wrapper" href="https://github.com/codex-team/codex.docs">
+	<a class="docs-aside__logo-wrapper" href="https://github.com/codex-team/codex.docs">
 		<div class="logo">
 			{{ svg('aside-logo') }}
 		</div>
diff --git a/src/backend/views/components/rightAside.twig b/src/backend/views/components/rightAside.twig
deleted file mode 100644
index 91363ea..0000000
--- a/src/backend/views/components/rightAside.twig
+++ /dev/null
@@ -1,22 +0,0 @@
-<div class="docs-right-aside">
-	<div class="docs-right-aside__title">
-		On this page
-	</div>
-	<div class="docs-right-aside__section-wrapper">
-		<section class="docs-right-aside__section">
-			<a class="docs-right-aside__section-title">
-				Fast access link
-			</a>
-		</section>
-		<section class="docs-right-aside__section">
-			<a class="docs-right-aside__section-title docs-right-aside__current">
-				Hawk roadmap
-			</a>
-		</section>
-		<section class="docs-right-aside__section">
-			<a class="docs-right-aside__section-title">
-				The third section with long title for several lines of text
-			</a>
-		</section>
-	</div>
-</div>
diff --git a/src/backend/views/layout.twig b/src/backend/views/layout.twig
index a2a8c1e..6710d9e 100644
--- a/src/backend/views/layout.twig
+++ b/src/backend/views/layout.twig
@@ -17,16 +17,17 @@
   <body>
     {% include "components/header.twig" with res.locals.isAuthorized %}
     <div class="docs">
-      <aside class="docs__left-aside">
-        {% include "components/leftAside.twig" %}
+      <aside class="docs__aside">
+        {% include "components/aside.twig" %}
       </aside>
       <div class="docs__content">
         <div class="docs__content-inner">
           {% block body %}{% endblock %}
         </div>
       </div>
-      <aside class="docs__right-aside">
-         {% include "components/rightAside.twig" %}
+      <aside class="docs__aside-right">
+        <div class="table-of-content">
+        </div>
       </aside>
     </div>
     <script src="/dist/main.bundle.js"></script>
diff --git a/src/frontend/styles/components/aside.pcss b/src/frontend/styles/components/aside.pcss
index 39e9179..a74b2e3 100644
--- a/src/frontend/styles/components/aside.pcss
+++ b/src/frontend/styles/components/aside.pcss
@@ -1,4 +1,4 @@
-.docs-left-aside {
+.docs-aside {
   font-size: 14px;
   letter-spacing: 0.01em;
   display: flex;
@@ -105,7 +105,7 @@
   }
 }
 
-.docs-right-aside {
+.table-of-content {
   padding-left: 22px;
   border-left: solid 1px var(--color-line-gray);
   font-size: 14px;
@@ -113,49 +113,6 @@
   display: flex;
   flex-direction: column;
   height: 100%;
-
-  &__title {
-    padding: 0px 6px;
-    font-size: 16px;
-    line-height: 21px;
-    font-weight: 600;
-    margin-bottom: 12px;
-  }
-
-  a {
-    color: inherit;
-    text-decoration: none;
-    border-radius: 8px;
-
-    &:hover {
-      background-color: var(--color-link-hover);
-    }
-  }
-
-  &__section-wrapper {
-    flex-grow: 1;
-    overflow: auto;
-    padding-left: 8px;
-  }
-
-  &__section {
-    margin-bottom: 6px;
-    &:last-of-type {
-      margin-bottom: 0;
-    }
-
-    &-title {
-      display: inline-block;
-      font-size: 14px;
-      line-height: 21px;
-      font-weight: 400;
-      max-width: var(--layout-width-aside-right-title);
-      white-space: wrap;
-      padding: 4px 8px;
-    }
-  }
-
-  &__current {
-    background-color: var(--color-link-hover) !important;
-  }
+  background: red;
+  width: 100%;
 }
diff --git a/src/frontend/styles/components/header.pcss b/src/frontend/styles/components/header.pcss
index 51b2ebd..459d8a1 100644
--- a/src/frontend/styles/components/header.pcss
+++ b/src/frontend/styles/components/header.pcss
@@ -2,10 +2,10 @@
   display: flex;
   justify-content: space-between;
   flex-shrink: 0;
+  flex-wrap: wrap;
   padding: 12px var(--layout-padding-horizontal);
   border-bottom: 1px solid var(--color-line-gray);
   font-size: 18px;
-  flex-wrap: wrap;
   position: fixed;
   top: 0;
   box-sizing: border-box;
diff --git a/src/frontend/styles/layout.pcss b/src/frontend/styles/layout.pcss
index 6526a7f..36cfd03 100644
--- a/src/frontend/styles/layout.pcss
+++ b/src/frontend/styles/layout.pcss
@@ -3,7 +3,7 @@
     flex-wrap: wrap;
   }
 
-  &__left-aside {
+  &__aside {
     width: var(--layout-width-aside);
     padding: 0px 22px;
     border-right: solid 1px var(--color-line-gray);
@@ -36,7 +36,7 @@
     }
   }
 
-  &__right-aside {
+  &__aside-right {
     padding-left: var(--layout-right-aside-padding-left);
     padding-bottom: 30px;
     position: fixed;
@@ -50,8 +50,8 @@
     );
   }
 
-  &__left-aside,
-  &__right-aside,
+  &__aside,
+  &__aside-right,
   &__content {
     padding-top: var(--layout-padding-vertical);