绚丽增强层静态可见度提升:卡片描边常驻、KPI 光晕、登录页提亮、按钮渐变加深、静态 message 弹窗暗色玻璃化,素材同步重采
|
Before Width: | Height: | Size: 789 KiB After Width: | Height: | Size: 828 KiB |
|
Before Width: | Height: | Size: 602 KiB After Width: | Height: | Size: 623 KiB |
|
Before Width: | Height: | Size: 672 KiB After Width: | Height: | Size: 717 KiB |
|
Before Width: | Height: | Size: 597 KiB After Width: | Height: | Size: 662 KiB |
|
Before Width: | Height: | Size: 790 KiB After Width: | Height: | Size: 842 KiB |
|
Before Width: | Height: | Size: 952 KiB After Width: | Height: | Size: 1008 KiB |
|
Before Width: | Height: | Size: 1011 KiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 861 KiB After Width: | Height: | Size: 907 KiB |
|
Before Width: | Height: | Size: 1.7 MiB After Width: | Height: | Size: 1.7 MiB |
|
Before Width: | Height: | Size: 1017 KiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 782 KiB After Width: | Height: | Size: 823 KiB |
|
Before Width: | Height: | Size: 688 KiB After Width: | Height: | Size: 736 KiB |
@@ -286,13 +286,13 @@ body::after {
|
|||||||
|
|
||||||
.ant-btn-primary {
|
.ant-btn-primary {
|
||||||
border: 0;
|
border: 0;
|
||||||
background: linear-gradient(135deg, #0891b2, #2563eb 52%, #7c3aed);
|
background: linear-gradient(135deg, #0e7490, #1d4ed8 52%, #6d28d9);
|
||||||
box-shadow: 0 10px 24px rgba(37, 99, 235, 0.28);
|
box-shadow: 0 10px 24px rgba(37, 99, 235, 0.28);
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-btn-primary:hover,
|
.ant-btn-primary:hover,
|
||||||
.ant-btn-primary:focus {
|
.ant-btn-primary:focus {
|
||||||
background: linear-gradient(135deg, #06b6d4, #3b82f6 52%, #8b5cf6) !important;
|
background: linear-gradient(135deg, #0891b2, #2563eb 52%, #7c3aed) !important;
|
||||||
box-shadow: 0 0 26px rgba(34, 211, 238, 0.26) !important;
|
box-shadow: 0 0 26px rgba(34, 211, 238, 0.26) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -566,3 +566,40 @@ body::after {
|
|||||||
.ant-alert-close-icon:hover .anticon-close {
|
.ant-alert-close-icon:hover .anticon-close {
|
||||||
color: #ecfeff !important;
|
color: #ecfeff !important;
|
||||||
}
|
}
|
||||||
|
/* Static message/notification calls (message.error etc.) do not consume ConfigProvider
|
||||||
|
dark theme in antd v5 — force dark glass panel so no white popup appears in dark shell. */
|
||||||
|
.ant-message .ant-message-notice-content,
|
||||||
|
.ant-notification .ant-notification-notice {
|
||||||
|
color: #e6f7ff;
|
||||||
|
border: 1px solid rgba(103, 232, 249, 0.28);
|
||||||
|
background: linear-gradient(145deg, rgba(14, 30, 56, 0.96), rgba(7, 18, 39, 0.96));
|
||||||
|
box-shadow: 0 16px 44px rgba(2, 8, 23, 0.55), 0 0 24px rgba(34, 211, 238, 0.12);
|
||||||
|
backdrop-filter: blur(16px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-message .ant-message-notice-content .ant-message-custom-content,
|
||||||
|
.ant-notification .ant-notification-notice-message,
|
||||||
|
.ant-notification .ant-notification-notice-description {
|
||||||
|
color: #e6f7ff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-message .ant-message-notice-content .anticon-close-circle,
|
||||||
|
.ant-message .ant-message-notice-content .anticon-close {
|
||||||
|
color: #fb7185 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-message .ant-message-notice-content .anticon-exclamation-circle {
|
||||||
|
color: #fbbf24 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-message .ant-message-notice-content .anticon-check-circle {
|
||||||
|
color: #4ade80 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-message .ant-message-notice-content .anticon-info-circle {
|
||||||
|
color: #67e8f9 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-message .ant-message-notice-content .anticon-loading {
|
||||||
|
color: #67e8f9 !important;
|
||||||
|
}
|
||||||
|
|||||||
@@ -72,7 +72,7 @@
|
|||||||
box-shadow:
|
box-shadow:
|
||||||
0 24px 70px rgba(0, 0, 0, 0.48),
|
0 24px 70px rgba(0, 0, 0, 0.48),
|
||||||
inset 0 1px 0 rgba(255, 255, 255, 0.08),
|
inset 0 1px 0 rgba(255, 255, 255, 0.08),
|
||||||
0 0 36px rgba(34, 211, 238, 0.12);
|
0 0 52px rgba(34, 211, 238, 0.22);
|
||||||
backdrop-filter: blur(22px);
|
backdrop-filter: blur(22px);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -120,7 +120,7 @@
|
|||||||
|
|
||||||
.brandRow p {
|
.brandRow p {
|
||||||
margin: 4px 0 0;
|
margin: 4px 0 0;
|
||||||
color: rgba(226, 242, 255, 0.58);
|
color: rgba(226, 242, 255, 0.82);
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
letter-spacing: 0.08em;
|
letter-spacing: 0.08em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
@@ -168,7 +168,7 @@
|
|||||||
height: 44px;
|
height: 44px;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
border: 0;
|
border: 0;
|
||||||
background: linear-gradient(135deg, #0891b2, #2563eb 52%, #7c3aed);
|
background: linear-gradient(135deg, #0e7490, #1d4ed8 52%, #6d28d9);
|
||||||
box-shadow: 0 14px 28px rgba(37, 99, 235, 0.3);
|
box-shadow: 0 14px 28px rgba(37, 99, 235, 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -182,7 +182,7 @@
|
|||||||
gap: 18px;
|
gap: 18px;
|
||||||
margin-top: 24px;
|
margin-top: 24px;
|
||||||
padding-top: 18px;
|
padding-top: 18px;
|
||||||
color: rgba(226, 242, 255, 0.52);
|
color: rgba(226, 242, 255, 0.78);
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
border-top: 1px solid rgba(103, 232, 249, 0.14);
|
border-top: 1px solid rgba(103, 232, 249, 0.14);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -428,6 +428,15 @@
|
|||||||
.kpi-card:nth-child(4) { animation-delay: 0.2s; }
|
.kpi-card:nth-child(4) { animation-delay: 0.2s; }
|
||||||
.kpi-card:nth-child(5) { animation-delay: 0.26s; }
|
.kpi-card:nth-child(5) { animation-delay: 0.26s; }
|
||||||
|
|
||||||
|
/* 常驻霓虹边框光(静态即可见) */
|
||||||
|
.kpi-card {
|
||||||
|
box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.18), 0 10px 28px rgba(2, 8, 23, 0.42), 0 0 22px rgba(34, 211, 238, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.ov-panel {
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 0 24px rgba(34, 211, 238, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes dazzle-ov-card-in {
|
@keyframes dazzle-ov-card-in {
|
||||||
from { opacity: 0; transform: translateY(10px); }
|
from { opacity: 0; transform: translateY(10px); }
|
||||||
to { opacity: 1; transform: translateY(0); }
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
|||||||
@@ -15,9 +15,9 @@
|
|||||||
/* ---------- 1. 动态极光背景:三团彩色光斑缓慢漂移 ---------- */
|
/* ---------- 1. 动态极光背景:三团彩色光斑缓慢漂移 ---------- */
|
||||||
body::after {
|
body::after {
|
||||||
background:
|
background:
|
||||||
radial-gradient(circle at 22% 24%, rgba(34, 211, 238, 0.16), transparent 32%),
|
radial-gradient(circle at 22% 24%, rgba(34, 211, 238, 0.22), transparent 34%),
|
||||||
radial-gradient(circle at 78% 30%, rgba(139, 92, 246, 0.15), transparent 34%),
|
radial-gradient(circle at 78% 30%, rgba(139, 92, 246, 0.2), transparent 36%),
|
||||||
radial-gradient(circle at 50% 80%, rgba(59, 130, 246, 0.17), transparent 38%);
|
radial-gradient(circle at 50% 80%, rgba(59, 130, 246, 0.22), transparent 40%);
|
||||||
animation: dazzle-aurora 36s ease-in-out infinite alternate;
|
animation: dazzle-aurora 36s ease-in-out infinite alternate;
|
||||||
will-change: transform;
|
will-change: transform;
|
||||||
}
|
}
|
||||||
@@ -60,7 +60,7 @@ body::before {
|
|||||||
transparent
|
transparent
|
||||||
);
|
);
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 38% 100%;
|
background-size: 46% 100%;
|
||||||
animation: dazzle-header-sweep 7s linear infinite;
|
animation: dazzle-header-sweep 7s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -103,7 +103,7 @@ body::before {
|
|||||||
-webkit-mask-composite: xor;
|
-webkit-mask-composite: xor;
|
||||||
mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
|
mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
|
||||||
mask-composite: exclude;
|
mask-composite: exclude;
|
||||||
opacity: 0.22;
|
opacity: 0.5;
|
||||||
transition: opacity 0.3s ease;
|
transition: opacity 0.3s ease;
|
||||||
animation: dazzle-ring-spin 7s linear infinite;
|
animation: dazzle-ring-spin 7s linear infinite;
|
||||||
}
|
}
|
||||||
|
|||||||