Merge pull request #482 from hashicorp/chore-scrolling

Chore scrolling

ui/desktop/CHANGELOG.md

@@ -5,6 +5,10 @@ Canonical reference for changes, improvements, and bugfixes for Boundary Desktop
 
 ## Next
 
+### New & Improved
+
+- Scrolling now occurs within columns individually so that sidebar and header remain visible when scrolling the application body.  ([PR](https://github.com/hashicorp/boundary-ui/pull/482))
+
 ### Changes/Deprecations
 
 - Boundary origin validation now occurs via Electron's built-in net request module, ensuring the validation request is made via chromium's networking library rather than Node's.  ([PR](https://github.com/hashicorp/boundary-ui/pull/480))

ui/desktop/app/styles/app.scss

@@ -19,6 +19,25 @@
   }
 }
 
+/**
+ * This section enables scrolling within the sidebar columns separately,
+ * rather than the whole viewport.  This ensures the sidebar and application
+ * header remain visible when scrolling.
+ */
+.rose-layout-global {
+  max-height: 100vh;
+
+  .rose-layout-global-body {
+    max-height: 100vh;
+    overflow: hidden;
+  }
+
+  .rose-layout-sidebar-sidebar,
+  .rose-layout-sidebar-body {
+    overflow-y: scroll;
+  }
+}
+
 .rose-nav-sidebar {
   margin-top: sizing.rems(xxl);
 
@@ -167,7 +186,7 @@
       0% {
         background-color: var(--action-subtler-1);
       }
-      
+
       100% {
         background-color: transparent;
       }