Remove scrollbar style on sidebar

reduction-admin · Jun 30, 2019 · 186e3f4 · 186e3f4
1 parent bb1eebb
commit 186e3f4
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 14 deletions.
diff --git a/src/styles/components/_page.scss b/src/styles/components/_page.scss
@@ -1,5 +1,6 @@
 // page
 .cr-page {
+  min-height: 100vh;
   &__header {
     @include media-breakpoint-down(sm) {
       flex-direction: column;
@@ -14,7 +15,7 @@
     @include media-breakpoint-down(sm) {
       margin-bottom: 0;
     }
-    padding-right: .5rem;
+    padding-right: 0.5rem;
     margin-bottom: 1rem;
   }
 
@@ -25,12 +26,13 @@
     align-self: flex-end;
     padding: 0;
     text-transform: capitalize;
-    background: theme-color("light");
+    background: theme-color('light');
   }
 
   .row {
     // stylelint-disable-next-line
-    .col, > [class^="col-"] {
+    .col,
+    > [class^='col-'] {
       margin-bottom: 1rem;
     }
   }

diff --git a/src/styles/components/_sidebar.scss b/src/styles/components/_sidebar.scss
@@ -13,10 +13,10 @@
   color: #fff;
   background-position: center center;
   background-size: cover;
-  transition: left .1s ease-in;
+  transition: left 0.1s ease-in;
 
   + .cr-content {
-    transition: margin .1s ease-in;
+    transition: margin 0.1s ease-in;
   }
 
   &::after,
@@ -28,12 +28,12 @@
     display: block;
     width: 100%;
     height: 100%;
-    content: "";
+    content: '';
   }
 
   &::before {
     background: #000;
-    opacity: .33;
+    opacity: 0.33;
   }
 
   &::after {
@@ -45,15 +45,22 @@
   }
 
   &[data-image]:after {
-    opacity: .77;
+    opacity: 0.77;
   }
 
   &__content {
     position: relative;
     z-index: 4;
     height: calc(100vh - 20px);
     padding-bottom: 30px;
-    overflow: auto;
+    overflow-x: hidden;
+    overflow-y: auto;
+    scrollbar-width: none;
+    -ms-overflow-style: none;
+
+    &::-webkit-scrollbar {
+      width: 0;
+    }
   }
 
   &__background {
@@ -81,16 +88,16 @@
     // }
     width: 1.5rem;
     height: 1.5rem;
-    padding-right: .5rem;
+    padding-right: 0.5rem;
   }
 
   &--open {
     left: 0;
-    transition: left .2s ease-in;
+    transition: left 0.2s ease-in;
 
     + .cr-content {
       margin: 0 0 0 $cr-sidebar-width;
-      transition: margin .2s ease-in;
+      transition: margin 0.2s ease-in;
     }
   }
 
@@ -101,7 +108,7 @@
       margin: 5px 10px;
       color: theme-color(light);
       border-radius: 4px;
-      opacity: .86;
+      opacity: 0.86;
     }
 
     .nav-link {
@@ -111,7 +118,7 @@
       color: theme-color(light);
 
       &:hover {
-        background: rgba(theme-color(light), .15);
+        background: rgba(theme-color(light), 0.15);
       }
     }
   }