更新了update门户站点界面和部分功能
This commit is contained in:
QWQLwToo
@@ -2,23 +2,22 @@
|
||||
color-scheme: light;
|
||||
font-family: "Microsoft YaHei UI", "Segoe UI", Arial, sans-serif;
|
||||
color: #172033;
|
||||
background: #f7f9ff;
|
||||
background: #f5f7f4;
|
||||
--ink: #172033;
|
||||
--muted: #63718a;
|
||||
--soft: #f7f9ff;
|
||||
--soft: #f5f7f4;
|
||||
--panel: rgba(255, 255, 255, 0.82);
|
||||
--panel-strong: #ffffff;
|
||||
--line: rgba(112, 132, 170, 0.18);
|
||||
--line-strong: rgba(94, 114, 158, 0.28);
|
||||
--primary: #3b82f6;
|
||||
--primary-dark: #2563eb;
|
||||
--cyan: #06b6d4;
|
||||
--violet: #8b5cf6;
|
||||
--pink: #f472b6;
|
||||
--primary: #1f6f5b;
|
||||
--primary-dark: #155241;
|
||||
--accent: #d99227;
|
||||
--good: #059669;
|
||||
--warn: #b7791f;
|
||||
--bad: #dc2626;
|
||||
--shadow: 0 22px 65px rgba(65, 88, 140, 0.16);
|
||||
--shadow: 0 22px 65px rgba(31, 48, 40, 0.12);
|
||||
--ease: cubic-bezier(.2,.8,.2,1);
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
@@ -27,9 +26,9 @@ body {
|
||||
margin: 0;
|
||||
min-width: 320px;
|
||||
background:
|
||||
radial-gradient(circle at 8% 6%, rgba(96, 165, 250, 0.30), transparent 28%),
|
||||
radial-gradient(circle at 88% 8%, rgba(244, 114, 182, 0.20), transparent 30%),
|
||||
linear-gradient(180deg, #eef6ff 0%, #f8fbff 42%, #ffffff 100%);
|
||||
radial-gradient(circle at 8% 6%, rgba(31, 111, 91, 0.10), transparent 30%),
|
||||
radial-gradient(circle at 90% 8%, rgba(217, 146, 39, 0.10), transparent 30%),
|
||||
linear-gradient(180deg, #f2f5ef 0%, #f8faf6 42%, #ffffff 100%);
|
||||
}
|
||||
body::before {
|
||||
content: "";
|
||||
@@ -37,8 +36,8 @@ body::before {
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
background-image:
|
||||
linear-gradient(rgba(59, 130, 246, 0.05) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(59, 130, 246, 0.05) 1px, transparent 1px);
|
||||
linear-gradient(rgba(31, 111, 91, 0.045) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(31, 111, 91, 0.045) 1px, transparent 1px);
|
||||
background-size: 42px 42px;
|
||||
mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.55), transparent 70%);
|
||||
}
|
||||
@@ -87,8 +86,8 @@ button { cursor: pointer; }
|
||||
place-items: center;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
background: linear-gradient(135deg, var(--primary), var(--cyan));
|
||||
box-shadow: 0 12px 26px rgba(37, 99, 235, 0.26);
|
||||
background: linear-gradient(135deg, #10231d, var(--primary));
|
||||
box-shadow: 0 12px 26px rgba(31, 111, 91, 0.22);
|
||||
}
|
||||
.brand strong { letter-spacing: 0; }
|
||||
.nav-links {
|
||||
@@ -108,18 +107,19 @@ button { cursor: pointer; }
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
font-weight: 800;
|
||||
transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
|
||||
transition: transform 0.18s var(--ease), background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
|
||||
}
|
||||
.nav-links a:hover, .nav-links a.active {
|
||||
color: var(--primary-dark);
|
||||
background: rgba(59, 130, 246, 0.12);
|
||||
background: rgba(31, 111, 91, 0.10);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
.admin-link {
|
||||
color: #fff;
|
||||
background: linear-gradient(135deg, #2563eb, #7c3aed);
|
||||
box-shadow: 0 12px 28px rgba(59, 130, 246, 0.24);
|
||||
background: linear-gradient(135deg, #10231d, #1f6f5b);
|
||||
box-shadow: 0 12px 28px rgba(31, 111, 91, 0.22);
|
||||
}
|
||||
.admin-link:hover { box-shadow: 0 16px 36px rgba(59, 130, 246, 0.32); }
|
||||
.admin-link:hover { transform: translateY(-1px); box-shadow: 0 16px 36px rgba(31, 111, 91, 0.28); }
|
||||
|
||||
.hero {
|
||||
position: relative;
|
||||
@@ -134,8 +134,8 @@ button { cursor: pointer; }
|
||||
border-radius: 32px;
|
||||
background:
|
||||
linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.62)),
|
||||
radial-gradient(circle at 88% 18%, rgba(14, 165, 233, 0.26), transparent 34%),
|
||||
radial-gradient(circle at 18% 82%, rgba(139, 92, 246, 0.18), transparent 30%);
|
||||
radial-gradient(circle at 88% 18%, rgba(31, 111, 91, 0.14), transparent 34%),
|
||||
radial-gradient(circle at 18% 82%, rgba(217, 146, 39, 0.13), transparent 30%);
|
||||
box-shadow: var(--shadow);
|
||||
padding: clamp(28px, 5vw, 58px);
|
||||
overflow: hidden;
|
||||
@@ -148,7 +148,7 @@ button { cursor: pointer; }
|
||||
width: 360px;
|
||||
height: 360px;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle, rgba(59, 130, 246, 0.20), transparent 68%);
|
||||
background: radial-gradient(circle, rgba(31, 111, 91, 0.13), transparent 68%);
|
||||
}
|
||||
.hero-copy {
|
||||
position: relative;
|
||||
@@ -193,7 +193,7 @@ p {
|
||||
margin-top: 22px;
|
||||
}
|
||||
.hero-tags span {
|
||||
border: 1px solid rgba(59, 130, 246, 0.18);
|
||||
border: 1px solid rgba(31, 111, 91, 0.16);
|
||||
border-radius: 999px;
|
||||
padding: 7px 11px;
|
||||
color: #355075;
|
||||
@@ -215,7 +215,7 @@ p {
|
||||
color: #263856;
|
||||
font-weight: 900;
|
||||
box-shadow: 0 10px 26px rgba(65, 88, 140, 0.10);
|
||||
transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
|
||||
transition: transform 0.18s var(--ease), box-shadow 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
|
||||
}
|
||||
.button:hover {
|
||||
transform: translateY(-1px);
|
||||
@@ -225,8 +225,8 @@ p {
|
||||
.button.primary {
|
||||
color: #fff;
|
||||
border-color: transparent;
|
||||
background: linear-gradient(135deg, #2563eb, #06b6d4);
|
||||
box-shadow: 0 16px 34px rgba(37, 99, 235, 0.26);
|
||||
background: linear-gradient(135deg, #10231d, #1f6f5b);
|
||||
box-shadow: 0 16px 34px rgba(31, 111, 91, 0.24);
|
||||
}
|
||||
|
||||
.release-card, .panel, .metric {
|
||||
@@ -236,6 +236,13 @@ p {
|
||||
box-shadow: 0 14px 42px rgba(65, 88, 140, 0.11);
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
.release-card, .panel, .metric, .source-group, .notice-card, .route-list a {
|
||||
transition: transform 0.22s var(--ease), border-color 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease;
|
||||
}
|
||||
.release-card:hover, .panel:hover, .metric:hover, .source-group:hover, .notice-card:hover, .route-list a:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 18px 46px rgba(31, 48, 40, 0.13);
|
||||
}
|
||||
.release-card {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
@@ -396,8 +403,8 @@ input {
|
||||
outline: none;
|
||||
}
|
||||
input:focus {
|
||||
border-color: rgba(59, 130, 246, 0.65);
|
||||
box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.14);
|
||||
border-color: rgba(31, 111, 91, 0.58);
|
||||
box-shadow: 0 0 0 4px rgba(31, 111, 91, 0.12);
|
||||
}
|
||||
.source-board {
|
||||
display: grid;
|
||||
@@ -434,7 +441,7 @@ input:focus {
|
||||
}
|
||||
.route-list a:hover {
|
||||
transform: translateY(-1px);
|
||||
border-color: rgba(59, 130, 246, 0.36);
|
||||
border-color: rgba(31, 111, 91, 0.30);
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
}
|
||||
.route-list span { color: var(--muted); font-size: 13px; font-weight: 700; }
|
||||
@@ -476,5 +483,5 @@ input:focus {
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
|
||||
*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user