fix: Make application list scrollable on smaller screens (#685)

Co-authored-by: Noggling <[email protected]>
equinor · Aug 7, 2024 · 26a492e · 26a492e
1 parent 8e44445
commit 26a492e
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/.changeset/pr-685-2008088683.md b/.changeset/pr-685-2008088683.md
@@ -0,0 +1,5 @@
+
+---
+"fusion-project-portal": patch
+--- 
+Bug Fix: The application list in the menu now features a scrollbar for better usability on smaller screens.
diff --git a/client/packages/portal-client/src/components/portal-menu/PortalMenu.tsx b/client/packages/portal-client/src/components/portal-menu/PortalMenu.tsx
@@ -33,10 +33,14 @@ const Styles = {
 		padding-top: 2rem;
 	`,
 
+	AppsListWrapper: styled.div`
+		overflow: auto;
+		height: inherit;
+	`,
+
 	Wrapper: styled.div`
 		column-count: 3;
 		height: 100%;
-
 		gap: 1.5rem;
 		overflow: auto;
 		@media only screen and (max-width: 1500px) {
@@ -131,7 +135,7 @@ export function MenuGroups() {
 								))}
 							</Styles.CategoryWrapper>
 						</Styles.Divider>
-						<div>
+						<Styles.AppsListWrapper>
 							<AppContextMessage />
 							{displayAppGroups && !!displayAppGroups?.length ? (
 								activeItem.includes('Pinned Apps') && favorites?.length === 0 ? (
@@ -196,7 +200,7 @@ export function MenuGroups() {
 									) : null}
 								</>
 							)}
-						</div>
+						</Styles.AppsListWrapper>
 					</>
 				)}
 			</Styles.MenuWrapper>