feat: 优化代码块样式

huayemao · Jun 21, 2024 · f9fc467 · f9fc467
1 parent 000dfa7
commit f9fc467
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 5 deletions.
diff --git a/components/Pre.tsx b/components/Pre.tsx
@@ -13,7 +13,7 @@ export const Pre = ({
   const lidEl = arr[0] as ReactElement;
   const containerEl = arr[1] as ReactElement;
   return (
-    <pre {...props} ref={preRef} className="relative !pt-14">
+    <pre {...props} ref={preRef} className="relative !pt-10 !overflow-x-hidden">
       <div className="absolute top-0 right-0 left-0 flex items-center justify-between w-full px-6 py-2 pr-4 bg-muted-700 text-muted-100">
         <span className="text-xs lowercase">{lidEl.props.children}</span>
         <div className="flex items-center space-x-1">

diff --git a/components/copy-to-clipboard.tsx b/components/copy-to-clipboard.tsx
@@ -1,4 +1,3 @@
-import { BaseButtonIcon } from '@shuriken-ui/react'
 import { CheckIcon, CopyIcon } from 'lucide-react'
 import type { ComponentProps, ReactElement } from 'react'
 import { useCallback, useEffect, useState } from 'react'
@@ -40,8 +39,6 @@ export const CopyToClipboard = ({
 
   return (
     /* @ts-ignore */
-    <BaseButtonIcon size='sm' onClick={handleClick} title="Copy code" tabIndex={0} {...props}>
-      <IconToUse className="h-4 w-4" />
-    </BaseButtonIcon>
+      <IconToUse className="h-4 w-4" onClick={handleClick}  title="Copy code" tabIndex={0} {...props}></IconToUse>
   )
 }
diff --git a/styles/post.module.css b/styles/post.module.css
@@ -1 +1,5 @@
 
+.content :global .code-container {
+    @apply overflow-x-auto;
+  }
+