MM-59944 - FIxing playbooks scroll issue (#27861)

webapp/channels/src/sass/base/_structure.scss

@@ -115,10 +115,7 @@ body.app__body #root {
 
     --columns: min-content minmax(385px, 1fr) min-content;
     grid-template:
-        "announcement announcement announcement" min-content
-        "admin-announcement admin-announcement admin-announcement" min-content
-        "header header header" min-content
-        "team-sidebar main app-sidebar"
+        "announcement announcement announcement"min-content "admin-announcement admin-announcement admin-announcement"min-content "header header header"min-content "team-sidebar main app-sidebar"
         "footer footer footer"min-content / var(--columns);
 
     > :only-child {
@@ -131,13 +128,10 @@ body.app__body #root {
         padding-bottom: 0;
         padding-right: 0;
         grid-template:
-            'announcement announcement' min-content
-            'admin-announcement admin-announcement' min-content
-            'header header' min-content
-            'lhs center'
-            'footer footer' min-content
-        ;
-        grid-template-columns: auto 1fr; /* lhs takes its content width, center takes remaining space */
+            'announcement announcement'min-content 'admin-announcement admin-announcement'min-content 'header header'min-content 'lhs center'
+            'footer footer'min-content;
+        grid-template-columns: auto 1fr;
+        /* lhs takes its content width, center takes remaining space */
     }
 
     &.container-fluid {
@@ -181,8 +175,7 @@ body.app__body #root {
             margin: 0;
             border-radius: 0;
             grid-template:
-                'header' min-content
-                'main'
+                'header'min-content 'main'
             ;
         }
 
@@ -214,6 +207,10 @@ body.app__body #root {
         overflow: visible;
     }
 
+    .product-wrapper {
+        overflow: auto;
+    }
+
     .sidebar--right--width-holder {
         grid-area: rhs;
     }
@@ -237,16 +234,13 @@ body.app__body #root {
             padding-right: 0;
             z-index: 17;
             grid-template:
-                'announcement' min-content
-                'header' min-content
-                'main' auto
-                'footer' min-content
-                / auto
-            ;
+                'announcement'min-content 'header'min-content 'main'auto 'footer'min-content / auto;
+
             .team-sidebar,
             .app-bar {
                 grid-area: main;
             }
+
             #SidebarContainer.move--right {
                 position: relative;
             }
@@ -281,14 +275,17 @@ body.app__body #root {
             .sidebar--right--width-holder {
                 display: none;
             }
+
             #sidebar-right {
                 position: absolute;
                 width: 100%;
                 grid-area: center;
                 transition: width .25s ease-in-out;
             }
+
             --columns: min-content auto min-content;
         }
+
         #sidebar-right {
             transition: none;
         }