Merge pull request #104 from aws/dogusata/latest-vscode-and-mynahui-i…

…nline-code-are-not-aligned Latest VSCode and MynahUI, inline codes are not aligned with normal texts
aws · Sep 4, 2024 · 3777a39 · 3777a39
2 parents b184d55 + d3e76b8
commit 3777a39
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@aws/mynah-ui",
   "displayName": "AWS Mynah UI",
-  "version": "4.15.8",
+  "version": "4.15.9",
   "description": "AWS Toolkit VSCode and Intellij IDE Extension Mynah UI",
   "publisher": "Amazon Web Services",
   "license": "Apache License 2.0",

diff --git a/src/styles/components/_syntax-highlighter.scss b/src/styles/components/_syntax-highlighter.scss
@@ -105,18 +105,21 @@ pre > code.diff-highlight .token.inserted:not(.prefix) {
             padding: 0;
             user-select: text;
             display: inline-block;
+            position: relative;
+            vertical-align: middle;
         }
 
         &:after,
         &:before {
             content: '';
             position: absolute;
-            top: 0px;
-            height: 100%;
+            top: 50%;
+            height: var(--mynah-line-height);
             left: -4px;
             width: calc(100% + 8px);
             border-radius: var(--mynah-input-radius);
             box-sizing: border-box;
+            transform: translateY(-50%);
         }
         &:after {
             border: var(--mynah-border-width) solid var(--mynah-color-border-default);