scrollbars on left menu and content added

src/styles/base/main.scss

@@ -22,16 +22,28 @@ $breakpoints: (phone: 480px,
     font-size: 1.6rem;
     min-height: 100vh;
     overflow-wrap: break-word;
+    overflow-x: hidden; /* To stop getting horizontal scrolling if anything overflows the width */
   }
 
   main {
     display: flex;
-    flex-direction: row;
-    max-width: 100%;
+    overflow: hidden;
+    height: calc(100vh - 83px); /* 83px = height of the header */
+    position: relative;
+    width: 100%;
+    
+    backface-visibility: hidden;
+    /*will-change: overflow;*/
   }
 }
 
-
+/* Add scrollbar to the left and right menu, and to the content */
+nav, .views-container {
+  overflow: auto;
+  height: auto;
+  -webkit-overflow-scrolling: touch;
+  -ms-overflow-style: none;
+}
 
 /* Quick fix. Will be removed later */
 #admin-circles,

src/styles/base/menu-left.scss

@@ -121,32 +121,6 @@
 
         hd-counter {
           margin-top: 16px;
-          margin-left: 8px;
-        }
-
-        &:hover {
-          background-color: $color-233-20-17;
-          box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.26);
-
-          sib-set-default[name='project'] {
-            background-color: $color-233-20-17;
-            color: $color-218-100-98;
-            /* transition: all 0.6s cubic-bezier(0.39, 0.575, 0.565, 1); Need better animation */
-            z-index: 1000;
-
-            .project-customer,
-            .project-name {
-              width: auto;
-            }
-
-            .project-name {
-              font-weight: normal;
-            }
-          }
-
-          hd-counter {
-            display: none;
-          }
         }
       }
       /* End of specific styles of "Projects" tab */

src/styles/components/sidebar.scss

@@ -12,7 +12,7 @@
 
   .views-container {
     flex: 1 0 0;
-    -webkit-backface-visibility: hidden;
+    /*-webkit-backface-visibility: hidden;*/
 
     &.sidebar-is-closed {
       margin-left: -15.5rem;
@@ -27,6 +27,7 @@
   nav {
     background: $color-210-25-95;
     transition: all 0.5s;
+    width: 25rem;
 
     >sib-router {
       background-color: $color-222-52-90;
@@ -49,13 +50,13 @@
           margin: 0;
           padding: 2.15rem 2.55rem;
           position: relative;
-          width: 12em;
+          /*width: 12em;*/
 
           &::before {
             float: left;
             font-size: 4rem;
             margin-left: 0;
-            margin-right: 2.55rem;
+            margin-right: 2.85rem;
           }
         }