/* 代码块容器样式 */ .prose pre { position: relative; margin: 1.5em 0; padding: 0; border-radius: 0.5rem; /* 调整背景色和边框 */ background-color: #282c34 !important; border: 1px solid #374151; overflow: hidden; } .prose pre:hover { /* 移除之前的transform和shadow */ } /* 代码块顶部栏 - 调整颜色使其更突出 */ .code-header { display: flex; justify-content: space-between; align-items: center; /* 修改背景色为更深的颜色 */ background-color: #21252b; padding: 0.5rem 1rem; /* 调整边框颜色 */ border-bottom: 1px solid #374151; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } /* 语言标签 */ .code-language { font-size: 0.75rem; font-weight: 600; /* 调整颜色使其更明显 */ color: #d1d5db; text-transform: uppercase; letter-spacing: 0.05em; } /* 复制按钮 - 增强视觉效果 */ .code-copy-button { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0.35rem 0.75rem; font-size: 0.75rem; /* 调整按钮颜色 */ color: #d1d5db; background-color: #2c313a; border: 1px solid #4b5563; border-radius: 0.25rem; cursor: pointer; transition: all 0.2s ease; } .code-copy-button svg { width: 14px; height: 14px; stroke: currentColor; flex-shrink: 0; } .code-copy-button span { font-size: 0.75rem; font-weight: 500; line-height: 1; } .code-copy-button:hover { background-color: #374151; color: #f3f4f6; border-color: #6b7280; } .code-copy-button:active { transform: scale(0.95); } /* 代码内容区域 */ .prose pre code { display: block; padding: 1.5em 1.25em; overflow-x: auto; font-family: "JetBrains Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.9em; line-height: 1.6; tab-size: 2; /* 调整文字颜色 */ color: #abb2bf !important; } /* 自定义滚动条 */ .prose pre code::-webkit-scrollbar { height: 8px; background-color: #282c34; } .prose pre code::-webkit-scrollbar-thumb { background-color: #4b5363; border-radius: 4px; } .prose pre code::-webkit-scrollbar-thumb:hover { background-color: #5a6377; } .prose pre code::-webkit-scrollbar-track { background-color: #21252b; border-radius: 4px; } /* Firefox滚动条 */ .prose pre code { scrollbar-width: thin; scrollbar-color: #4b5363 #282c34; } /* 代码行高亮 */ .prose pre .highlight-line { background-color: rgba(171, 178, 191, 0.1); display: block; margin: 0 -1em; padding: 0 1em; } /* 行号 */ .prose pre code { counter-reset: line; } .prose pre code .line { display: inline-block; width: 100%; } /* 内联代码样式 */ .prose :not(pre) > code { background-color: rgba(171, 178, 191, 0.1); padding: 0.2em 0.4em; border-radius: 0.25em; font-weight: 400; white-space: nowrap; border: 1px solid rgba(171, 178, 191, 0.2); font-family: "JetBrains Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.85em; color: #e06c75; } /* 暗色模式适配 */ [data-theme="dark"] .prose pre, [data-theme="dark"] .code-header { background-color: #282c34 !important; border-color: #374151; } [data-theme="dark"] .code-copy-button { background-color: #2c313a; border-color: #4b5563; color: #d1d5db; } [data-theme="dark"] .code-copy-button:hover { background-color: #374151; color: #f3f4f6; border-color: #6b7280; } [data-theme="dark"] .prose pre code { /* 调整暗色模式文字颜色 */ color: #abb2bf; }