From de98d11d650d28db1af23161257199e1e065fd5d Mon Sep 17 00:00:00 2001 From: "Apple\\Apple" Date: Sun, 25 May 2025 13:01:31 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=96=BC=EF=B8=8Ffeat(ui):=20unify=20card?= =?UTF-8?q?=20header=20styles=20across=20edit=20pages?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This commit standardizes the card header design across multiple edit pages to create a consistent and modern UI experience. Changes made: - Add gradient background colors to card headers - Implement decorative circular elements for visual appeal - Update icon colors to white with semi-transparent backgrounds - Standardize text colors and opacity for better readability - Add consistent padding and border radius - Maintain unique color schemes for different functional sections Modified files: - EditChannel.js - EditRedemption.js - EditToken.js - EditUser.js - AddUser.js The new design features: - Blue gradient for basic information sections - Green gradient for quota/permission settings - Purple gradient for access restrictions - Orange gradient for binding/group information - Consistent layout structure across all edit pages This update improves visual hierarchy and maintains brand consistency while enhancing the overall user experience. --- web/src/pages/Redemption/EditRedemption.js | 38 +++++++---- web/src/pages/Token/EditToken.js | 76 +++++++++++++++------- web/src/pages/User/AddUser.js | 19 ++++-- web/src/pages/User/EditUser.js | 57 +++++++++++----- 4 files changed, 130 insertions(+), 60 deletions(-) diff --git a/web/src/pages/Redemption/EditRedemption.js b/web/src/pages/Redemption/EditRedemption.js index 33279395..1529a1cd 100644 --- a/web/src/pages/Redemption/EditRedemption.js +++ b/web/src/pages/Redemption/EditRedemption.js @@ -191,13 +191,20 @@ const EditRedemption = (props) => {
-
-
- +
+
+
+
-
- {t('基本信息')} -
{t('设置兑换码的基本信息')}
+
+ +
+
+ {t('基本信息')} +
{t('设置兑换码的基本信息')}
@@ -219,13 +226,20 @@ const EditRedemption = (props) => { -
-
- +
+
+
+
-
- {t('额度设置')} -
{t('设置兑换码的额度和数量')}
+
+ +
+
+ {t('额度设置')} +
{t('设置兑换码的额度和数量')}
diff --git a/web/src/pages/Token/EditToken.js b/web/src/pages/Token/EditToken.js index 75f5e651..ad8c11c8 100644 --- a/web/src/pages/Token/EditToken.js +++ b/web/src/pages/Token/EditToken.js @@ -312,13 +312,20 @@ const EditToken = (props) => {
-
-
- +
+
+
+
-
- {t('基本信息')} -
{t('设置令牌的基本信息')}
+
+ +
+
+ {t('基本信息')} +
{t('设置令牌的基本信息')}
@@ -394,13 +401,20 @@ const EditToken = (props) => { -
-
- +
+
+
+
-
- {t('额度设置')} -
{t('设置令牌可用额度和数量')}
+
+ +
+
+ {t('额度设置')} +
{t('设置令牌可用额度和数量')}
@@ -475,13 +489,20 @@ const EditToken = (props) => { -
-
- +
+
+
+
-
- {t('访问限制')} -
{t('设置令牌的访问限制')}
+
+ +
+
+ {t('访问限制')} +
{t('设置令牌的访问限制')}
@@ -526,13 +547,20 @@ const EditToken = (props) => { -
-
- +
+
+
+
-
- {t('分组信息')} -
{t('设置令牌的分组')}
+
+ +
+
+ {t('分组信息')} +
{t('设置令牌的分组')}
diff --git a/web/src/pages/User/AddUser.js b/web/src/pages/User/AddUser.js index cb0b410b..99620cfe 100644 --- a/web/src/pages/User/AddUser.js +++ b/web/src/pages/User/AddUser.js @@ -114,13 +114,20 @@ const AddUser = (props) => {
-
-
- +
+
+
+
-
- {t('用户信息')} -
{t('创建新用户账户')}
+
+ +
+
+ {t('用户信息')} +
{t('创建新用户账户')}
diff --git a/web/src/pages/User/EditUser.js b/web/src/pages/User/EditUser.js index 51fcd5b3..747628bb 100644 --- a/web/src/pages/User/EditUser.js +++ b/web/src/pages/User/EditUser.js @@ -191,13 +191,20 @@ const EditUser = (props) => {
-
-
- +
+
+
+
-
- {t('基本信息')} -
{t('用户的基本账户信息')}
+
+ +
+
+ {t('基本信息')} +
{t('用户的基本账户信息')}
@@ -246,13 +253,20 @@ const EditUser = (props) => { {userId && ( -
-
- +
+
+
+
-
- {t('权限设置')} -
{t('用户分组和额度管理')}
+
+ +
+
+ {t('权限设置')} +
{t('用户分组和额度管理')}
@@ -307,13 +321,20 @@ const EditUser = (props) => { )} -
-
- +
+
+
+
-
- {t('绑定信息')} -
{t('第三方账户绑定状态（只读）')}
+
+ +
+
+ {t('绑定信息')} +
{t('第三方账户绑定状态（只读）')}