feat: align subscription and profile settings pages with V21 design system #28

Merged
xiaoxia merged 1 commits from feature/v21-subscription-profile into develop 2026-06-26 22:13:56 +08:00
Owner

Summary

将订阅和设置页面的样式对齐 V21 设计系统

Changes

  • 新增: ProfileSettings.css - 共享的 V21 样式文件
  • 修改: Billing.tsx - 使用 xx-settings-page 和 xx-result-page class
  • 修改: UpgradeSubscription.tsx - 使用 V21 卡片样式
  • 修改: Settings.tsx - 使用 xx-settings-card class
  • 修改: AccountSecurity.tsx - 使用 V21 卡片样式
  • 修改: NotificationSettings.tsx - 使用 V21 卡片样式
  • 修改: SessionManagement.tsx - 使用 V21 卡片样式

样式规范

  • 页面容器: xx-settings-page
  • 页面头部: xx-settings-head (白色半透明 + 28px圆角 + 大阴影)
  • 内容卡片: xx-settings-card (白色半透明 + 28px圆角 + 大阴影 + hover上移)
  • 结果页面: xx-result-page

Notes

  • 保持所有功能逻辑不变
  • 保留 export const Component = Xxx 导出
  • 去掉所有内联 style
## Summary 将订阅和设置页面的样式对齐 V21 设计系统 ### Changes - **新增**: `ProfileSettings.css` - 共享的 V21 样式文件 - **修改**: `Billing.tsx` - 使用 xx-settings-page 和 xx-result-page class - **修改**: `UpgradeSubscription.tsx` - 使用 V21 卡片样式 - **修改**: `Settings.tsx` - 使用 xx-settings-card class - **修改**: `AccountSecurity.tsx` - 使用 V21 卡片样式 - **修改**: `NotificationSettings.tsx` - 使用 V21 卡片样式 - **修改**: `SessionManagement.tsx` - 使用 V21 卡片样式 ### 样式规范 - 页面容器: `xx-settings-page` - 页面头部: `xx-settings-head` (白色半透明 + 28px圆角 + 大阴影) - 内容卡片: `xx-settings-card` (白色半透明 + 28px圆角 + 大阴影 + hover上移) - 结果页面: `xx-result-page` ### Notes - 保持所有功能逻辑不变 - 保留 `export const Component = Xxx` 导出 - 去掉所有内联 style
xiaoxia added 1 commit 2026-06-26 21:33:06 +08:00
feat: align subscription and profile settings pages with V21 design system
CI/CD Pipeline / Validate Code Quality And Tests (push) Waiting to run
CI/CD Pipeline / Validate Code Quality And Tests (pull_request) Waiting to run
4e1fb97c4a
- Add ProfileSettings.css with shared V21 styles
- Update Billing.tsx to use xx-settings-page and xx-result-page classes
- Update UpgradeSubscription.tsx to use V21 card styles
- Update Settings.tsx to use xx-settings-card class
- Update AccountSecurity.tsx to use V21 card styles
- Update NotificationSettings.tsx to use V21 card styles
- Update SessionManagement.tsx to use V21 card styles
- Replace inline styles with CSS classes
- Maintain all functionality and export Component
xiaoxia merged commit d6c1b9d5ed into develop 2026-06-26 22:13:56 +08:00
Sign in to join this conversation.