diff --git a/src/pages/UserHome/UserHome.css b/src/pages/UserHome/UserHome.css index 0bfa803..874b633 100644 --- a/src/pages/UserHome/UserHome.css +++ b/src/pages/UserHome/UserHome.css @@ -1027,3 +1027,282 @@ a.userhome-info-item.userhome-link:hover { [data-theme="dark"] .userhome-recent-fav-meta { color: #64748b; } + +/* ============================================================ + 语雀极简 · 覆盖层 + 居中单列布局 · 大留白 · 时间线文章列表 + ============================================================ */ +.userhome-page { + background: #f8fafc; +} + +.userhome-particles, +.userhome-particle { + display: none; +} + +.userhome-hero { + background: #ffffff; + padding: 64px 20px 36px; + border-bottom: 1px solid #f1f5f9; +} + +.userhome-hero-content { + max-width: 720px; + text-align: center; +} + +.userhome-avatar-wrap { + margin-bottom: 18px; +} + +.userhome-avatar { + border: none; + box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08); + width: 88px !important; + height: 88px !important; + font-size: 32px !important; +} + +.userhome-level-badge { + background: #667eea; + box-shadow: none; +} + +.userhome-name { + font-size: 26px; + color: #1e293b; + display: inline-flex; + align-items: center; + gap: 10px; +} + +.userhome-gender.male { + color: #667eea; +} + +.userhome-gender.female { + color: #f093fb; +} + +.userhome-badge { + display: inline-flex; + align-items: center; + background: #f1f5f9; + color: #64748b; + border-radius: 20px; + padding: 3px 12px; + font-size: 12px; +} + +.userhome-bio { + color: #64748b; + font-size: 14px; + line-height: 1.7; + margin: 12px 0 18px; +} + +.userhome-info-row { + justify-content: center; + gap: 20px; + margin-bottom: 20px; +} + +.userhome-info-item { + color: #94a3b8; + font-size: 13px; +} + +.userhome-stats-row { + justify-content: center; + background: #f1f5f9; + border-radius: 12px; + padding: 12px 28px; + width: fit-content; + margin: 0 auto 22px; +} + +.userhome-stat-value { + font-size: 18px; + color: #1e293b; +} + +.userhome-stat-label { + color: #94a3b8; + font-size: 12px; +} + +.userhome-stat-divider { + background: #e2e8f0; +} + +.userhome-stats-row--visitor { + padding: 12px 20px; +} + +.userhome-stat-visitor-hint { + color: #64748b; + font-size: 13px; +} + +.userhome-actions { + justify-content: center; +} + +.userhome-action-btn { + background: #fff; + border: 1px solid #e2e8f0; + color: #475569; + border-radius: 8px; +} + +.userhome-action-btn:hover { + border-color: #cbd5e1; + color: #1e293b; +} + +.userhome-action-btn.primary { + background: #667eea; + border-color: #667eea; +} + +.userhome-action-btn.primary:hover { + background: #5a73e0; +} + +/* 容器:单列居中,隐藏侧栏 */ +.userhome-container { + max-width: 720px; + grid-template-columns: 1fr; + gap: 0; + padding: 20px 20px 60px; +} + +.userhome-sidebar { + display: none; +} + +.userhome-main { + width: 100%; +} + +.userhome-tabs .ant-tabs-nav { + background: transparent; + box-shadow: none; + border-bottom: 1px solid #f1f5f9; + border-radius: 0; + padding: 0; + margin-bottom: 24px; +} + +.userhome-tabs .ant-tabs-tab { + padding: 10px 18px !important; + font-weight: 500; + color: #94a3b8; +} + +.userhome-tabs .ant-tabs-ink-bar { + background: #667eea; +} + +.userhome-tabs .ant-tabs-tab-active .userhome-tab-label { + color: #1e293b; + font-weight: 600; +} + +/* 文章 → 时间线 */ +.userhome-articles-grid { + display: block; +} + +.userhome-articles-grid .ant-empty { + padding: 60px 0; +} + +.userhome-article-card { + background: transparent; + border-radius: 0; + box-shadow: none; + overflow: visible; + position: relative; + border-left: 2px solid #e2e8f0; + padding: 0 0 32px 24px; + margin-left: 6px; +} + +.userhome-article-card::before { + content: ''; + position: absolute; + left: -7px; + top: 6px; + width: 12px; + height: 12px; + border-radius: 50%; + background: #667eea; + border: 3px solid #fff; + box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.25); +} + +.userhome-article-card:last-child { + border-left-color: transparent; +} + +.userhome-article-card:hover { + transform: none; + box-shadow: none; +} + +.userhome-article-cover, +.userhome-article-cover-overlay, +.userhome-article-card:hover .userhome-article-cover img { + display: none; +} + +.userhome-article-body { + padding: 0; +} + +.userhome-article-title { + font-size: 16px; + font-weight: 600; + color: #1e293b; + margin: 0 0 6px; + transition: color 0.2s; +} + +.userhome-article-card:hover .userhome-article-title { + color: #667eea; +} + +.userhome-article-summary { + font-size: 13px; + color: #64748b; + margin: 0 0 10px; +} + +.userhome-article-meta { + margin-bottom: 6px; +} + +.userhome-article-tags .ant-tag { + background: #f0f4ff; + color: #667eea; + border-color: transparent; +} + +.userhome-article-stats { + color: #94a3b8; +} + +.userhome-article-time { + color: #94a3b8; +} + +/* 其余内容 Tab:极简去重阴影 */ +.userhome-learning, +.userhome-activities, +.userhome-favorites, +.userhome-analytics { + background: transparent; +} + diff --git a/vite.config.ts b/vite.config.ts index b11ce0e..b07f48e 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -33,6 +33,15 @@ export default defineConfig({ target: 'http://127.0.0.1:8000', changeOrigin: true, }, + '/user': { + target: 'http://127.0.0.1:8000', + changeOrigin: true, + bypass: (req) => { + if (req.headers.accept?.includes('text/html')) { + return req.url; + } + }, + }, }, }, plugins: [react()],