主要变更: - 将所有CSS文件迁移到Less预处理器 - 配置Vite支持Less编译 - 使用Less变量、嵌套和父选择器优化样式代码 - 添加用户注册和登录功能 - 实现用户认证中间件和保护路由 - 新增Profile和Login页面 - 添加底部导航栏组件TabBarLayout - 更新CLAUDE.md为中文文档 技术改进: - Less变量统一管理主题色和间距 - CSS嵌套提高代码可读性和可维护性 - 模块化样式组织更清晰 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
49 lines
1.4 KiB
TypeScript
49 lines
1.4 KiB
TypeScript
import React from 'react'
|
|
import { useNavigate } from 'react-router-dom'
|
|
import { NavBar, Card, List, Space, Button } from 'antd-mobile'
|
|
import styles from './About.module.less'
|
|
|
|
const About: React.FC = () => {
|
|
const navigate = useNavigate()
|
|
|
|
return (
|
|
<div className={styles.container}>
|
|
<NavBar onBack={() => navigate(-1)}>关于</NavBar>
|
|
|
|
<div className={styles.content}>
|
|
<Card title="项目信息">
|
|
<Space direction="vertical" block>
|
|
<List>
|
|
<List.Item extra="1.0.0">版本</List.Item>
|
|
<List.Item extra="AnKao Team">开发者</List.Item>
|
|
<List.Item extra="MIT">许可证</List.Item>
|
|
</List>
|
|
|
|
<Card title="功能特性">
|
|
<List>
|
|
<List.Item>✅ 响应式移动端设计</List.Item>
|
|
<List.Item>✅ TypeScript 类型安全</List.Item>
|
|
<List.Item>✅ Vite 快速构建</List.Item>
|
|
<List.Item>✅ antd-mobile 组件库</List.Item>
|
|
<List.Item>✅ React Router 路由</List.Item>
|
|
<List.Item>✅ API 代理配置</List.Item>
|
|
</List>
|
|
</Card>
|
|
|
|
<Button
|
|
color="primary"
|
|
size="large"
|
|
block
|
|
onClick={() => navigate('/')}
|
|
>
|
|
返回首页
|
|
</Button>
|
|
</Space>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default About
|