Skip to content

phsl / new-api

Go to a project
Commit 33f4e404 by t0ng7u
Options

🍎style(button): Optimize the colors of all buttons to reduce visual fatigue

parent 5c55da29
Showing with 47 additions and 98 deletions
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"
......
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"
......
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();
......
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"
......
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();
......
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();
......
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图标组件
......
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;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment