refactor(Modal): adjust mask so that focus, scroll bar are not masked

carbon-design-system · Feb 12, 2024 · c551c4f · c551c4f
1 parent 9ee603e
commit c551c4f
Showing 1 changed file with 8 additions and 5 deletions.
diff --git a/packages/styles/scss/components/modal/_modal.scss b/packages/styles/scss/components/modal/_modal.scss
@@ -518,11 +518,14 @@
   .#{$prefix}--modal--slug
     .#{$prefix}--modal-content.#{$prefix}--modal-scroll-content {
     mask-image: linear-gradient(
-      to bottom,
-      $layer calc(100% - 80px),
-      transparent calc(100% - 48px),
-      transparent 100%
-    );
+        to bottom,
+        $layer calc(100% - 80px),
+        transparent calc(100% - 48px),
+        transparent 100%
+      ),
+      linear-gradient(to left, $layer 0, transparent 16px),
+      linear-gradient(to right, $layer 0, transparent 4px),
+      linear-gradient(to top, $layer 0, transparent 4px);
   }
 
   .#{$prefix}--modal-header