From 727f95010d809bd438de0c39af30315f6f0575df Mon Sep 17 00:00:00 2001
From: zhixuan <jinzhixuan666@gmail.com>
Date: Sun, 13 Feb 2022 21:18:54 +0900
Subject: [PATCH] enable left sidebar every time

---
 assets/scss/grid.scss                    | 36 +++++--------
 assets/scss/partials/layout/article.scss | 69 +++---------------------
 assets/scss/partials/sidebar.scss        |  8 +++
 exampleSite/config.yaml                  |  2 +-
 layouts/_default/single.html             | 14 +----
 5 files changed, 29 insertions(+), 100 deletions(-)

diff --git a/assets/scss/grid.scss b/assets/scss/grid.scss
index a0eddca..8987548 100644
--- a/assets/scss/grid.scss
+++ b/assets/scss/grid.scss
@@ -10,7 +10,7 @@
         max-width: var(--right-sidebar-max-width);
 
         /// Display right sidebar when min-width: lg
-        @include respond(lg) {
+        @include respond(xl) {
             display: block;
         }
     }
@@ -18,38 +18,21 @@
     &.extended {
         @include respond(md) {
             max-width: 1024px;
-            --left-sidebar-max-width: 25%;
-            --right-sidebar-max-width: 30%;
-        }
-
-        @include respond(lg) {
-            max-width: 1280px;
-            --left-sidebar-max-width: 20%;
-            --right-sidebar-max-width: 30%;
-        }
-
-        @include respond(xl) {
-            max-width: 1536px;
             --left-sidebar-max-width: 15%;
-            --right-sidebar-max-width: 25%;
-        }
-    }
-
-    &.compact {
-        @include respond(md) {
-            --left-sidebar-max-width: 25%;
-            max-width: 768px;
         }
 
         @include respond(lg) {
-            max-width: 1024px;
-            --left-sidebar-max-width: 20%;
+            max-width: 1280px;
+            --right-sidebar-max-width: 20%;
         }
 
         @include respond(xl) {
-            max-width: 1280px;
+            max-width: 1800px;
+            --left-sidebar-max-width: 10%;
+            --right-sidebar-max-width: 20%;
         }
     }
+
 }
 
 .flex {
@@ -102,7 +85,12 @@ main.main {
     align-items: flex-start;
     padding: 0 15px;
     column-gap: var(--section-separation);
+    align-items: start;
+    flex-direction: column;
 
+    @include respond(md) {
+        flex-direction: row;
+    }
     @include respond(md) {
         padding: 0 20px;
     }
diff --git a/assets/scss/partials/layout/article.scss b/assets/scss/partials/layout/article.scss
index af5f7bb..de7a31b 100644
--- a/assets/scss/partials/layout/article.scss
+++ b/assets/scss/partials/layout/article.scss
@@ -122,66 +122,6 @@
     }
 }
 
-.article-page.has-toc {
-    .left-sidebar {
-        display: none;
-    }
-
-    .right-sidebar {
-        width: 100%;
-        padding: 0;
-        display: none;
-
-        @include respond(xl) {
-            display: block;
-            top: var(--main-top-padding);
-        }
-    }
-
-    #article-toolbar {
-        display: block;
-
-        @include respond(md) {
-            padding: 0;
-        }
-
-        @include respond(xl) {
-            margin-top: 0;
-            position: sticky;
-            top: var(--main-top-padding);
-            flex-shrink: 1;
-
-            a {
-                background: transparent;
-                box-shadow: none;
-                border: 1px solid var(--body-text-color);
-                width: 100%;
-                margin-right: 0;
-
-                svg {
-                    flex-shrink: 0;
-                }
-            }
-        }
-    }
-
-    .main-container {
-        align-items: start;
-        flex-direction: column;
-
-        @include respond(xl) {
-            flex-direction: row;
-        }
-    }
-
-    .main {
-        padding-top: 0;
-
-        @include respond(xl) {
-            padding-top: var(--main-top-padding);
-        }
-    }
-}
 
 .widget--toc {
     background-color: var(--card-background);
@@ -299,7 +239,11 @@
         &.has-image {
             .article-details {
                 padding: 20px;
-                background: linear-gradient(0deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.75) 100%);
+                background: linear-gradient(
+                    0deg,
+                    rgba(0, 0, 0, 0.25) 0%,
+                    rgba(0, 0, 0, 0.75) 100%
+                );
             }
         }
     }
@@ -338,7 +282,8 @@
     blockquote {
         position: relative;
         margin: 1.5em 0;
-        border-left: var(--blockquote-border-size) solid var(--card-separator-color);
+        border-left: var(--blockquote-border-size) solid
+            var(--card-separator-color);
         padding: 15px calc(var(--card-padding) - var(--blockquote-border-size));
         background-color: var(--blockquote-background-color);
     }
diff --git a/assets/scss/partials/sidebar.scss b/assets/scss/partials/sidebar.scss
index 462729d..ccfd169 100644
--- a/assets/scss/partials/sidebar.scss
+++ b/assets/scss/partials/sidebar.scss
@@ -37,6 +37,14 @@
 }
 
 .right-sidebar {
+    width: 100%;
+    padding: 0;
+    display: none;
+    
+    @include respond(xl) {
+        display: block;
+        top: var(--main-top-padding);
+    }
     flex-shrink: 0;
     display: none;
 
diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml
index d449fc9..0b55847 100644
--- a/exampleSite/config.yaml
+++ b/exampleSite/config.yaml
@@ -181,7 +181,7 @@ menu:
           weight: -100
           params:
               ### For demonstration purpose, the home link will be open in a new tab
-              newTab: true
+              newTab: false
               icon: home
 
     social:
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 8ce42e9..75eca0f 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,7 +1,7 @@
 {{ define "body-class" }}
     {{ $TOCEnabled := default (default false .Site.Params.article.toc) .Params.toc }}
     {{- .Scratch.Set "hasTOC" (and (ge (len .TableOfContents) 100) $TOCEnabled) -}}
-    article-page {{ if (.Scratch.Get "hasTOC") }}has-toc{{ end }}
+    article-page
 {{ end }}
 
 {{ define "container-class" }}
@@ -30,18 +30,6 @@
     {{ partialCached "article/components/photoswipe" . }}
 {{ end }}
 
-{{ define "left-sidebar" }}
-    {{ if (.Scratch.Get "hasTOC") }}
-        <div id="article-toolbar">
-            <a href="{{ .Site.BaseURL | relLangURL }}" class="back-home">
-                {{ (resources.Get "icons/back.svg").Content | safeHTML }}
-                <span>{{ T "article.back" }}</span>
-            </a>
-        </div>
-    {{ else }}
-        {{ partial "sidebar/left.html" . }}
-    {{ end }}
-{{ end }}
 
 {{ define "right-sidebar" }}
     {{ if (.Scratch.Get "hasTOC") }}