fix: comprehensive dark theme removal - all admin pages, storage, models, achievements, developer tools, front CSS

This commit is contained in:
qyyfw committed 2026-07-07 23:05:55 +08:00
1 parent a6522d5069
commit c729f61831
5 files changed
+82 -82

No files matched your search

+24 -24
View File
@@ -269,65 +269,65 @@ const Achievement: React.FC = () => {
return (
<div className="admin-page" style={{ padding: '24px' }}>
<style>{`
.ach-tabs { display: flex; gap: 4px; margin-bottom: 24px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.ach-tabs { display: flex; gap: 4px; margin-bottom: 24px; border-bottom: 1px solid rgba(0,0,0,0.08); }
.ach-tab { padding: 10px 20px; cursor: pointer; color: rgba(255,255,255,0.5); font-size: 14px; border-bottom: 2px solid transparent; transition: all 0.2s; background: none; border-top: none; border-left: none; border-right: none; }
.ach-tab:hover { color: rgba(255,255,255,0.8); }
.ach-tab.active { color: #6C63FF; border-bottom-color: #6C63FF; }
.ach-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; margin-bottom: 24px; }
.ach-stat-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; padding: 20px; }
.ach-stat-card .label { font-size: 12px; color: rgba(255,255,255,0.4); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }
.ach-stat-card .value { font-size: 28px; font-weight: 700; color: #fff; }
.ach-stat-card { background: rgba(0,0,0,0.02); border: 1px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 20px; }
.ach-stat-card .label { font-size: 12px; color: rgba(0,0,0,0.4); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }
.ach-stat-card .value { font-size: 28px; font-weight: 700; color: #1A1F36; }
.ach-cat-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.ach-cat-bar .cat-label { width: 80px; font-size: 13px; color: rgba(255,255,255,0.6); }
.ach-cat-bar .cat-track { flex: 1; height: 8px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden; }
.ach-cat-bar .cat-label { width: 80px; font-size: 13px; color: rgba(0,0,0,0.6); }
.ach-cat-bar .cat-track { flex: 1; height: 8px; background: rgba(0,0,0,0.06); border-radius: 4px; overflow: hidden; }
.ach-cat-bar .cat-fill { height: 100%; border-radius: 4px; transition: width 0.3s; }
.ach-cat-bar .cat-count { width: 30px; text-align: right; font-size: 13px; color: rgba(255,255,255,0.8); font-weight: 600; }
.ach-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.ach-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; padding: 20px; transition: all 0.2s; position: relative; }
.ach-card:hover { border-color: rgba(108,99,255,0.3); background: rgba(255,255,255,0.05); }
.ach-card { background: rgba(0,0,0,0.02); border: 1px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 20px; transition: all 0.2s; position: relative; }
.ach-card:hover { border-color: rgba(108,99,255,0.3); background: rgba(0,0,0,0.04); }
.ach-card.completed { border-color: rgba(0,212,170,0.3); }
.ach-card .ach-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; margin-bottom: 12px; }
.ach-card .ach-name { font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 4px; }
.ach-card .ach-desc { font-size: 13px; color: rgba(255,255,255,0.4); margin-bottom: 12px; line-height: 1.5; }
.ach-card .ach-name { font-size: 16px; font-weight: 600; color: #1A1F36; margin-bottom: 4px; }
.ach-card .ach-desc { font-size: 13px; color: rgba(0,0,0,0.4); margin-bottom: 12px; line-height: 1.5; }
.ach-card .ach-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.ach-badge { padding: 3px 8px; border-radius: 4px; font-size: 11px; font-weight: 500; }
.ach-progress-bar { height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; margin-bottom: 8px; }
.ach-progress-bar { height: 6px; background: rgba(0,0,0,0.06); border-radius: 3px; overflow: hidden; margin-bottom: 8px; }
.ach-progress-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg, #6C63FF, #8B80FF); transition: width 0.3s; }
.ach-progress-fill.done { background: linear-gradient(90deg, #00D4AA, #00E4B4); }
.ach-progress-text { display: flex; justify-content: space-between; font-size: 12px; color: rgba(255,255,255,0.4); }
.ach-progress-text { display: flex; justify-content: space-between; font-size: 12px; color: rgba(0,0,0,0.4); }
.ach-actions { display: flex; gap: 8px; margin-top: 12px; }
.ach-btn { padding: 6px 12px; border-radius: 6px; font-size: 12px; cursor: pointer; border: none; transition: all 0.2s; }
.ach-btn-primary { background: #6C63FF; color: #fff; }
.ach-btn-primary { background: #6C63FF; color: #1A1F36; }
.ach-btn-primary:hover { background: #5B52E0; }
.ach-btn-danger { background: rgba(255,107,107,0.15); color: #FF6B6B; }
.ach-btn-danger:hover { background: rgba(255,107,107,0.25); }
.ach-btn-success { background: rgba(0,212,170,0.15); color: #00D4AA; }
.ach-btn-success:hover { background: rgba(0,212,170,0.25); }
.ach-btn-ghost { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.6); }
.ach-btn-ghost:hover { background: rgba(255,255,255,0.1); }
.ach-btn-ghost { background: rgba(0,0,0,0.06); color: rgba(0,0,0,0.6); }
.ach-btn-ghost:hover { background: rgba(0,0,0,0.10); }
.ach-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.ach-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.ach-select { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 8px 12px; color: #fff; font-size: 13px; }
.ach-select { background: rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.10); border-radius: 8px; padding: 8px 12px; color: #1A1F36; font-size: 13px; }
.ach-select option { background: #1A1A2E; }
.ach-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.ach-modal { background: #1E1E36; border: 1px solid rgba(255,255,255,0.1); border-radius: 16px; padding: 28px; width: 480px; max-width: 90vw; max-height: 90vh; overflow-y: auto; }
.ach-modal h2 { font-size: 20px; color: #fff; margin-bottom: 20px; }
.ach-modal { background: #1E1E36; border: 1px solid rgba(0,0,0,0.10); border-radius: 16px; padding: 28px; width: 480px; max-width: 90vw; max-height: 90vh; overflow-y: auto; }
.ach-modal h2 { font-size: 20px; color: #1A1F36; margin-bottom: 20px; }
.ach-field { margin-bottom: 16px; }
.ach-field label { display: block; font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 6px; }
.ach-field input, .ach-field select, .ach-field textarea { width: 100%; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 10px 12px; color: #fff; font-size: 14px; box-sizing: border-box; }
.ach-field input, .ach-field select, .ach-field textarea { width: 100%; background: rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.10); border-radius: 8px; padding: 10px 12px; color: #1A1F36; font-size: 14px; box-sizing: border-box; }
.ach-field input:focus, .ach-field select:focus, .ach-field textarea:focus { outline: none; border-color: #6C63FF; }
.ach-field select option { background: #1A1A2E; }
.ach-field-row { display: flex; gap: 12px; }
.ach-field-row .ach-field { flex: 1; }
.ach-empty { text-align: center; padding: 60px 20px; color: rgba(255,255,255,0.3); }
.ach-lb-table { width: 100%; border-collapse: collapse; }
.ach-lb-table th { text-align: left; padding: 12px 16px; font-size: 12px; color: rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.ach-lb-table th { text-align: left; padding: 12px 16px; font-size: 12px; color: rgba(0,0,0,0.4); text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid rgba(0,0,0,0.08); }
.ach-lb-table td { padding: 14px 16px; font-size: 14px; color: rgba(255,255,255,0.8); border-bottom: 1px solid rgba(255,255,255,0.04); }
.ach-lb-rank { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; font-size: 13px; font-weight: 700; }
.ach-lb-rank.gold { background: rgba(255,184,0,0.15); color: #FFB800; }
.ach-lb-rank.silver { background: rgba(192,192,192,0.15); color: #C0C0C0; }
.ach-lb-rank.bronze { background: rgba(205,127,50,0.15); color: #CD7F32; }
.ach-lb-rank.normal { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.5); }
.ach-lb-rank.normal { background: rgba(0,0,0,0.06); color: rgba(255,255,255,0.5); }
.ach-error { background: rgba(255,107,107,0.1); border: 1px solid rgba(255,107,107,0.2); border-radius: 8px; padding: 12px 16px; color: #FF6B6B; font-size: 13px; margin-bottom: 16px; }
`}</style>
@@ -381,7 +381,7 @@ const Achievement: React.FC = () => {
</div>
</div>
<div style={{ background: 'rgba(255,255,255,0.03)', border: '1px solid rgba(255,255,255,0.08)', borderRadius: '12px', padding: '24px' }}>
<div style={{ background: 'rgba(0,0,0,0.02)', border: '1px solid rgba(0,0,0,0.08)', borderRadius: '12px', padding: '24px' }}>
<h3 style={{ fontSize: '16px', color: '#fff', marginBottom: '20px' }}>分类分布</h3>
{Object.entries(stats.by_category).map(([cat, count]) => {
const pct = stats.total_achievements > 0 ? (count / stats.total_achievements) * 100 : 0;
@@ -432,7 +432,7 @@ const Achievement: React.FC = () => {
<div className="ach-desc">{ach.description || '暂无描述'}</div>
<div className="ach-meta">
<span className="ach-badge" style={{ background: `${color}20`, color }}>{CATEGORY_LABELS[ach.category] || ach.category}</span>
<span className="ach-badge" style={{ background: 'rgba(255,255,255,0.06)', color: 'rgba(255,255,255,0.6)' }}>
<span className="ach-badge" style={{ background: 'rgba(0,0,0,0.06)', color: 'rgba(0,0,0,0.6)' }}>
{CRITERIA_LABELS[ach.criteria_type] || ach.criteria_type}: {ach.criteria_value}
</span>
<span className="ach-badge" style={{ background: 'rgba(255,184,0,0.1)', color: '#FFB800' }}>
@@ -558,7 +558,7 @@ const Achievement: React.FC = () => {
<td>{entry.username || entry.user_id || '匿名用户'}</td>
<td>{entry.achievement_count || 0}</td>
<td style={{ color: '#FFB800', fontWeight: 600 }}>{entry.total_points || 0}</td>
<td style={{ color: 'rgba(255,255,255,0.4)' }}>
<td style={{ color: 'rgba(0,0,0,0.4)' }}>
{entry.last_completed ? new Date(entry.last_completed).toLocaleDateString('zh-CN') : '-'}
</td>
</tr>