From a744a759fe987da0cf2ff2a7c258b7c5247f1034 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Sat, 7 Oct 2023 17:52:00 +0300
Subject: [PATCH] Update visuals

---
 assets/styles/layout/_content.scss    | 3 ++-
 assets/styles/layout/_responsive.scss | 4 ++++
 assets/styles/layout/_sidebar.scss    | 7 ++++---
 assets/styles/layout/_topbar.scss     | 1 +
 layouts/default.vue                   | 4 ++--
 5 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/assets/styles/layout/_content.scss b/assets/styles/layout/_content.scss
index 7a5202c0d..52b69d386 100644
--- a/assets/styles/layout/_content.scss
+++ b/assets/styles/layout/_content.scss
@@ -1,9 +1,10 @@
 .layout-content {
-    margin-left: 250px;
     padding-top: 5rem;
 
     .layout-content-inner {
         padding: 2rem 4rem;
+        display: flex;
+        gap: 4rem;
     }
 
     .card {
diff --git a/assets/styles/layout/_responsive.scss b/assets/styles/layout/_responsive.scss
index 82d84e78d..8248b5fd9 100644
--- a/assets/styles/layout/_responsive.scss
+++ b/assets/styles/layout/_responsive.scss
@@ -8,6 +8,10 @@
         max-width: 1478px;
         margin: 0 auto;
     }
+
+    .layout-sidebar {
+        left: 200px;
+    } 
 }
 
 @media screen and (max-width: 991px) {
diff --git a/assets/styles/layout/_sidebar.scss b/assets/styles/layout/_sidebar.scss
index 1875c8a7e..6759768c1 100644
--- a/assets/styles/layout/_sidebar.scss
+++ b/assets/styles/layout/_sidebar.scss
@@ -1,5 +1,5 @@
 .layout-sidebar {
-    position: fixed;
+    position: sticky;
     left: 0;
     top: 5rem;
     height: 100%;
@@ -8,7 +8,8 @@
     transition: transform .4s cubic-bezier(.05,.74,.2,.99);
     display: flex;
     flex-direction: column;
-    padding: 1.5rem 0 1rem 0;
+    padding: 0;
+    flex-shrink: 0;
 
     .logo {
         display: flex;
@@ -16,7 +17,7 @@
     }
 
     nav {
-        padding: 0 0 2rem 2rem;
+        padding: 0;
         margin: 0;
         flex-grow: 1;
         overflow-y: auto;
diff --git a/assets/styles/layout/_topbar.scss b/assets/styles/layout/_topbar.scss
index 81967178b..5e3e75821 100644
--- a/assets/styles/layout/_topbar.scss
+++ b/assets/styles/layout/_topbar.scss
@@ -4,6 +4,7 @@
     position: fixed;
     top: 0;
     left: 0;
+    padding: 0 4rem;
     width: 100%;
     z-index: 1100;
     transition: background-color 1s;
diff --git a/layouts/default.vue b/layouts/default.vue
index fb52a02f2..e0da9a376 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -2,15 +2,15 @@
     <div class="layout-wrapper" :class="containerClass">
         <app-news v-if="$appState.newsActive" />
         <app-topbar @menubutton-click="onMenuButtonClick" @configbutton-click="onConfigButtonClick" />
-        <app-menu :active="sidebarActive" />
         <app-configurator :configActive="appConfigActive" @updateConfigActive="onUpdateConfigActive" />
         <div :class="['layout-mask', { 'layout-mask-active': sidebarActive }]" @click="onMaskClick"></div>
         <div class="layout-content">
             <div class="layout-content-inner">
+                <app-menu :active="sidebarActive" />
                 <slot></slot>
-                <app-footer />
             </div>
         </div>
+        <app-footer />
         <Toast />
         <Toast position="top-left" group="tl" />
         <Toast position="bottom-left" group="bl" />