Style: enhance Web Admin UI with Glassmorphism styles and animations from Swarm Dashboard
This commit is contained in:
parent
633b0f0d05
commit
3ad7651cd8
1 changed files with 62 additions and 0 deletions
|
|
@ -325,3 +325,65 @@ pre, code {
|
|||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
/* Дополнения для соответствия Swarm Dashboard */
|
||||
.glass-panel {
|
||||
background: var(--panel-bg) !important;
|
||||
backdrop-filter: blur(12px) !important;
|
||||
-webkit-backdrop-filter: blur(12px) !important;
|
||||
border: 1px solid var(--panel-border) !important;
|
||||
border-radius: 16px !important;
|
||||
padding: 24px !important;
|
||||
transition: var(--transition-smooth) !important;
|
||||
}
|
||||
|
||||
.glass-panel:hover {
|
||||
background: var(--panel-bg-hover) !important;
|
||||
border-color: var(--panel-border-hover) !important;
|
||||
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4) !important;
|
||||
}
|
||||
|
||||
@keyframes neonPulseSuccess {
|
||||
0%, 100% { box-shadow: 0 0 8px var(--color-success-glow); }
|
||||
50% { box-shadow: 0 0 18px rgba(0, 255, 204, 0.6); }
|
||||
}
|
||||
|
||||
@keyframes neonPulseDanger {
|
||||
0%, 100% { box-shadow: 0 0 8px var(--color-danger-glow); }
|
||||
50% { box-shadow: 0 0 18px rgba(255, 45, 85, 0.6); }
|
||||
}
|
||||
|
||||
@keyframes neonPulsePrimary {
|
||||
0%, 100% { box-shadow: 0 0 8px var(--color-primary-glow); }
|
||||
50% { box-shadow: 0 0 18px rgba(138, 43, 226, 0.6); }
|
||||
}
|
||||
|
||||
.glow-success {
|
||||
animation: neonPulseSuccess 3s infinite alternate !important;
|
||||
}
|
||||
|
||||
.glow-danger {
|
||||
animation: neonPulseDanger 3s infinite alternate !important;
|
||||
}
|
||||
|
||||
.glow-primary {
|
||||
animation: neonPulsePrimary 3s infinite alternate !important;
|
||||
}
|
||||
|
||||
.text-gradient {
|
||||
background: linear-gradient(135deg, #fff 0%, var(--color-text-muted) 100%) !important;
|
||||
-webkit-background-clip: text !important;
|
||||
-webkit-text-fill-color: transparent !important;
|
||||
}
|
||||
|
||||
.text-gradient-neon {
|
||||
background: linear-gradient(135deg, #00ffcc 0%, #8a2be2 100%) !important;
|
||||
-webkit-background-clip: text !important;
|
||||
-webkit-text-fill-color: transparent !important;
|
||||
}
|
||||
|
||||
.flex-center {
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue