fix(CodeSnippet): v10 - fix horizontal scrolling with keyboard (#14910)

* fix(CodeSnippet): v10 - fix horizontal scrolling with keyboard * style(CodeSnippet): remove after element entirely
carbon-design-system · Oct 17, 2023 · 2b3cdf3 · 2b3cdf3
1 parent 8020480
commit 2b3cdf3
Show file tree

Hide file tree

Showing 2 changed files with 0 additions and 38 deletions.
diff --git a/packages/components/src/components/code-snippet/_code-snippet.scss b/packages/components/src/components/code-snippet/_code-snippet.scss
@@ -212,7 +212,6 @@
   .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre {
     padding-right: $carbon--spacing-08;
     padding-bottom: to-rem(24px);
-    overflow-x: auto;
   }
 
   .#{$prefix}--snippet--multi.#{$prefix}--snippet--no-copy
@@ -221,24 +220,6 @@
     padding-right: 0;
   }
 
-  // expanded pre
-  .#{$prefix}--snippet--multi.#{$prefix}--snippet--expand
-    .#{$prefix}--snippet-container
-    pre {
-    overflow-x: auto;
-  }
-
-  .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre::after {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: to-rem(16px);
-    height: 100%;
-    // Safari interprets `transparent` differently, so make color token value transparent instead:
-    background-image: linear-gradient(to right, rgba($field-01, 0), $field-01);
-    content: '';
-  }
-
   .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre code {
     overflow: hidden;
   }

diff --git a/packages/styles/scss/components/code-snippet/_code-snippet.scss b/packages/styles/scss/components/code-snippet/_code-snippet.scss
@@ -224,7 +224,6 @@ $copy-btn-feedback: $background-inverse !default;
   .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre {
     padding-right: $spacing-08;
     padding-bottom: to-rem(24px);
-    overflow-x: auto;
   }
 
   .#{$prefix}--snippet--multi.#{$prefix}--snippet--no-copy
@@ -233,24 +232,6 @@ $copy-btn-feedback: $background-inverse !default;
     padding-right: 0;
   }
 
-  // expanded pre
-  .#{$prefix}--snippet--multi.#{$prefix}--snippet--expand
-    .#{$prefix}--snippet-container
-    pre {
-    overflow-x: auto;
-  }
-
-  .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre::after {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: to-rem(16px);
-    height: 100%;
-    // Safari interprets `transparent` differently, so make color token value transparent instead:
-    background-image: linear-gradient(to right, rgba($layer, 0), $layer);
-    content: '';
-  }
-
   .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre code {
     overflow: hidden;
   }