主要变更: - 将所有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>
43 lines
547 B
Plaintext
43 lines
547 B
Plaintext
// 变量定义
|
|
@bg-color: #f5f5f5;
|
|
@text-secondary: #999;
|
|
|
|
// 页面容器
|
|
.profile-page {
|
|
min-height: 100vh;
|
|
background-color: @bg-color;
|
|
padding: 16px;
|
|
padding-bottom: 70px;
|
|
}
|
|
|
|
// 用户卡片
|
|
.user-card {
|
|
margin-bottom: 16px;
|
|
}
|
|
|
|
.user-info {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 16px;
|
|
}
|
|
|
|
.user-details {
|
|
flex: 1;
|
|
}
|
|
|
|
.user-nickname {
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.user-username {
|
|
font-size: 14px;
|
|
color: @text-secondary;
|
|
}
|
|
|
|
// 登出容器
|
|
.logout-container {
|
|
margin-top: 24px;
|
|
}
|