Austin/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev.git synced 2024-11-15 19:22:26 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Sytle: UI improvement & Update Readme

Browse Source
This commit is contained in:
wonfen 2024-03-10 07:00:24 +08:00
parent 9315fe36b6
commit ed6e966b2f
11 changed files with 38 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
README.md
View File

@ -11,31 +11,15 @@ A Clash Meta GUI based on <a href="https://github.com/tauri-apps/tauri">Tauri</a
## Install
Click on the corresponding link below to download the installation package. Supports Windows (x64/x86), Linux (x64/arm64) and macOS 10.15+ (intel/apple).
请到发布页面下载对应的安装包：[Release page](https://github.com/clash-verge-rev/clash-verge-rev/releases)<br>
Go to the [release page](https://github.com/clash-verge-rev/clash-verge-rev/releases) to download the corresponding installation package<br>
Supports Windows (x64/x86), Linux (x64/arm64) and macOS 10.15+ (intel/apple).
[[Windows x64](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/Clash.Verge_1.5.5_x64-setup.exe)]
[[Windows arm64](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/Clash.Verge_1.5.5_arm64-setup.exe)]
### 安装说明和常见问题，请到[文档页](https://clash-verge-rev.github.io/)查看：[Doc](https://clash-verge-rev.github.io/)
[[macOS intel](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/Clash.Verge_1.5.5_x64.dmg)]
[[macOS apple](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/Clash.Verge_1.5.5_aarch64.dmg)]
---
[[Linux x64 AppImage](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/clash-verge_1.5.5_amd64.AppImage)]
[[Linux x64 deb](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/clash-verge_1.5.5_amd64.deb)]
[[Linux arm64 deb](https://github.com/clash-verge-rev/clash-verge-rev/releases/download/v1.5.5/clash-verge_1.5.5_arm64.deb)]
Or you can build it yourself. Supports Windows, Linux and macOS 10.15+
Notes: If you could not start the app on Windows, please check that you have [Webview2](https://developer.microsoft.com/en-us/microsoft-edge/webview2/#download-section) installed.
## Features
- Since the clash core has been removed. The project no longer maintains the clash core, but only the Clash Meta core.
- Profiles management and enhancement (by yaml and Javascript). [Doc](https://clash-verge-rev.github.io)
- Simple UI and supports custom theme color.
- Built-in support [Clash.Meta(mihomo)](https://github.com/MetaCubeX/mihomo) core.
- System proxy setting and guard.
#### TG Group: [@clash_verge_rev](https://t.me/clash_verge_rev)
### TG Group: [@clash_verge_rev](https://t.me/clash_verge_rev)
## Promotion
@ -51,15 +35,21 @@ Notes: If you could not start the app on Windows, please check that you have [We
- 解锁流媒体及 ChatGPT
- 官网：https://狗狗加速.com
## Features
- Since the clash core has been removed. The project no longer maintains the clash core, but only the Clash Meta core.
- Profiles management and enhancement (by yaml and Javascript). [Doc](https://clash-verge-rev.github.io)
- Improved UI and supports custom theme color.
- Built-in support [Clash.Meta(mihomo)](https://github.com/MetaCubeX/mihomo) core.
- System proxy setting and guard.
## Preview
![preview](./docs/preview.gif)
### FAQ
#### 1. **macOS** "Clash Verge" is damaged and can't be opened
open the terminal and run `sudo xattr -r -d com.apple.quarantine /Applications/Clash\ Verge.app`
Refer to [Doc FAQ Page](https://clash-verge-rev.github.io/faq.html)
## Development
@ -73,14 +63,6 @@ pnpm run check
pnpm dev
```
## Todos
> This keng is a little big...
## Disclaimer
This is a learning project for Rust practice.
## Contributions
Issue and PR welcome!

4
UPDATELOG.md
View File

@ -2,11 +2,13 @@
### Features
- 全新 UI 界面 (by @Amnesiash)
- 全新专属 Verge rev UI 界面 (by @Amnesiash) 及细节调整
- 提供允许无效证书的开关
- 删除不必要的快捷键
- Provider 更新添加动画
- Merge 支持 Provider
- 更换订阅框的粘贴按钮，删除默认的"Remote File" Profile 名称
- 链接菜单添加节点显示
### Bugs Fixes

BIN
docs/preview.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.7 MiB

After

Width:  |  Height:  |  Size: 7.3 MiB

12
src/assets/styles/layout.scss
View File

@ -5,7 +5,7 @@
overflow: hidden;
&__left {
flex: 1 0 228px;
flex: 1 0 200px;
display: flex;
height: 100%;
width: 100%;
@ -21,23 +21,23 @@
-moz-user-select: none;
-ms-user-select: none;
overflow: hidden;
border-right: 1px solid var(--divider-color);
// border-right: 1px solid var(--divider-color);
// background-color: var(--background-color-alpha);
// $maxLogo: 100px;
.the-logo {
position: relative;
flex: 1 0 58px;
flex: 1 0 47px;
// width: 100%;
display: flex;
height: 100%;
padding: 0px 20px;
padding: 0px 15px;
flex-direction: column;
justify-content: center;
align-items: flex-start;
align-self: stretch;
border-bottom: 1px solid var(--divider-color);
// border-bottom: 1px solid var(--divider-color);
// max-width: $maxLogo + 32px;
// max-height: $maxLogo;
// margin: 0 auto;
@ -119,7 +119,7 @@
}
.layout__left .the-logo {
flex: 1 0 58px;
flex: 1 0 47px;
}
.layout__right .the-content {

7
src/assets/styles/page.scss
View File

@ -13,12 +13,13 @@
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid var(--divider-color);
// border-bottom: 1px solid var(--divider-color);
}
.base-container {
height: 100%;
overflow: hidden;
border-radius: 10px;
// border-top-left-radius: var(--border-radius);
> section {
@ -27,11 +28,11 @@
width: 100%;
height: 100%;
overflow: auto;
padding: 16px 0;
padding: 10px 0;
box-sizing: border-box;
scrollbar-gutter: stable;
.base-content {
width: calc(100% - 16px * 2);
width: calc(100% - 10px * 2);
margin: 0 auto;
}
}

4
src/components/connection/connection-item.tsx
View File

@ -58,7 +58,9 @@ export const ConnectionItem = (props: Props) => {
{!!metadata.process && <Tag>{metadata.process}</Tag>}
{chains?.length > 0 && <Tag>{chains[value.chains.length - 1]}</Tag>}
{chains?.length > 0 && (
<Tag>{[...chains].reverse().join(" / ")}</Tag>
)}
<Tag>{dayjs(start).fromNow()}</Tag>

6
src/components/layout/layout-item.tsx
View File

@ -26,10 +26,10 @@ export const LayoutItem = (props: Props) => {
sx={[
{
borderRadius: 2,
marginLeft: 1.5,
marginLeft: 1.25,
paddingLeft: 1.5,
paddingRight: 1,
marginRight: 1.5,
marginRight: 1.25,
textAlign: "left",
"& .MuiListItemText-primary": {
color: "text.primary",
@ -54,7 +54,7 @@ export const LayoutItem = (props: Props) => {
>
<ListItemIcon>{icon}</ListItemIcon>
<ListItemText
sx={{ textAlign: "center", marginLeft: "-20px" }}
sx={{ textAlign: "center", marginLeft: "-35px" }}
primary={children}
/>
</ListItemButton>

2
src/components/layout/layout-traffic.tsx
View File

@ -89,7 +89,7 @@ export const LayoutTraffic = () => {
return (
<Box
width="188px"
width="150px"
position="relative"
onClick={trafficRef.current?.toggleStyle}
>

2
src/components/proxy/proxy-render.tsx
View File

@ -47,7 +47,7 @@ export const ProxyRender = (props: RenderProps) => {
style={{
background: itembackgroundcolor,
height: "64px",
margin: "8px 16px",
margin: "8px 8px",
borderRadius: "8px",
}}
onClick={() => onHeadState(group.name, { open: !headState?.open })}

1
src/components/setting/setting-verge.tsx
View File

@ -167,6 +167,7 @@ const SettingVerge = ({ onError }: Props) => {
<Input
value={startup_script}
disabled
sx={{ width: 230 }}
endAdornment={
<>
<Button

2
src/components/test/test-box.tsx
View File

@ -26,7 +26,7 @@ export const TestBox = styled(Box)(({ theme, "aria-selected": selected }) => {
display: "block",
cursor: "pointer",
textAlign: "left",
borderRadius: theme.shape.borderRadius,
borderRadius: 8,
boxShadow: theme.shadows[2],
padding: "8px 16px",
boxSizing: "border-box",