听劝,修改部分样式 XD

This commit is contained in:
suyiiyii 2024-09-22 19:48:40 +08:00
parent 0083f0311a
commit cc31ef88ef
3 changed files with 35 additions and 18 deletions

View File

@ -0,0 +1,13 @@
.list-actions-icon {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
border-radius: 50%;
transition: all 0.1s;
}
.list-actions-icon:hover {
background-color: var(--color-fill-3);
}

View File

@ -4,11 +4,13 @@ import {
Card, Descriptions, Grid, List, Popconfirm, Popover, Typography, Card, Descriptions, Grid, List, Popconfirm, Popover, Typography,
} from '@arco-design/web-react'; } from '@arco-design/web-react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { IconDelete, IconEdit } from '@arco-design/web-react/icon';
import { selectSiteConf } from '../globalConf/globalConfSlice'; import { selectSiteConf } from '../globalConf/globalConfSlice';
import { useAppSelector } from '../../app/hooks'; import { useAppSelector } from '../../app/hooks';
import { Cookie, SiteConfig } from '../../utils/type'; import { Cookie, SiteConfig } from '../../utils/type';
import { useGetCookiesQuery, useDeleteCookieMutation } from './cookieConfigSlice'; import { useGetCookiesQuery, useDeleteCookieMutation } from './cookieConfigSlice';
import CookieModal from './CookieModal'; import CookieModal from './CookieModal';
import './CookieManager.css';
interface CookieSite { interface CookieSite {
site: SiteConfig; site: SiteConfig;
@ -82,22 +84,20 @@ export default function CookieManager() {
</Popover> </Popover>
<div> <div style={{ display: 'flex' }}>
<Link to={`/home/cookie/${cookie.id}`}> <Link to={`/home/cookie/${cookie.id}`}>
<Button <span className="list-actions-icon">
type="primary" <IconEdit />
style={{ marginRight: '10px' }} </span>
>
</Button>
</Link> </Link>
<Popconfirm <Popconfirm
title={`确定删除 Cookie ${cookie.friendly_name} `} title={`确定删除 Cookie ${cookie.friendly_name} `}
onOk={handleDelCookie(cookie.id.toString())} onOk={handleDelCookie(cookie.id.toString())}
> >
<span className="list-actions-icon">
<Button type="primary" status="danger"></Button> <IconDelete />
</span>
</Popconfirm> </Popconfirm>
</div> </div>

View File

@ -1,8 +1,9 @@
import React, { ReactNode, useEffect, useState } from 'react'; import React, { ReactNode, useEffect, useState } from 'react';
import { Breadcrumb, Layout, Menu } from '@arco-design/web-react'; import { Breadcrumb, Layout, Menu } from '@arco-design/web-react';
import { IconRobot, IconDashboard, IconUser } from '@arco-design/web-react/icon'; import {
IconRobot, IconDashboard, IconIdcard,
} from '@arco-design/web-react/icon';
import './Home.css'; import './Home.css';
// import SubscribeManager from '../features/subsribeConfigManager/SubscribeManager';
import { import {
Link, Navigate, Outlet, useLocation, useNavigate, Link, Navigate, Outlet, useLocation, useNavigate,
} from 'react-router-dom'; } from 'react-router-dom';
@ -95,7 +96,7 @@ export default function Home() {
<Breadcrumb style={{ margin: '16px 0' }}> <Breadcrumb style={{ margin: '16px 0' }}>
<Breadcrumb.Item> <Breadcrumb.Item>
<Link to="/home/cookie"> <Link to="/home/cookie">
<IconUser /> <IconIdcard />
Cookie Cookie
</Link> </Link>
</Breadcrumb.Item> </Breadcrumb.Item>
@ -116,20 +117,23 @@ export default function Home() {
> >
<Menu <Menu
defaultSelectedKeys={[selectedTab]} defaultSelectedKeys={[selectedTab]}
onClickMenuItem={(key) => { handleTabSelect(key); }} onClickMenuItem={(key) => {
handleTabSelect(key);
}}
> >
<Menu.Item key="groups"> <Menu.Item key="groups">
<IconRobot /> <IconRobot />
</Menu.Item> </Menu.Item>
<Menu.Item key="cookie">
<IconIdcard />
Cookie
</Menu.Item>
<Menu.Item key="weight"> <Menu.Item key="weight">
<IconDashboard /> <IconDashboard />
</Menu.Item> </Menu.Item>
<Menu.Item key="cookie">
<IconUser />
Cookie
</Menu.Item>
</Menu> </Menu>
</Layout.Sider> </Layout.Sider>
<Layout.Content style={{ padding: '0 1em' }}> <Layout.Content style={{ padding: '0 1em' }}>