build: 引入tailwindcss并迁移原有样式到原子类
1. 新增postcss、autoprefixer、tailwindcss依赖并初始化配置 2. 移除全局及页面级CSS文件,将样式替换为tailwind原子类 3. 重构API调用逻辑,拆分接口请求函数 4. 统一项目样式规范,优化布局与组件样式
This commit is contained in:
@@ -1,28 +0,0 @@
|
||||
.page-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.metric-card .label {
|
||||
color: #86909c;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.metric-card .value {
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.page-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.page-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
@@ -4,10 +4,9 @@ import { usePageData } from '../hooks/usePageData';
|
||||
import { hasPermissions } from '../utils/permission';
|
||||
import { NoAccessPage } from '../components/NoAccessPage';
|
||||
import { RequestLogTable } from '../components/RequestLogTable';
|
||||
import './index.css';
|
||||
|
||||
function MetricCard({ label, value }: { label: string; value: number | string }) {
|
||||
return <Card className="metric-card"><div className="label">{label}</div><div className="value">{value}</div></Card>;
|
||||
return <Card><div className="mb-2 text-muted">{label}</div><div className="text-[28px] font-bold">{value}</div></Card>;
|
||||
}
|
||||
|
||||
function DashboardPage({ profile }: { profile: AdminProfile | null }) {
|
||||
@@ -21,7 +20,7 @@ function DashboardPage({ profile }: { profile: AdminProfile | null }) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="page-grid">
|
||||
<div className="mb-4 grid grid-cols-1 gap-4 sm:grid-cols-2 min-[901px]:grid-cols-4">
|
||||
{canReadDramas && <MetricCard label="短剧管理" value={dramas.data.pagination.total} />}
|
||||
{canReadUsers && <MetricCard label="用户管理" value={users.data.pagination.total} />}
|
||||
{canReadLogs && <MetricCard label="请求日志" value={logs.data.pagination.total} />}
|
||||
|
||||
Reference in New Issue
Block a user