From 5f011502d1a1fe141f44c639bfa7e80d9f09be50 Mon Sep 17 00:00:00 2001
From: t0ng7u <dev@aiass.cc>
Date: Mon, 14 Jul 2025 19:49:40 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8D=8Estyle(button):=20Optimize=20the=20c?=
 =?UTF-8?q?olors=20of=20all=20buttons=20to=20reduce=20visual=20fatigue?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/table/ChannelsTable.js    | 213 ++++++++-----------
 web/src/components/table/LogsTable.js        |  29 +--
 web/src/components/table/MjLogsTable.js      |  23 +-
 web/src/components/table/RedemptionsTable.js |  16 +-
 web/src/components/table/TaskLogsTable.js    |  23 +-
 web/src/components/table/TokensTable.js      |  29 +--
 web/src/components/table/UsersTable.js       |  11 +-
 web/src/helpers/render.js                    |   8 +-
 web/src/index.css                            |   6 +
 9 files changed, 134 insertions(+), 224 deletions(-)

diff --git a/web/src/components/table/ChannelsTable.js b/web/src/components/table/ChannelsTable.js
index 22491e5d..2582b950 100644
--- a/web/src/components/table/ChannelsTable.js
+++ b/web/src/components/table/ChannelsTable.js
@@ -563,7 +563,7 @@ const ChannelsTable = () => {
             {
               node: 'item',
               name: t('复制'),
-              type: 'primary',
+              type: 'tertiary',
               onClick: () => {
                 Modal.confirm({
                   title: t('确定是否要复制此渠道？'),
@@ -581,15 +581,15 @@ const ChannelsTable = () => {
                 aria-label={t('测试单个渠道操作项目组')}
               >
                 <Button
-                  theme='light'
                   size="small"
+                  type='tertiary'
                   onClick={() => testChannel(record, '')}
                 >
                   {t('测试')}
                 </Button>
                 <Button
-                  theme='light'
                   size="small"
+                  type='tertiary'
                   icon={<IconTreeTriangleDown />}
                   onClick={() => {
                     setCurrentTestChannel(record);
@@ -605,8 +605,7 @@ const ChannelsTable = () => {
                   {
                     record.status === 1 ? (
                       <Button
-                        theme='light'
-                        type='warning'
+                        type='danger'
                         size="small"
                         onClick={() => manageChannel(record.id, 'disable', record)}
                       >
@@ -614,8 +613,6 @@ const ChannelsTable = () => {
                       </Button>
                     ) : (
                       <Button
-                        theme='light'
-                        type='secondary'
                         size="small"
                         onClick={() => manageChannel(record.id, 'enable', record)}
                       >
@@ -635,7 +632,6 @@ const ChannelsTable = () => {
                     ]}
                   >
                     <Button
-                      theme='light'
                       type='tertiary'
                       size="small"
                       icon={<IconTreeTriangleDown />}
@@ -645,8 +641,7 @@ const ChannelsTable = () => {
               ) : (
                 record.status === 1 ? (
                   <Button
-                    theme='light'
-                    type='warning'
+                    type='danger'
                     size="small"
                     onClick={() => manageChannel(record.id, 'disable', record)}
                   >
@@ -654,8 +649,6 @@ const ChannelsTable = () => {
                   </Button>
                 ) : (
                   <Button
-                    theme='light'
-                    type='secondary'
                     size="small"
                     onClick={() => manageChannel(record.id, 'enable', record)}
                   >
@@ -665,7 +658,6 @@ const ChannelsTable = () => {
               )}
 
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 onClick={() => {
@@ -683,7 +675,6 @@ const ChannelsTable = () => {
               >
                 <Button
                   icon={<IconMore />}
-                  theme='light'
                   type='tertiary'
                   size="small"
                 />
@@ -695,23 +686,20 @@ const ChannelsTable = () => {
           return (
             <Space wrap>
               <Button
-                theme='light'
-                type='secondary'
+                type='tertiary'
                 size="small"
                 onClick={() => manageTag(record.key, 'enable')}
               >
                 {t('启用全部')}
               </Button>
               <Button
-                theme='light'
-                type='warning'
+                type='tertiary'
                 size="small"
                 onClick={() => manageTag(record.key, 'disable')}
               >
                 {t('禁用全部')}
               </Button>
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 onClick={() => {
@@ -783,22 +771,13 @@ const ChannelsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className="flex justify-end">
-            <Button
-              theme="light"
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme="light"
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -1605,7 +1584,6 @@ const ChannelsTable = () => {
           <Button
             size='small'
             disabled={!enableBatchDelete}
-            theme='light'
             type='danger'
             className="w-full md:w-auto"
             onClick={() => {
@@ -1622,8 +1600,7 @@ const ChannelsTable = () => {
           <Button
             size='small'
             disabled={!enableBatchDelete}
-            theme='light'
-            type='primary'
+            type='tertiary'
             onClick={() => setShowBatchSetTag(true)}
             className="w-full md:w-auto"
           >
@@ -1638,8 +1615,7 @@ const ChannelsTable = () => {
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
-                    type='warning'
+                    type='tertiary'
                     className="w-full"
                     onClick={() => {
                       Modal.confirm({
@@ -1657,7 +1633,23 @@ const ChannelsTable = () => {
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
+                    className="w-full"
+                    onClick={() => {
+                      Modal.confirm({
+                        title: t('确定是否要修复数据库一致性？'),
+                        content: t('进行该操作时，可能导致渠道访问错误，请仅在数据库出现问题时使用'),
+                        onOk: () => fixChannelsAbilities(),
+                        size: 'sm',
+                        centered: true,
+                      });
+                    }}
+                  >
+                    {t('修复数据库一致性')}
+                  </Button>
+                </Dropdown.Item>
+                <Dropdown.Item>
+                  <Button
+                    size='small'
                     type='secondary'
                     className="w-full"
                     onClick={() => {
@@ -1676,7 +1668,6 @@ const ChannelsTable = () => {
                 <Dropdown.Item>
                   <Button
                     size='small'
-                    theme='light'
                     type='danger'
                     className="w-full"
                     onClick={() => {
@@ -1692,25 +1683,6 @@ const ChannelsTable = () => {
                     {t('删除禁用通道')}
                   </Button>
                 </Dropdown.Item>
-                <Dropdown.Item>
-                  <Button
-                    size='small'
-                    theme='light'
-                    type='tertiary'
-                    className="w-full"
-                    onClick={() => {
-                      Modal.confirm({
-                        title: t('确定是否要修复数据库一致性？'),
-                        content: t('进行该操作时，可能导致渠道访问错误，请仅在数据库出现问题时使用'),
-                        onOk: () => fixChannelsAbilities(),
-                        size: 'sm',
-                        centered: true,
-                      });
-                    }}
-                  >
-                    {t('修复数据库一致性')}
-                  </Button>
-                </Dropdown.Item>
               </Dropdown.Menu>
             }
           >
@@ -1721,8 +1693,7 @@ const ChannelsTable = () => {
 
           <Button
             size='small'
-            theme='light'
-            type='secondary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
           >
@@ -1825,8 +1796,7 @@ const ChannelsTable = () => {
 
           <Button
             size='small'
-            theme='light'
-            type='primary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={refresh}
           >
@@ -1835,7 +1805,6 @@ const ChannelsTable = () => {
 
           <Button
             size='small'
-            theme='light'
             type='tertiary'
             onClick={() => setShowColumnSelector(true)}
             className="w-full md:w-auto"
@@ -1898,7 +1867,7 @@ const ChannelsTable = () => {
             </div>
             <Button
               size='small'
-              type="primary"
+              type="tertiary"
               htmlType="submit"
               loading={loading || searching}
               className="w-full md:w-auto"
@@ -1907,7 +1876,7 @@ const ChannelsTable = () => {
             </Button>
             <Button
               size='small'
-              theme='light'
+              type='tertiary'
               onClick={() => {
                 if (formApi) {
                   formApi.reset();
@@ -2033,61 +2002,6 @@ const ChannelsTable = () => {
                   {t('共')} {currentTestChannel.models.split(',').length} {t('个模型')}
                 </Typography.Text>
               </div>
-
-              {/* 搜索与操作按钮 */}
-              <div className="flex items-center justify-end gap-2 w-full">
-                <Input
-                  placeholder={t('搜索模型...')}
-                  value={modelSearchKeyword}
-                  onChange={(v) => {
-                    setModelSearchKeyword(v);
-                    setModelTablePage(1);
-                  }}
-                  className="!w-full"
-                  prefix={<IconSearch />}
-                  showClear
-                />
-
-                <Button
-                  theme='light'
-                  onClick={() => {
-                    if (selectedModelKeys.length === 0) {
-                      showError(t('请先选择模型！'));
-                      return;
-                    }
-                    copy(selectedModelKeys.join(',')).then((ok) => {
-                      if (ok) {
-                        showSuccess(t('已复制 ${count} 个模型').replace('${count}', selectedModelKeys.length));
-                      } else {
-                        showError(t('复制失败，请手动复制'));
-                      }
-                    });
-                  }}
-                >
-                  {t('复制已选')}
-                </Button>
-
-                <Button
-                  theme='light'
-                  type='primary'
-                  onClick={() => {
-                    if (!currentTestChannel) return;
-                    const successKeys = currentTestChannel.models
-                      .split(',')
-                      .filter((m) => m.toLowerCase().includes(modelSearchKeyword.toLowerCase()))
-                      .filter((m) => {
-                        const result = modelTestResults[`${currentTestChannel.id}-${m}`];
-                        return result && result.success;
-                      });
-                    if (successKeys.length === 0) {
-                      showInfo(t('暂无成功模型'));
-                    }
-                    setSelectedModelKeys(successKeys);
-                  }}
-                >
-                  {t('选择成功')}
-                </Button>
-              </div>
             </div>
           )
         }
@@ -2097,15 +2011,13 @@ const ChannelsTable = () => {
           <div className="flex justify-end">
             {isBatchTesting ? (
               <Button
-                theme='light'
-                type='warning'
+                type='danger'
                 onClick={handleCloseModal}
               >
                 {t('停止测试')}
               </Button>
             ) : (
               <Button
-                theme='light'
                 type='tertiary'
                 onClick={handleCloseModal}
               >
@@ -2113,8 +2025,6 @@ const ChannelsTable = () => {
               </Button>
             )}
             <Button
-              theme='light'
-              type='primary'
               onClick={batchTestModels}
               loading={isBatchTesting}
               disabled={isBatchTesting}
@@ -2139,6 +2049,58 @@ const ChannelsTable = () => {
         <div className="model-test-scroll">
           {currentTestChannel && (
             <div>
+              {/* 搜索与操作按钮 */}
+              <div className="flex items-center justify-end gap-2 w-full mb-2">
+                <Input
+                  placeholder={t('搜索模型...')}
+                  value={modelSearchKeyword}
+                  onChange={(v) => {
+                    setModelSearchKeyword(v);
+                    setModelTablePage(1);
+                  }}
+                  className="!w-full"
+                  prefix={<IconSearch />}
+                  showClear
+                />
+
+                <Button
+                  onClick={() => {
+                    if (selectedModelKeys.length === 0) {
+                      showError(t('请先选择模型！'));
+                      return;
+                    }
+                    copy(selectedModelKeys.join(',')).then((ok) => {
+                      if (ok) {
+                        showSuccess(t('已复制 ${count} 个模型').replace('${count}', selectedModelKeys.length));
+                      } else {
+                        showError(t('复制失败，请手动复制'));
+                      }
+                    });
+                  }}
+                >
+                  {t('复制已选')}
+                </Button>
+
+                <Button
+                  type='tertiary'
+                  onClick={() => {
+                    if (!currentTestChannel) return;
+                    const successKeys = currentTestChannel.models
+                      .split(',')
+                      .filter((m) => m.toLowerCase().includes(modelSearchKeyword.toLowerCase()))
+                      .filter((m) => {
+                        const result = modelTestResults[`${currentTestChannel.id}-${m}`];
+                        return result && result.success;
+                      });
+                    if (successKeys.length === 0) {
+                      showInfo(t('暂无成功模型'));
+                    }
+                    setSelectedModelKeys(successKeys);
+                  }}
+                >
+                  {t('选择成功')}
+                </Button>
+              </div>
               <Table
                 columns={[
                   {
@@ -2197,8 +2159,7 @@ const ChannelsTable = () => {
                       const isTesting = testingModels.has(record.model);
                       return (
                         <Button
-                          theme='light'
-                          type='primary'
+                          type='tertiary'
                           onClick={() => testChannel(currentTestChannel, record.model)}
                           loading={isTesting}
                           size='small'
diff --git a/web/src/components/table/LogsTable.js b/web/src/components/table/LogsTable.js
index 964dac23..bff87675 100644
--- a/web/src/components/table/LogsTable.js
+++ b/web/src/components/table/LogsTable.js
@@ -697,22 +697,13 @@ const LogsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className='flex justify-end'>
-            <Button
-              theme='light'
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme='light'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -1222,7 +1213,7 @@ const LogsTable = () => {
                     style={{
                       fontWeight: 500,
                       boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
-                      padding: 15,
+                      padding: 13,
                     }}
                     className='!rounded-lg'
                   >
@@ -1233,7 +1224,7 @@ const LogsTable = () => {
                     style={{
                       fontWeight: 500,
                       boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
-                      padding: 15,
+                      padding: 13,
                     }}
                     className='!rounded-lg'
                   >
@@ -1245,7 +1236,7 @@ const LogsTable = () => {
                       border: 'none',
                       boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
                       fontWeight: 500,
-                      padding: 15,
+                      padding: 13,
                     }}
                     className='!rounded-lg'
                   >
@@ -1254,8 +1245,7 @@ const LogsTable = () => {
                 </Space>
 
                 <Button
-                  theme='light'
-                  type='secondary'
+                  type='tertiary'
                   className="w-full md:w-auto"
                   onClick={() => setCompactMode(!compactMode)}
                   size="small"
@@ -1384,7 +1374,7 @@ const LogsTable = () => {
 
                   <div className='flex gap-2 w-full sm:w-auto justify-end'>
                     <Button
-                      type='primary'
+                      type='tertiary'
                       htmlType='submit'
                       loading={loading}
                       size="small"
@@ -1392,7 +1382,7 @@ const LogsTable = () => {
                       {t('查询')}
                     </Button>
                     <Button
-                      theme='light'
+                      type='tertiary'
                       onClick={() => {
                         if (formApi) {
                           formApi.reset();
@@ -1407,7 +1397,6 @@ const LogsTable = () => {
                       {t('重置')}
                     </Button>
                     <Button
-                      theme='light'
                       type='tertiary'
                       onClick={() => setShowColumnSelector(true)}
                       size="small"
diff --git a/web/src/components/table/MjLogsTable.js b/web/src/components/table/MjLogsTable.js
index 4e43fd18..57e221d9 100644
--- a/web/src/components/table/MjLogsTable.js
+++ b/web/src/components/table/MjLogsTable.js
@@ -741,22 +741,13 @@ const LogsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className="flex justify-end">
-            <Button
-              theme="light"
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme="light"
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -831,8 +822,7 @@ const LogsTable = () => {
                   )}
                 </div>
                 <Button
-                  theme='light'
-                  type='secondary'
+                  type='tertiary'
                   className="w-full md:w-auto"
                   onClick={() => setCompactMode(!compactMode)}
                   size="small"
@@ -897,7 +887,7 @@ const LogsTable = () => {
                     <div></div>
                     <div className="flex gap-2">
                       <Button
-                        type='primary'
+                        type='tertiary'
                         htmlType='submit'
                         loading={loading}
                         size="small"
@@ -905,7 +895,7 @@ const LogsTable = () => {
                         {t('查询')}
                       </Button>
                       <Button
-                        theme='light'
+                        type='tertiary'
                         onClick={() => {
                           if (formApi) {
                             formApi.reset();
@@ -920,7 +910,6 @@ const LogsTable = () => {
                         {t('重置')}
                       </Button>
                       <Button
-                        theme='light'
                         type='tertiary'
                         onClick={() => setShowColumnSelector(true)}
                         size="small"
diff --git a/web/src/components/table/RedemptionsTable.js b/web/src/components/table/RedemptionsTable.js
index a2c27031..b463294e 100644
--- a/web/src/components/table/RedemptionsTable.js
+++ b/web/src/components/table/RedemptionsTable.js
@@ -139,6 +139,7 @@ const RedemptionsTable = () => {
       title: '',
       dataIndex: 'operate',
       fixed: 'right',
+      width: 205,
       render: (text, record, index) => {
         // 创建更多操作的下拉菜单项
         const moreMenuItems = [
@@ -191,7 +192,6 @@ const RedemptionsTable = () => {
           <Space>
             <Popover content={record.key} style={{ padding: 20 }} position='top'>
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
               >
@@ -199,8 +199,6 @@ const RedemptionsTable = () => {
               </Button>
             </Popover>
             <Button
-              theme='light'
-              type='secondary'
               size="small"
               onClick={async () => {
                 await copyText(record.key);
@@ -209,7 +207,6 @@ const RedemptionsTable = () => {
               {t('复制')}
             </Button>
             <Button
-              theme='light'
               type='tertiary'
               size="small"
               onClick={() => {
@@ -226,7 +223,6 @@ const RedemptionsTable = () => {
               menu={moreMenuItems}
             >
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 icon={<IconMore />}
@@ -435,8 +431,7 @@ const RedemptionsTable = () => {
             <Text>{t('兑换码可以批量生成和分发，适合用于推广活动或批量充值。')}</Text>
           </div>
           <Button
-            theme='light'
-            type='secondary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
             size="small"
@@ -452,7 +447,6 @@ const RedemptionsTable = () => {
         <div className="flex flex-col sm:flex-row gap-2 w-full md:w-auto order-2 md:order-1">
           <div className="flex gap-2 w-full sm:w-auto">
             <Button
-              theme='light'
               type='primary'
               className="w-full sm:w-auto"
               onClick={() => {
@@ -466,7 +460,7 @@ const RedemptionsTable = () => {
               {t('添加兑换码')}
             </Button>
             <Button
-              type='warning'
+              type='tertiary'
               className="w-full sm:w-auto"
               onClick={async () => {
                 if (selectedKeys.length === 0) {
@@ -539,7 +533,7 @@ const RedemptionsTable = () => {
             </div>
             <div className="flex gap-2 w-full md:w-auto">
               <Button
-                type="primary"
+                type="tertiary"
                 htmlType="submit"
                 loading={loading || searching}
                 className="flex-1 md:flex-initial md:w-auto"
@@ -548,7 +542,7 @@ const RedemptionsTable = () => {
                 {t('查询')}
               </Button>
               <Button
-                theme="light"
+                type="tertiary"
                 onClick={() => {
                   if (formApi) {
                     formApi.reset();
diff --git a/web/src/components/table/TaskLogsTable.js b/web/src/components/table/TaskLogsTable.js
index 3928ed77..ba4dcd50 100644
--- a/web/src/components/table/TaskLogsTable.js
+++ b/web/src/components/table/TaskLogsTable.js
@@ -595,22 +595,13 @@ const LogsTable = () => {
         onCancel={() => setShowColumnSelector(false)}
         footer={
           <div className="flex justify-end">
-            <Button
-              theme="light"
-              onClick={() => initDefaultColumns()}
-            >
+            <Button onClick={() => initDefaultColumns()}>
               {t('重置')}
             </Button>
-            <Button
-              theme="light"
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('取消')}
             </Button>
-            <Button
-              type='primary'
-              onClick={() => setShowColumnSelector(false)}
-            >
+            <Button onClick={() => setShowColumnSelector(false)}>
               {t('确定')}
             </Button>
           </div>
@@ -667,8 +658,7 @@ const LogsTable = () => {
                   <Text>{t('任务记录')}</Text>
                 </div>
                 <Button
-                  theme='light'
-                  type='secondary'
+                  type='tertiary'
                   className="w-full md:w-auto"
                   onClick={() => setCompactMode(!compactMode)}
                   size="small"
@@ -733,7 +723,7 @@ const LogsTable = () => {
                     <div></div>
                     <div className="flex gap-2">
                       <Button
-                        type='primary'
+                        type='tertiary'
                         htmlType='submit'
                         loading={loading}
                         size="small"
@@ -741,7 +731,7 @@ const LogsTable = () => {
                         {t('查询')}
                       </Button>
                       <Button
-                        theme='light'
+                        type='tertiary'
                         onClick={() => {
                           if (formApi) {
                             formApi.reset();
@@ -756,7 +746,6 @@ const LogsTable = () => {
                         {t('重置')}
                       </Button>
                       <Button
-                        theme='light'
                         type='tertiary'
                         onClick={() => setShowColumnSelector(true)}
                         size="small"
diff --git a/web/src/components/table/TokensTable.js b/web/src/components/table/TokensTable.js
index 2eea74ce..ac7fca92 100644
--- a/web/src/components/table/TokensTable.js
+++ b/web/src/components/table/TokensTable.js
@@ -372,9 +372,8 @@ const TokensTable = () => {
               aria-label={t('项目操作按钮组')}
             >
               <Button
-                theme='light'
                 size="small"
-                style={{ color: 'rgba(var(--semi-teal-7), 1)' }}
+                type='tertiary'
                 onClick={() => {
                   if (chatsArray.length === 0) {
                     showError(t('请联系管理员配置聊天链接'));
@@ -395,11 +394,7 @@ const TokensTable = () => {
                 menu={chatsArray}
               >
                 <Button
-                  style={{
-                    padding: '4px 4px',
-                    color: 'rgba(var(--semi-teal-7), 1)',
-                  }}
-                  type='primary'
+                  type='tertiary'
                   icon={<IconTreeTriangleDown />}
                   size="small"
                 ></Button>
@@ -407,7 +402,6 @@ const TokensTable = () => {
             </SplitButtonGroup>
 
             <Button
-              theme='light'
               type='tertiary'
               size="small"
               onClick={() => {
@@ -419,7 +413,6 @@ const TokensTable = () => {
             </Button>
 
             <Button
-              theme='light'
               type='danger'
               size="small"
               onClick={() => {
@@ -705,8 +698,7 @@ const TokensTable = () => {
             <Text>{t('令牌用于API访问认证，可以设置额度限制和模型权限。')}</Text>
           </div>
           <Button
-            theme="light"
-            type="secondary"
+            type="tertiary"
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
             size="small"
@@ -721,7 +713,6 @@ const TokensTable = () => {
       <div className="flex flex-col md:flex-row justify-between items-center gap-4 w-full">
         <div className="flex flex-wrap gap-2 w-full md:w-auto order-2 md:order-1">
           <Button
-            theme="light"
             type="primary"
             className="flex-1 md:flex-initial"
             onClick={() => {
@@ -735,8 +726,7 @@ const TokensTable = () => {
             {t('添加令牌')}
           </Button>
           <Button
-            theme="light"
-            type="warning"
+            type='tertiary'
             className="flex-1 md:flex-initial"
             onClick={() => {
               if (selectedKeys.length === 0) {
@@ -750,8 +740,7 @@ const TokensTable = () => {
                 footer: (
                   <Space>
                     <Button
-                      type="primary"
-                      theme="solid"
+                      type='tertiary'
                       onClick={async () => {
                         let content = '';
                         for (let i = 0; i < selectedKeys.length; i++) {
@@ -765,7 +754,6 @@ const TokensTable = () => {
                       {t('名称+密钥')}
                     </Button>
                     <Button
-                      theme="light"
                       onClick={async () => {
                         let content = '';
                         for (let i = 0; i < selectedKeys.length; i++) {
@@ -786,8 +774,7 @@ const TokensTable = () => {
             {t('复制所选令牌')}
           </Button>
           <Button
-            theme="light"
-            type="danger"
+            type='danger'
             className="w-full md:w-auto"
             onClick={() => {
               if (selectedKeys.length === 0) {
@@ -844,7 +831,7 @@ const TokensTable = () => {
             </div>
             <div className="flex gap-2 w-full md:w-auto">
               <Button
-                type="primary"
+                type="tertiary"
                 htmlType="submit"
                 loading={loading || searching}
                 className="flex-1 md:flex-initial md:w-auto"
@@ -853,7 +840,7 @@ const TokensTable = () => {
                 {t('查询')}
               </Button>
               <Button
-                theme="light"
+                type='tertiary'
                 onClick={() => {
                   if (formApi) {
                     formApi.reset();
diff --git a/web/src/components/table/UsersTable.js b/web/src/components/table/UsersTable.js
index 0910170e..193e1d65 100644
--- a/web/src/components/table/UsersTable.js
+++ b/web/src/components/table/UsersTable.js
@@ -287,7 +287,6 @@ const UsersTable = () => {
         return (
           <Space>
             <Button
-              theme='light'
               type='tertiary'
               size="small"
               onClick={() => {
@@ -303,7 +302,6 @@ const UsersTable = () => {
               menu={moreMenuItems}
             >
               <Button
-                theme='light'
                 type='tertiary'
                 size="small"
                 icon={<IconMore />}
@@ -525,8 +523,7 @@ const UsersTable = () => {
             <Text>{t('用户管理页面，可以查看和管理所有注册用户的信息、权限和状态。')}</Text>
           </div>
           <Button
-            theme='light'
-            type='secondary'
+            type='tertiary'
             className="w-full md:w-auto"
             onClick={() => setCompactMode(!compactMode)}
             size="small"
@@ -541,8 +538,6 @@ const UsersTable = () => {
       <div className="flex flex-col md:flex-row justify-between items-center gap-4 w-full">
         <div className="flex gap-2 w-full md:w-auto order-2 md:order-1">
           <Button
-            theme='light'
-            type='primary'
             className="w-full md:w-auto"
             onClick={() => {
               setShowAddUser(true);
@@ -598,7 +593,7 @@ const UsersTable = () => {
             </div>
             <div className="flex gap-2 w-full md:w-auto">
               <Button
-                type="primary"
+                type="tertiary"
                 htmlType="submit"
                 loading={loading || searching}
                 className="flex-1 md:flex-initial md:w-auto"
@@ -607,7 +602,7 @@ const UsersTable = () => {
                 {t('查询')}
               </Button>
               <Button
-                theme="light"
+                type='tertiary'
                 onClick={() => {
                   if (formApi) {
                     formApi.reset();
diff --git a/web/src/helpers/render.js b/web/src/helpers/render.js
index fd7ae993..12aa01b3 100644
--- a/web/src/helpers/render.js
+++ b/web/src/helpers/render.js
@@ -53,18 +53,18 @@ import {
 
 // 侧边栏图标颜色映射
 export const sidebarIconColors = {
-  dashboard: '#4F46E5', // 紫蓝色
+  dashboard: '#10B981', // 绿色
   terminal: '#10B981', // 绿色
   message: '#06B6D4', // 青色
   key: '#3B82F6', // 蓝色
-  chart: '#8B5CF6', // 紫色
+  chart: '#F59E0B', // 琥珀色
   image: '#EC4899', // 粉色
   check: '#F59E0B', // 琥珀色
   credit: '#F97316', // 橙色
   layers: '#EF4444', // 红色
   gift: '#F43F5E', // 玫红色
-  user: '#6366F1', // 靛蓝色
-  settings: '#6B7280', // 灰色
+  user: '#10B981', // 绿色
+  settings: '#F97316', // 橙色
 };
 
 // 获取侧边栏Lucide图标组件
diff --git a/web/src/index.css b/web/src/index.css
index 8e71536a..66bc64d3 100644
--- a/web/src/index.css
+++ b/web/src/index.css
@@ -59,6 +59,11 @@ code {
 
 .semi-navigation-item {
   margin-bottom: 4px !important;
+  padding: 4px 12px !important;
+}
+
+.semi-navigation-sub-title {
+  padding: 0 !important;
 }
 
 .semi-navigation-item-icon {
@@ -70,6 +75,7 @@ code {
   margin-right: 0;
 }
 
+.semi-navigation-item,
 .semi-navigation-sub-title {
   height: 100% !important;
 }