fix: code block overflow scrolling

Author: Ehesp

website-v3/src/components/Markdown.tsx

@@ -29,7 +29,7 @@ const Markdown: React.FC = () => {
       prose prose-slate dark:prose-invert prose-p:leading-loose
       dark:prose-a:text-white 
       prose-a:font-bold prose-a:underline-offset-[5px] prose-a:decoration-docs-theme prose-a:decoration-2 hover:prose-a:decoration-4 prose-headings:mb-[1rem] 
-      prose-pre:m-0 
+      prose-pre:m-0
       prose-pre:rounded-none prose-code:rounded
       prose-code:border prose-code:bg-gray-50/50 prose-code:px-1.5 prose-code:py-1 prose-code:text-xs prose-code:font-thin prose-code:before:content-[''] prose-code:after:content-[''] prose-code:dark:border-zinc-700 prose-code:dark:bg-zinc-800/50 prose-table:w-auto
       max-w-none

website-v3/src/components/mdx/CodeBlock.tsx

@@ -19,14 +19,14 @@ const CodeBlock: React.FC<CodeBlockProps> = props => {
           <button
             data-copy
             data-copy-value={props.raw}
-            className="absolute top-2 right-2 rounded bg-[#19191d] px-3 py-1 font-mono text-xs text-white opacity-0 transition hover:bg-black/50 group-hover:opacity-100 data-[copied=true]:[&>span]:hidden"
+            className="data-[copied=true]:[&>span]:hidden absolute top-2 right-2 rounded bg-[#19191d] px-3 py-1 font-mono text-xs text-white opacity-0 transition hover:bg-black/50 group-hover:opacity-100"
           >
             Copy
           </button>
           <div
             dangerouslySetInnerHTML={{ __html: props.html }}
             className={cx(
-              'not-prose overflow-hidden border-white/10 text-xs [&>pre>code>.line]:leading-6 [&>pre]:p-3',
+              'not-prose [&>pre]:overflow-x-auto [&>pre>code>.line]:leading-6 [&>pre]:p-3 overflow-hidden border-white/10 text-xs',
               {
                 'rounded-xl border': !props.title,
                 'rounded-b-xl dark:border-b dark:border-r dark:border-l': !!props.title,