From 53b8208ecf0af84a695f7b435857ffcfd28194ba Mon Sep 17 00:00:00 2001
From: rexarski
Date: Sat, 3 Oct 2020 17:26:46 +1000
Subject: update sidebar-mobile with one-column layout

update sidebar-mobile with one-column layout
---
 assets/scss/_fuji-style/_sidebar.scss | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

(limited to 'assets/scss')

diff --git a/assets/scss/_fuji-style/_sidebar.scss b/assets/scss/_fuji-style/_sidebar.scss
index a300c4c..58f23a2 100644
--- a/assets/scss/_fuji-style/_sidebar.scss
+++ b/assets/scss/_fuji-style/_sidebar.scss
@@ -16,12 +16,12 @@
     margin: 0 0.1rem; // little space
   }
 
-  & > div,
-  & > nav {
+  &>div,
+  &>nav {
     margin: 0 0.1rem; // little space
   }
 
-  & > img {
+  &>img {
     margin: 0.5rem 0.25rem 0 0.25rem;
     width: 100%;
     border-radius: 2px;
@@ -36,20 +36,22 @@
 
 @media screen and (max-width: $width-md) {
   .sidebar-mobile {
+    width: 70%;
     position: fixed;
     top: 0;
     right: 0;
     bottom: 0%;
     background-color: var(--color-codebg);
-    padding: 1.5rem;
+    padding: 1.5rem 4.5rem 1.5rem 1.5rem;
     display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
+    flex-direction: column;
+    flex-wrap: nowrap;
     justify-content: space-around;
     z-index: 50;
 
     .sidebar-item {
-      width: 40%; // max 2 modules per line
+      width: 90%; // max 1 module per line
+      text-align: right;
 
       // space only at first 2 modules
       .sidebar-pages,
@@ -62,7 +64,7 @@
         margin-bottom: 0;
       }
 
-      & > img {
+      &>img {
         margin: 0.5rem 0.25rem 0 0.25rem;
         width: 75%;
         border-radius: 0.25rem;
@@ -87,4 +89,4 @@
     overflow: auto;
     scrollbar-width: thin;
   }
-}
+}
\ No newline at end of file
-- 
cgit v1.2.3