YogeLiu/doc_ai_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refact: update ui

Browse Source
This commit is contained in:
yoge
2026-03-25 14:06:37 +08:00
parent 276160d769
commit d13cb64567
28 changed files with 2451 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/pages/DocDetailPage.tsx
View File

@@ -1,5 +1,6 @@
import { useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
import { useParams, Link } from 'react-router-dom';
import { ArrowLeft } from 'lucide-react';
import SEOHead from '../components/seo/SEOHead';
import { useLanguage } from '../contexts/LanguageContext';
import { loadContent, type ContentItem } from '../lib/content';
@@ -19,8 +20,12 @@ export default function DocDetailPage() {
if (!content) {
return (
<div className="max-w-4xl mx-auto py-16 px-6">
<p className="text-gray-600">{language === 'en' ? 'Loading...' : '加载中...'}</p>
<div className="max-w-3xl mx-auto py-20 px-6">
<div className="animate-pulse space-y-4">
<div className="h-4 bg-cream-200 rounded w-24" />
<div className="h-8 bg-cream-200 rounded w-3/4" />
<div className="h-4 bg-cream-200 rounded w-full" />
</div>
</div>
);
}
@@ -32,9 +37,27 @@ export default function DocDetailPage() {
description={content.meta.description}
path={`/docs/${slug}`}
/>
<div className="max-w-4xl mx-auto py-16 px-6">
<div className="max-w-3xl mx-auto py-16 lg:py-20 px-6">
{/* Back link */}
<Link
to="/docs"
className="inline-flex items-center gap-1.5 text-sm text-ink-muted hover:text-ink transition-colors mb-8"
>
<ArrowLeft size={14} />
{language === 'en' ? 'All docs' : '所有文档'}
</Link>
{/* Doc body */}
<article
className="prose prose-gray max-w-none"
className="prose prose-lg prose-warm max-w-none
prose-headings:font-display prose-headings:tracking-tight
prose-h1:text-3xl prose-h1:font-bold
prose-h2:text-2xl prose-h2:font-semibold prose-h2:mt-10
prose-a:text-sage-700 prose-a:no-underline hover:prose-a:underline
prose-code:text-sage-700 prose-code:bg-sage-50 prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded-md prose-code:text-sm
prose-pre:bg-ink prose-pre:text-cream-100 prose-pre:rounded-xl
prose-img:rounded-xl
prose-blockquote:border-sage-300 prose-blockquote:bg-sage-50/30 prose-blockquote:rounded-r-xl prose-blockquote:py-1"
dangerouslySetInnerHTML={{ __html: content.html }}
/>
</div>