From 2af7d0ebdccc9332e0f7fad8114e32ae6671e2b3 Mon Sep 17 00:00:00 2001
From: Charles Zhao <charleszhao@silverhand.io>
Date: Wed, 8 Jan 2025 11:51:01 +0800
Subject: [PATCH] fix: styles for code editor embedded in admonition

---
 src/scss/custom.scss                          | 2 +-
 src/theme/Admonition/Layout/styles.module.css | 1 +
 src/theme/CodeBlock/Content/String.tsx        | 3 +--
 src/theme/CodeBlock/Content/styles.module.css | 1 +
 4 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/scss/custom.scss b/src/scss/custom.scss
index ad2d32611b9..7b546423bb9 100644
--- a/src/scss/custom.scss
+++ b/src/scss/custom.scss
@@ -809,7 +809,7 @@ table {
 }
 
 html[data-theme='dark'] {
-  .alert pre code {
+  .alert pre {
     background-color: #181132;
   }
 }
diff --git a/src/theme/Admonition/Layout/styles.module.css b/src/theme/Admonition/Layout/styles.module.css
index dc933781f66..e69eb729a2e 100644
--- a/src/theme/Admonition/Layout/styles.module.css
+++ b/src/theme/Admonition/Layout/styles.module.css
@@ -36,6 +36,7 @@
 
 .content {
   display: inline-block;
+  width: 100%;
 
   > p:first-of-type {
     display: inline;
diff --git a/src/theme/CodeBlock/Content/String.tsx b/src/theme/CodeBlock/Content/String.tsx
index f55d4e90230..b9edd1cda5b 100644
--- a/src/theme/CodeBlock/Content/String.tsx
+++ b/src/theme/CodeBlock/Content/String.tsx
@@ -68,13 +68,12 @@ export default function CodeBlockString({
       {title && <div className={styles.codeBlockTitle}>{title}</div>}
       <div className={styles.codeBlockContent}>
         <Highlight theme={prismTheme} code={code} language={language ?? 'text'}>
-          {({ className, style, tokens, getLineProps, getTokenProps }) => (
+          {({ className, tokens, getLineProps, getTokenProps }) => (
             <pre
               ref={wordWrap.codeBlockRef}
               // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
               tabIndex={0}
               className={clsx(className, styles.codeBlock, 'thin-scrollbar')}
-              style={style}
             >
               <code
                 className={clsx(
diff --git a/src/theme/CodeBlock/Content/styles.module.css b/src/theme/CodeBlock/Content/styles.module.css
index 52997647e41..6ef8030b8a0 100644
--- a/src/theme/CodeBlock/Content/styles.module.css
+++ b/src/theme/CodeBlock/Content/styles.module.css
@@ -3,6 +3,7 @@
   /* rtl:ignore */
   direction: ltr;
   border-radius: inherit;
+  width: 100%;
 }
 
 .codeBlockTitle {