fix(layout): remove duplicate scrollbar UI by clipping wrapper overflow and hiding sidebar scrollbar

Author: Diogo-Ferraz

src/app/app.component.scss

@@ -4,10 +4,10 @@
 @use '../assets/layout/responsive';
 
 .layout-wrapper {
-  min-height: 100vh;
+  min-height: 100dvh;
   position: relative;
   overflow-x: hidden;
-  overflow-y: visible;
+  overflow-y: clip;
   min-width: 0;
 }
 
@@ -56,7 +56,7 @@ app-sidebar {
 .layout-main-container {
   display: flex;
   flex-direction: column;
-  min-height: 100vh;
+  min-height: calc(100dvh - 4rem);
   justify-content: space-between;
   padding: 6rem 2rem 0 2rem;
   transition: margin-left .2s;
@@ -76,6 +76,7 @@ app-sidebar {
   }
 
   .layout-main-container {
+    min-height: calc(100dvh - 4rem);
     min-width: 0;
     width: 100%;
     max-width: 100%;

src/app/core/layout/component/app-menu/app-menu.component.scss

@@ -14,6 +14,12 @@
     border-radius: var(--border-radius);
     box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
     padding: 0.5rem 1.5rem;
+    scrollbar-width: none;
+    -ms-overflow-style: none;
+
+    &::-webkit-scrollbar {
+        display: none;
+    }
 }
 
 .layout-menu {