From 2be4a24178830ed3cb6dc6a5fa02db34b8b299a2 Mon Sep 17 00:00:00 2001
From: "Umang G. Patel" <23169768+robonetphy@users.noreply.github.com>
Date: Sat, 4 Jun 2022 00:30:11 +0530
Subject: [PATCH] layout and vars added

---
 src/frontend/styles/layout.pcss | 5 +++--
 src/frontend/styles/vars.pcss   | 4 +++-
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/frontend/styles/layout.pcss b/src/frontend/styles/layout.pcss
index 0885419..bec6498 100644
--- a/src/frontend/styles/layout.pcss
+++ b/src/frontend/styles/layout.pcss
@@ -9,8 +9,9 @@
     padding: 0px 22px;
     border-right: solid 1px var(--color-line-gray);
     position: fixed;
+    top: var(--layout-height-header);
     height: calc(
-      100vh - var(--layout-padding-vertical) - var(--layout-height-header)
+      100%-var(--layout-height-header)-var(--layout-padding-vertical)
     );
 
     @media (--mobile) {
@@ -25,6 +26,7 @@
   &__content {
     flex-grow: 2;
     word-wrap: break-word;
+    margin-top: var(--layout-height-header);
 
     @media (--mobile) {
       width: 100%;
@@ -40,7 +42,6 @@
   &__aside,
   &__content {
     padding-top: var(--layout-padding-vertical);
-    margin-top: var(--layout-height-header);
 
     @media (--mobile) {
       padding: 20px 0;
diff --git a/src/frontend/styles/vars.pcss b/src/frontend/styles/vars.pcss
index 1009992..e3c6613 100644
--- a/src/frontend/styles/vars.pcss
+++ b/src/frontend/styles/vars.pcss
@@ -24,10 +24,12 @@
    */
   --layout-padding-horizontal: 16px;
   --layout-padding-vertical: 30px;
-  --layout-height-header: 57px;
+
   --layout-width-aside: 300px;
   --layout-width-main-col: 650px;
 
+  --layout-height-header: 57px;
+
   @media (--mobile) {
     --layout-padding-horizontal: 15px;
     --layout-padding-vertical: 15px;