feat: 10个登录页图标统一 — 蓝紫渐变(#3b82f6→#8b5cf6)+白色盾牌勾选,与favicon一致
This commit is contained in:
1 parent
e6b421574d
commit
41dab3deab
10 files changed
+18
-111
No files matched your search
@@ -198,7 +198,7 @@ export default function AuroraView(): JSX.Element {
|
|||||||
width: 44,
|
width: 44,
|
||||||
height: 44,
|
height: 44,
|
||||||
borderRadius: 12,
|
borderRadius: 12,
|
||||||
background: 'linear-gradient(135deg, #7c3aed 0%, #059669 100%)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
@@ -206,20 +206,7 @@ export default function AuroraView(): JSX.Element {
|
|||||||
boxShadow: '0 4px 20px rgba(124, 58, 237, 0.3), 0 2px 10px rgba(5, 150, 105, 0.2)',
|
boxShadow: '0 4px 20px rgba(124, 58, 237, 0.3), 0 2px 10px rgba(5, 150, 105, 0.2)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg
|
<svg width={22} height={22} viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
width={22}
|
|
||||||
height={22}
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
fill="none"
|
|
||||||
stroke="#fff"
|
|
||||||
strokeWidth={2}
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
>
|
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 标题 */}
|
{/* 标题 */}
|
||||||
|
|||||||
@@ -143,24 +143,14 @@ export default function CenteredCard() {
|
|||||||
width: 44,
|
width: 44,
|
||||||
height: 44,
|
height: 44,
|
||||||
borderRadius: 12,
|
borderRadius: 12,
|
||||||
background: 'linear-gradient(135deg, #fbbf24, #f59e0b)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
margin: '0 auto 24px',
|
margin: '0 auto 24px',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
<circle cx="12" cy="12" r="4" />
|
|
||||||
<line x1="12" y1="2" x2="12" y2="5" />
|
|
||||||
<line x1="12" y1="19" x2="12" y2="22" />
|
|
||||||
<line x1="4.93" y1="4.93" x2="7.05" y2="7.05" />
|
|
||||||
<line x1="16.95" y1="16.95" x2="19.07" y2="19.07" />
|
|
||||||
<line x1="2" y1="12" x2="5" y2="12" />
|
|
||||||
<line x1="19" y1="12" x2="22" y2="12" />
|
|
||||||
<line x1="4.93" y1="19.07" x2="7.05" y2="16.95" />
|
|
||||||
<line x1="16.95" y1="7.05" x2="19.07" y2="4.93" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 style={{ textAlign: 'center', fontSize: 22, fontWeight: 600, color: '#fef3c7', marginBottom: 6 }}>
|
<h1 style={{ textAlign: 'center', fontSize: 22, fontWeight: 600, color: '#fef3c7', marginBottom: 6 }}>
|
||||||
|
|||||||
@@ -344,7 +344,7 @@ export default function CosmosView(): JSX.Element {
|
|||||||
width: 44,
|
width: 44,
|
||||||
height: 44,
|
height: 44,
|
||||||
borderRadius: 14,
|
borderRadius: 14,
|
||||||
background: 'linear-gradient(135deg, #1e3a8a, #7c3aed)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
@@ -352,11 +352,7 @@ export default function CosmosView(): JSX.Element {
|
|||||||
boxShadow: '0 4px 20px rgba(79,70,229,0.3), inset 0 1px 0 rgba(255,255,255,0.15)',
|
boxShadow: '0 4px 20px rgba(79,70,229,0.3), inset 0 1px 0 rgba(255,255,255,0.15)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<h1
|
<h1
|
||||||
style={{
|
style={{
|
||||||
|
|||||||
@@ -147,11 +147,7 @@ export default function FullImage() {
|
|||||||
marginBottom: 18,
|
marginBottom: 18,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
<h1 style={{ fontSize: 20, fontWeight: 600, color: '#fff', marginBottom: 4, textAlign: 'center' }}>
|
<h1 style={{ fontSize: 20, fontWeight: 600, color: '#fff', marginBottom: 4, textAlign: 'center' }}>
|
||||||
OpsxSQL
|
OpsxSQL
|
||||||
|
|||||||
@@ -194,7 +194,7 @@ export default function GradientMeshView(): React.JSX.Element {
|
|||||||
width: 48,
|
width: 48,
|
||||||
height: 48,
|
height: 48,
|
||||||
borderRadius: 16,
|
borderRadius: 16,
|
||||||
background: 'linear-gradient(135deg, #6366f1, #f43f5e)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'inline-flex',
|
display: 'inline-flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
@@ -202,20 +202,7 @@ export default function GradientMeshView(): React.JSX.Element {
|
|||||||
boxShadow: '0 8px 24px rgba(99,102,241,0.25)',
|
boxShadow: '0 8px 24px rgba(99,102,241,0.25)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg
|
<svg width={20} height={20} viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
width={20}
|
|
||||||
height={20}
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
fill="none"
|
|
||||||
stroke="#fff"
|
|
||||||
strokeWidth={2}
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
>
|
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1
|
<h1
|
||||||
|
|||||||
@@ -255,7 +255,7 @@ export default function InkWashView(): JSX.Element {
|
|||||||
width: 44,
|
width: 44,
|
||||||
height: 44,
|
height: 44,
|
||||||
borderRadius: 10,
|
borderRadius: 10,
|
||||||
background: 'linear-gradient(135deg, #3a362e, #1f1d19)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'inline-flex',
|
display: 'inline-flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
@@ -263,20 +263,7 @@ export default function InkWashView(): JSX.Element {
|
|||||||
boxShadow: '0 2px 8px rgba(0,0,0,0.12)',
|
boxShadow: '0 2px 8px rgba(0,0,0,0.12)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
width="20"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
fill="none"
|
|
||||||
stroke="#c9a96e"
|
|
||||||
strokeWidth="2"
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
>
|
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 标题 */}
|
{/* 标题 */}
|
||||||
|
|||||||
@@ -187,11 +187,7 @@ export default function MinimalDark() {
|
|||||||
boxShadow: '0 4px 20px rgba(168,85,247,0.3)',
|
boxShadow: '0 4px 20px rgba(168,85,247,0.3)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Brand name */}
|
{/* Brand name */}
|
||||||
|
|||||||
@@ -268,7 +268,7 @@ export default function NeonCityView(): JSX.Element {
|
|||||||
width: 44,
|
width: 44,
|
||||||
height: 44,
|
height: 44,
|
||||||
borderRadius: 12,
|
borderRadius: 12,
|
||||||
background: 'linear-gradient(135deg, #ec4899, #06b6d4)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'inline-flex',
|
display: 'inline-flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
@@ -276,20 +276,7 @@ export default function NeonCityView(): JSX.Element {
|
|||||||
boxShadow: '0 0 15px rgba(236, 72, 153, 0.5), 0 0 30px rgba(6, 182, 212, 0.3)',
|
boxShadow: '0 0 15px rgba(236, 72, 153, 0.5), 0 0 30px rgba(6, 182, 212, 0.3)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
width="22"
|
|
||||||
height="22"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
fill="none"
|
|
||||||
stroke="#fff"
|
|
||||||
strokeWidth="2"
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
>
|
|
||||||
<ellipse cx="12" cy="5" rx="9" ry="3" />
|
|
||||||
<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
|
|
||||||
<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Title */}
|
{/* Title */}
|
||||||
@@ -464,20 +451,7 @@ export default function NeonCityView(): JSX.Element {
|
|||||||
>
|
>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<span style={{ display: 'inline-flex', alignItems: 'center', gap: 8 }}>
|
<span style={{ display: 'inline-flex', alignItems: 'center', gap: 8 }}>
|
||||||
<svg
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
width="16"
|
|
||||||
height="16"
|
|
||||||
viewBox="0 0 24 24"
|
|
||||||
fill="none"
|
|
||||||
stroke="currentColor"
|
|
||||||
strokeWidth="2"
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
style={{ animation: 'spin 1s linear infinite' }}
|
|
||||||
>
|
|
||||||
<style>{`@keyframes spin { to { transform: rotate(360deg); } }`}</style>
|
|
||||||
<path d="M21 12a9 9 0 1 1-6.219-8.56" />
|
|
||||||
</svg>
|
|
||||||
登录中...
|
登录中...
|
||||||
</span>
|
</span>
|
||||||
) : (
|
) : (
|
||||||
|
|||||||
@@ -34,7 +34,7 @@ export default function SidePanel() {
|
|||||||
<div className="mb-8">
|
<div className="mb-8">
|
||||||
<div className="flex items-center gap-3 mb-5">
|
<div className="flex items-center gap-3 mb-5">
|
||||||
<div className="w-11 h-11 rounded-xl dg-gradient-br flex items-center justify-center">
|
<div className="w-11 h-11 rounded-xl dg-gradient-br flex items-center justify-center">
|
||||||
<Shield className="w-6 h-6 text-white" />
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
</div>
|
</div>
|
||||||
<h1 className="text-4xl font-bold dg-gradient-text">
|
<h1 className="text-4xl font-bold dg-gradient-text">
|
||||||
OpsxSQL
|
OpsxSQL
|
||||||
|
|||||||
@@ -146,7 +146,7 @@ export default function SplitView() {
|
|||||||
width: 48,
|
width: 48,
|
||||||
height: 48,
|
height: 48,
|
||||||
borderRadius: 12,
|
borderRadius: 12,
|
||||||
background: 'linear-gradient(135deg, #00d4aa, #0ea5e9)',
|
background: 'linear-gradient(135deg, #3b82f6, #8b5cf6)',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
@@ -154,13 +154,7 @@ export default function SplitView() {
|
|||||||
boxShadow: '0 4px 24px rgba(0,212,170,0.3)',
|
boxShadow: '0 4px 24px rgba(0,212,170,0.3)',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round">
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2L20 6V11C20 16 16 19.5 12 22C8 19.5 4 16 4 11V6L12 2Z" /><path d="M9 12L11 14L15 10" /></svg>
|
||||||
<path d="M12 2L22 8.5V15.5L12 22L2 15.5V8.5L12 2Z" />
|
|
||||||
<path d="M12 22V15.5" />
|
|
||||||
<path d="M22 8.5L12 15.5L2 8.5" />
|
|
||||||
<path d="M2 15.5L12 8.5L22 15.5" />
|
|
||||||
<line x1="12" y1="2" x2="12" y2="8.5" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 style={{ fontSize: 36, fontWeight: 700, color: '#e2e8f0', marginBottom: 10, letterSpacing: '-0.5px', lineHeight: 1.2 }}>
|
<h1 style={{ fontSize: 36, fontWeight: 700, color: '#e2e8f0', marginBottom: 10, letterSpacing: '-0.5px', lineHeight: 1.2 }}>
|
||||||
|
|||||||
Reference in new issue
Block a user