Большое обновление GUI интерфейс
Большое обновление GUI интерфейс - Добавлен фраемворr Walles - Удалена консольная версия - Проработан интерфейс и дизайн - Добавлено кеширование для быстрой реакции. - Сделан .ps1 сборщик для удобной сборки проекта. - Обновлён Readme
This commit is contained in:
87
Backend/admin/frontend/assets/css/components/badges.css
Normal file
87
Backend/admin/frontend/assets/css/components/badges.css
Normal file
@@ -0,0 +1,87 @@
|
||||
/* ============================================
|
||||
Badges Component
|
||||
Единая система бейджей
|
||||
============================================ */
|
||||
|
||||
/* Base Badge */
|
||||
.badge {
|
||||
padding: 4px 12px;
|
||||
border-radius: 20px;
|
||||
font-size: var(--text-xs);
|
||||
font-weight: var(--font-bold);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
backdrop-filter: var(--backdrop-blur-light);
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* Status Badges */
|
||||
.badge-online {
|
||||
background: linear-gradient(135deg, rgba(16, 185, 129, 0.25), rgba(16, 185, 129, 0.15));
|
||||
color: var(--accent-green);
|
||||
border: 1px solid rgba(16, 185, 129, 0.4);
|
||||
box-shadow: 0 0 12px rgba(16, 185, 129, 0.3);
|
||||
}
|
||||
|
||||
.badge-offline {
|
||||
background: linear-gradient(135deg, rgba(239, 68, 68, 0.25), rgba(239, 68, 68, 0.15));
|
||||
color: var(--accent-red);
|
||||
border: 1px solid rgba(239, 68, 68, 0.4);
|
||||
box-shadow: 0 0 12px rgba(239, 68, 68, 0.3);
|
||||
}
|
||||
|
||||
.badge-pending {
|
||||
background: linear-gradient(135deg, rgba(245, 158, 11, 0.25), rgba(245, 158, 11, 0.15));
|
||||
color: var(--accent-yellow);
|
||||
border: 1px solid rgba(245, 158, 11, 0.4);
|
||||
box-shadow: 0 0 12px rgba(245, 158, 11, 0.3);
|
||||
}
|
||||
|
||||
/* Yes/No Badges */
|
||||
.badge-yes {
|
||||
background: rgba(34, 197, 94, 0.2);
|
||||
color: var(--accent-green);
|
||||
border: 1px solid var(--accent-green);
|
||||
}
|
||||
|
||||
.badge-no {
|
||||
background: rgba(100, 116, 139, 0.2);
|
||||
color: var(--text-muted);
|
||||
border: 1px solid var(--text-muted);
|
||||
}
|
||||
|
||||
/* Status Indicator (Dot) */
|
||||
.status-indicator {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
border-radius: var(--radius-full);
|
||||
box-shadow: 0 0 8px currentColor;
|
||||
}
|
||||
|
||||
.status-online {
|
||||
background: var(--accent-green);
|
||||
color: var(--accent-green);
|
||||
}
|
||||
|
||||
.status-offline {
|
||||
background: var(--accent-red);
|
||||
color: var(--accent-red);
|
||||
}
|
||||
|
||||
/* Mini Tags (для таблиц) */
|
||||
.mini-tag {
|
||||
display: inline-block;
|
||||
padding: 4px 10px;
|
||||
background: rgba(139, 92, 246, 0.15);
|
||||
border-radius: var(--radius-sm);
|
||||
font-size: 12px;
|
||||
font-family: var(--font-mono);
|
||||
color: var(--accent-purple-light);
|
||||
margin: 2px;
|
||||
transition: all var(--transition-base);
|
||||
|
||||
&:hover {
|
||||
background: rgba(139, 92, 246, 0.25);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user