hicccc77/WeFlow
1
0
Fork 0
mirror of https://github.com/hicccc77/WeFlow.git synced 2026-03-25 07:16:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

更新窗口优化

Browse Source
This commit is contained in:
cc
2026-03-14 14:30:56 +08:00
parent 39ba175651
commit ee0e71d50e
3 changed files with 44 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
src/components/UpdateDialog.scss
View File

@@ -14,7 +14,7 @@
.update-dialog { .update-dialog {
width: 680px; width: 680px;
background: #f5f5f5; background: var(--bg-secondary, #f5f5f5);
border-radius: 24px; border-radius: 24px;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
overflow: hidden; overflow: hidden;
@@ -25,7 +25,7 @@
/* Top Section (White/Gradient) */ /* Top Section (White/Gradient) */
.dialog-header { .dialog-header {
background: #ffffff; background: var(--bg-primary, #ffffff);
padding: 40px 20px 30px; padding: 40px 20px 30px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -41,14 +41,14 @@
left: -50px; left: -50px;
width: 200px; width: 200px;
height: 200px; height: 200px;
background: radial-gradient(circle, rgba(255, 235, 220, 0.4) 0%, rgba(255, 255, 255, 0) 70%); background: radial-gradient(circle, rgba(255, 235, 220, 0.15) 0%, rgba(255, 255, 255, 0) 70%);
opacity: 0.8; opacity: 0.5;
pointer-events: none; pointer-events: none;
} }
.version-tag { .version-tag {
background: #f0eee9; background: var(--bg-tertiary, #f0eee9);
color: #8c7b6e; color: var(--text-tertiary, #8c7b6e);
padding: 4px 16px; padding: 4px 16px;
border-radius: 12px; border-radius: 12px;
font-size: 13px; font-size: 13px;
@@ -60,21 +60,21 @@
h2 { h2 {
font-size: 32px; font-size: 32px;
font-weight: 800; font-weight: 800;
color: #333333; color: var(--text-primary, #333333);
margin: 0 0 12px; margin: 0 0 12px;
letter-spacing: -0.5px; letter-spacing: -0.5px;
} }
.subtitle { .subtitle {
font-size: 15px; font-size: 15px;
color: #999999; color: var(--text-secondary, #999999);
font-weight: 400; font-weight: 400;
} }
} }
/* Content Section (Light Gray) */ /* Content Section (Light Gray) */
.dialog-content { .dialog-content {
background: #f2f2f2; background: var(--bg-tertiary, #f2f2f2);
padding: 24px 40px 40px; padding: 24px 40px 40px;
flex: 1; flex: 1;
display: flex; display: flex;
@@ -87,7 +87,7 @@
margin-bottom: 30px; margin-bottom: 30px;
.icon-box { .icon-box {
background: #fbfbfb; // Beige-ish white background: var(--bg-primary, #fbfbfb);
width: 48px; width: 48px;
height: 48px; height: 48px;
border-radius: 16px; border-radius: 16px;
@@ -96,7 +96,7 @@
justify-content: center; justify-content: center;
margin-right: 20px; margin-right: 20px;
flex-shrink: 0; flex-shrink: 0;
color: #8c7b6e; color: var(--text-tertiary, #8c7b6e);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
svg { svg {
@@ -107,27 +107,38 @@
.text-box { .text-box {
flex: 1; flex: 1;
h3 { h1, h2, h3, h4, h5, h6 {
font-size: 18px; color: var(--text-primary, #333333);
font-weight: 700; font-weight: 700;
color: #333333; margin: 16px 0 8px;
margin: 0 0 8px;
&:first-child {
margin-top: 0;
}
}
h2 {
font-size: 16px;
}
h3 {
font-size: 15px;
} }
p { p {
font-size: 14px; font-size: 14px;
color: #666666; color: var(--text-secondary, #666666);
line-height: 1.6; line-height: 1.6;
margin: 0; margin: 4px 0;
} }
ul { ul {
margin: 8px 0 0 18px; margin: 4px 0 0 18px;
padding: 0; padding: 0;
li { li {
font-size: 14px; font-size: 14px;
color: #666666; color: var(--text-secondary, #666666);
line-height: 1.6; line-height: 1.6;
} }
} }
@@ -142,19 +153,19 @@
justify-content: space-between; justify-content: space-between;
margin-bottom: 8px; margin-bottom: 8px;
font-size: 12px; font-size: 12px;
color: #888; color: var(--text-secondary, #888);
font-weight: 500; font-weight: 500;
} }
.progress-bar-bg { .progress-bar-bg {
height: 6px; height: 6px;
background: #e0e0e0; background: var(--border-color, #e0e0e0);
border-radius: 3px; border-radius: 3px;
overflow: hidden; overflow: hidden;
.progress-bar-fill { .progress-bar-fill {
height: 100%; height: 100%;
background: #000000; background: var(--text-primary, #000000);
border-radius: 3px; border-radius: 3px;
transition: width 0.3s ease; transition: width 0.3s ease;
} }
@@ -164,7 +175,7 @@
text-align: center; text-align: center;
margin-top: 12px; margin-top: 12px;
font-size: 13px; font-size: 13px;
color: #666; color: var(--text-secondary, #666);
} }
} }
@@ -175,8 +186,8 @@
.btn-ignore { .btn-ignore {
background: transparent; background: transparent;
color: #666666; color: var(--text-secondary, #666666);
border: 1px solid #d0d0d0; border: 1px solid var(--border-color, #d0d0d0);
padding: 16px 32px; padding: 16px 32px;
border-radius: 20px; border-radius: 20px;
font-size: 16px; font-size: 16px;
@@ -185,9 +196,9 @@
transition: all 0.2s; transition: all 0.2s;
&:hover { &:hover {
background: #f5f5f5; background: var(--bg-hover, #f5f5f5);
border-color: #999999; border-color: var(--text-secondary, #999999);
color: #333333; color: var(--text-primary, #333333);
} }
&:active { &:active {
@@ -196,11 +207,11 @@
} }
.btn-update { .btn-update {
background: #000000; background: var(--text-primary, #000000);
color: #ffffff; color: var(--bg-primary, #ffffff);
border: none; border: none;
padding: 16px 48px; padding: 16px 48px;
border-radius: 20px; // Pill shape border-radius: 20px;
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
cursor: pointer; cursor: pointer;
@@ -231,7 +242,7 @@
right: 16px; right: 16px;
background: rgba(0, 0, 0, 0.05); background: rgba(0, 0, 0, 0.05);
border: none; border: none;
color: #999; color: var(--text-secondary, #999);
cursor: pointer; cursor: pointer;
width: 32px; width: 32px;
height: 32px; height: 32px;
@@ -244,7 +255,7 @@
&:hover { &:hover {
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
color: #333; color: var(--text-primary, #333);
transform: rotate(90deg); transform: rotate(90deg);
} }
} }

1
src/components/UpdateDialog.tsx
View File

@@ -89,7 +89,6 @@ const UpdateDialog: React.FC<UpdateDialogProps> = ({
<Quote size={20} /> <Quote size={20} />
</div> </div>
<div className="text-box"> <div className="text-box">
<h3>优化</h3>
{updateInfo.releaseNotes ? ( {updateInfo.releaseNotes ? (
<div dangerouslySetInnerHTML={{ __html: updateInfo.releaseNotes }} /> <div dangerouslySetInnerHTML={{ __html: updateInfo.releaseNotes }} />
) : ( ) : (

1
src/pages/SettingsPage.tsx
View File

@@ -2061,7 +2061,6 @@ function SettingsPage({ onClose }: SettingsPageProps = {}) {
<RefreshCw size={16} className={isCheckingUpdate ? 'spin' : ''} /> <RefreshCw size={16} className={isCheckingUpdate ? 'spin' : ''} />
{isCheckingUpdate ? '检查中...' : '检查更新'} {isCheckingUpdate ? '检查中...' : '检查更新'}
</button> </button>
</div> </div>
)} )}
</div> </div>