Zuev/magistr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

редизайн кнопок 1st version

Browse Source
This commit is contained in:
alekan
2026-06-01 02:41:28 +03:00
parent 30972db9ee
commit 3217586657
62 changed files with 1502 additions and 479 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/admin/settings/css/layout.css
View File

@@ -25,15 +25,7 @@
}
.sidebar-close-btn {
background: transparent;
border: none;
color: var(--text-secondary);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
padding: 0.25rem;
border-radius: var(--radius-sm);
transition: all var(--transition);
}
@@ -265,12 +257,7 @@
/* ===== Mobile Menu Toggle ===== */
.menu-toggle {
display: none;
padding: 0.4rem;
background: none;
border: none;
color: var(--text-primary);
cursor: pointer;
border-radius: var(--radius-sm);
transition: background var(--transition);
}

109
frontend/admin/settings/css/main.css
View File

@@ -46,9 +46,9 @@
--text-primary: #0f172a;
--text-secondary: #475569;
--text-placeholder: #94a3b8;
--accent: #6366f1;
--accent-hover: #4f46e5;
--accent-glow: rgba(99, 102, 241, 0.3);
--accent: #4F46E5;
--accent-hover: #4338CA;
--accent-glow: rgba(79, 70, 229, 0.3);
--accent-secondary: #d946ef;
--error: #ef4444;
--success: #10b981;
@@ -77,20 +77,19 @@ body {
/* ===== Переключатель темы ===== */
.theme-toggle {
width: 42px;
height: 42px;
border: none;
border-radius: 50%;
background: var(--bg-card);
border: 1px solid var(--bg-card-border);
color: var(--text-primary);
cursor: pointer;
display: flex;
width: 40px;
height: 40px;
border-radius: var(--button-radius);
background: var(--button-secondary-bg);
border: 1px solid var(--button-secondary-border);
color: var(--button-secondary-text);
display: inline-flex;
align-items: center;
justify-content: center;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
padding: 0;
transition: background var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition), transform var(--transition);
z-index: 100;
flex-shrink: 0;
}
@@ -102,12 +101,18 @@ body {
}
.theme-toggle:hover {
transform: scale(1.1);
box-shadow: 0 4px 16px var(--accent-glow);
background: var(--button-secondary-bg-hover);
border-color: var(--button-secondary-border);
transform: translateY(-1px);
}
.theme-toggle:active {
transform: scale(0.95);
transform: translateY(0);
}
.theme-toggle:focus-visible {
outline: none;
box-shadow: 0 0 0 3px var(--button-focus-ring);
}
.theme-toggle--fixed {
@@ -265,63 +270,6 @@ body {
cursor: pointer;
}
.btn-primary,
.btn-secondary,
.btn-delete {
min-height: 40px;
border: 1px solid transparent;
border-radius: var(--radius-sm);
padding: 0 0.9rem;
color: var(--text-primary);
font: inherit;
font-weight: 700;
cursor: pointer;
transition: transform var(--transition), background var(--transition), border-color var(--transition);
white-space: nowrap;
}
.btn-primary {
background: var(--accent);
}
.btn-primary:hover {
background: var(--accent-hover);
transform: translateY(-1px);
}
.btn-secondary {
background: var(--bg-input);
border-color: var(--bg-card-border);
}
.btn-secondary:hover {
background: var(--bg-hover);
transform: translateY(-1px);
}
.btn-delete {
background: rgba(239, 68, 68, 0.13);
border-color: rgba(239, 68, 68, 0.25);
color: #fecaca;
}
[data-theme="light"] .btn-delete {
color: #991b1b;
}
.btn-delete:hover {
background: rgba(239, 68, 68, 0.2);
transform: translateY(-1px);
}
.btn-primary:disabled,
.btn-secondary:disabled,
.btn-delete:disabled {
cursor: not-allowed;
opacity: 0.45;
transform: none;
}
.form-alert {
grid-column: 1 / -1;
min-height: 0;
@@ -614,7 +562,7 @@ body {
grid-template-columns: 1fr;
}
.settings-form .btn-primary {
.settings-form .btn {
width: fit-content;
}
@@ -630,9 +578,16 @@ body {
flex-direction: column;
}
.settings-header-row .btn-primary,
.card-header-row .btn-secondary,
.settings-form .btn-primary {
.settings-header-row .btn,
.card-header-row .btn,
.settings-form .btn {
width: 100%;
}
}
.settings-modal-close.btn-icon-sm {
width: 32px !important;
height: 32px !important;
min-height: 32px !important;
padding: 0 !important;
border-radius: var(--button-radius) !important;
}

4
frontend/admin/settings/index.html
View File

@@ -32,7 +32,7 @@
</svg>
<span>Настройки</span>
</div>
<button class="sidebar-close-btn" id="sidebar-close-btn" aria-label="Скрыть панель">
<button class="btn btn-icon-sm btn-ghost sidebar-close-btn" id="sidebar-close-btn" aria-label="Скрыть панель">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="15 18 9 12 15 6" />
</svg>
@@ -94,7 +94,7 @@
<!-- Основная область -->
<main class="main">
<header class="topbar">
<button class="menu-toggle" id="menu-toggle" aria-label="Меню">
<button class="btn btn-icon-md btn-ghost menu-toggle" id="menu-toggle" aria-label="Меню">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round">
<line x1="3" y1="6" x2="21" y2="6" />

4
frontend/admin/settings/js/views/database.js
View File

@@ -68,7 +68,7 @@ export async function initDatabase() {
<td><code style="font-size: 0.82rem;">${escapeHtml(t.url)}</code></td>
<td>${escapeHtml(t.username || '—')}</td>
<td>${statusBadge}</td>
<td><button class="btn-delete" data-domain="${escapeHtml(t.domain)}">Удалить</button></td>
<td><button class="btn btn-sm btn-danger btn-delete-tenant" data-domain="${escapeHtml(t.domain)}">Удалить</button></td>
</tr>`;
}).join('');
}
@@ -136,7 +136,7 @@ export async function initDatabase() {
// === Удаление тенанта ===
tenantsTbody.addEventListener('click', async (e) => {
const btn = e.target.closest('.btn-delete');
const btn = e.target.closest('.btn-delete-tenant');
if (!btn) return;
const domain = btn.dataset.domain;

4
frontend/admin/settings/js/views/edu-forms.js
View File

@@ -35,7 +35,7 @@ export async function initEduForms() {
<tr>
<td>${ef.id}</td>
<td>${escapeHtml(ef.name)}</td>
<td><button class="btn-delete" data-id="${ef.id}">Удалить</button></td>
<td><button class="btn btn-sm btn-danger btn-delete-edu-form" data-id="${ef.id}">Удалить</button></td>
</tr>`).join('');
}
@@ -56,7 +56,7 @@ export async function initEduForms() {
});
efTbody.addEventListener('click', async (e) => {
const btn = e.target.closest('.btn-delete');
const btn = e.target.closest('.btn-delete-edu-form');
if (!btn) return;
if (!confirm('Удалить форму обучения?')) return;
try {

4
frontend/admin/settings/js/views/time-slots.js
View File

@@ -143,8 +143,8 @@ export async function initTimeSlotsSettings() {
<td>${escapeHtml(trimTime(slot.endTime))}</td>
<td>${escapeHtml(String(slot.durationMinutes ?? '-'))}</td>
<td class="actions-cell">
<button type="button" class="btn-secondary btn-edit-time-slot" data-id="${slot.id}">Изменить</button>
<button type="button" class="btn-delete btn-delete-time-slot" data-id="${slot.id}">Удалить</button>
<button type="button" class="btn btn-sm btn-secondary btn-edit-time-slot" data-id="${slot.id}">Изменить</button>
<button type="button" class="btn btn-sm btn-danger btn-delete-time-slot" data-id="${slot.id}">Удалить</button>
</td>
</tr>
`).join('');

4
frontend/admin/settings/views/database.html
View File

@@ -61,10 +61,10 @@
<label for="tenant-password">Пароль</label>
<input type="password" id="tenant-password" placeholder="••••••••" required>
</div>
<button type="button" class="btn-primary" id="btn-test-connection" style="height: fit-content;">
<button type="button" class="btn btn-md btn-secondary" id="btn-test-connection" style="height: fit-content;">
Тест
</button>
<button type="submit" class="btn-primary" style="height: fit-content;">
<button type="submit" class="btn btn-md btn-primary" style="height: fit-content;">
Добавить
</button>
</div>

2
frontend/admin/settings/views/edu-forms.html
View File

@@ -7,7 +7,7 @@
<label for="new-ef-name">Название</label>
<input type="text" id="new-ef-name" placeholder="Бакалавриат" required>
</div>
<button type="submit" class="btn-primary">Создать</button>
<button type="submit" class="btn btn-md btn-primary">Создать</button>
</div>
<div class="form-alert" id="create-ef-alert" role="alert"></div>
</form>

21
frontend/admin/settings/views/time-slots.html
View File

@@ -4,7 +4,7 @@
<h2>Временные слоты</h2>
<p>Настройка базовой, субботней и ручных сеток времени.</p>
</div>
<button type="button" class="btn-primary" id="time-slots-refresh">Обновить</button>
<button type="button" class="btn btn-md btn-secondary" id="time-slots-refresh">Обновить</button>
</div>
<div class="settings-grid">
@@ -12,8 +12,8 @@
<div class="card-header-row">
<h3>Сетка времени</h3>
<div class="scope-header-actions">
<button type="button" class="btn-primary" id="time-slot-scope-open-create">Новая ручная сетка</button>
<button type="button" class="btn-secondary" id="time-slot-scope-delete">Удалить сетку</button>
<button type="button" class="btn btn-md btn-primary" id="time-slot-scope-open-create">Новая ручная сетка</button>
<button type="button" class="btn btn-md btn-danger-subtle" id="time-slot-scope-delete">Удалить сетку</button>
</div>
</div>
@@ -47,7 +47,7 @@
<article class="settings-card">
<div class="card-header-row">
<h3 id="time-slot-form-title">Новый слот</h3>
<button type="button" class="btn-secondary" id="time-slot-reset">Очистить</button>
<button type="button" class="btn btn-md btn-ghost" id="time-slot-reset">Очистить</button>
</div>
<form id="time-slot-form" class="settings-form" novalidate>
@@ -73,7 +73,7 @@
<input type="number" id="time-slot-duration" min="1" step="1" placeholder="90">
</label>
<button type="submit" class="btn-primary">Сохранить слот</button>
<button type="submit" class="btn btn-md btn-primary">Сохранить слот</button>
<div class="form-alert" id="time-slot-alert" role="alert"></div>
</form>
</article>
@@ -106,7 +106,12 @@
<h3 id="time-slot-scope-modal-title">Новая ручная сетка</h3>
<p class="settings-modal-subtitle">Создайте отдельную сетку времени, которую затем можно назначать датам в календарном графике.</p>
</div>
<button type="button" class="settings-modal-close" id="time-slot-scope-modal-close" aria-label="Закрыть">×</button>
<button type="button" class="btn btn-icon-sm btn-secondary settings-modal-close" id="time-slot-scope-modal-close" aria-label="Закрыть">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
<form id="time-slot-scope-form" class="settings-modal-form" novalidate>
@@ -116,8 +121,8 @@
</label>
<div class="settings-modal-actions">
<button type="submit" class="btn-primary">Создать сетку</button>
<button type="button" class="btn-secondary" id="time-slot-scope-modal-cancel">Отмена</button>
<button type="submit" class="btn btn-md btn-primary">Создать сетку</button>
<button type="button" class="btn btn-md btn-ghost" id="time-slot-scope-modal-cancel">Отмена</button>
</div>
<div class="form-alert" id="time-slot-scope-alert" role="alert"></div>