Константин Лебединский
2d6d75fb3c
Только layout/spacing/touch-targets, без изменения цветовой палитры и типографики. editor.html - Шапка теста: «Название» — отдельной строкой, large input; «Описание» ниже; «Проходной балл» — компактная пара label+input справа, inputmode="numeric". - AI-панель разбита на 3 группы с подзаголовками: «Создать вопросы» (По названию / По текущей сетке), «Улучшить существующее» (Проверить / Улучшить), «Импортировать» (загрузка файла). - Все основные кнопки — min-h-11, на мобиле во всю ширину/в гриде по 2. - Карточка вопроса: бейдж-номер, кнопки up/down/delete по 40×40, textarea и опции — на всю ширину с min-w-0 чтобы не было overflow. - Опции: чекбокс «Правильный» в 40×40 tap-target, input занимает flex, кнопка удаления 40×40. - Footer переведён на fixed bottom с safe-area-inset-bottom; контент получает pb-24, чтобы не уезжал под футер. - Модалка AI-результата теперь fullscreen на мобиле, sm:rounded-2xl на десктопе; шапка/тело/кнопки — отдельными зонами. list.html - Заголовок и кнопка «Создать тест» вертикально на мобиле, кнопка во всю ширину min-h-11. - Карточка теста — целиком кликабельная (`<a>` обёртка), grid-cols-1 по умолчанию, sm:2, lg:3. - Модалка создания — fullscreen на мобиле с крестиком в шапке, safe-area-inset-bottom в футере. base.html - Ссылки «Тесты» и «Настройки» теперь видны и на мобиле как иконки (40×40 tap-target), подписи появляются с sm: брейкпоинта. - Имя/роль пользователя — только с md+ (узкий мобильный экран). Made-with: Cursor
116 lines
4.6 KiB
HTML
116 lines
4.6 KiB
HTML
<!doctype html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<title>{% block title %}Тестирование персонала{% endblock %}</title>
|
|
|
|
{# Tailwind CDN — на E1.0 этого достаточно. В Этапе 2/CI можно заменить на сборку. #}
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script>
|
|
// Минимальная палитра в стиле кабинета HR. Без зависимостей от HR-репо.
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
sans: ['Manrope', 'Inter', 'system-ui', 'sans-serif'],
|
|
},
|
|
colors: {
|
|
brand: {
|
|
50: '#eef2ff',
|
|
100: '#e0e7ff',
|
|
500: '#6366f1',
|
|
600: '#4f46e5',
|
|
700: '#4338ca',
|
|
},
|
|
ink: {
|
|
900: '#0f172a',
|
|
700: '#334155',
|
|
500: '#64748b',
|
|
300: '#cbd5e1',
|
|
100: '#f1f5f9',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
<link
|
|
rel="stylesheet"
|
|
href="https://fonts.googleapis.com/icon?family=Material+Symbols+Outlined"
|
|
/>
|
|
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/app.css') }}" />
|
|
{% block head %}{% endblock %}
|
|
</head>
|
|
<body class="min-h-screen bg-ink-100 text-ink-900 font-sans antialiased">
|
|
<header class="sticky top-0 z-30 bg-white/90 backdrop-blur border-b border-ink-300/60">
|
|
<div class="mx-auto max-w-6xl px-4 h-14 flex items-center justify-between">
|
|
<a href="{{ url_for('main.index') }}" class="flex items-center gap-2 font-semibold text-ink-900">
|
|
<span class="material-symbols-outlined text-brand-600">quiz</span>
|
|
<span>Тестирование</span>
|
|
</a>
|
|
<nav class="flex items-center gap-1 sm:gap-2 text-sm">
|
|
{% if current_user %}
|
|
<a href="{{ url_for('tests.tests_list_page') }}"
|
|
class="inline-flex items-center justify-center gap-1
|
|
min-w-10 min-h-10 px-2 sm:px-3 rounded-lg
|
|
text-ink-700 hover:bg-ink-100"
|
|
title="Каталог тестов" aria-label="Каталог тестов">
|
|
<span class="material-symbols-outlined text-base">list_alt</span>
|
|
<span class="hidden sm:inline">Тесты</span>
|
|
</a>
|
|
<a href="{{ url_for('settings.settings_page') }}"
|
|
class="inline-flex items-center justify-center gap-1
|
|
min-w-10 min-h-10 px-2 sm:px-3 rounded-lg
|
|
text-ink-700 hover:bg-ink-100"
|
|
title="Настройки" aria-label="Настройки">
|
|
<span class="material-symbols-outlined text-base">settings</span>
|
|
<span class="hidden sm:inline">Настройки</span>
|
|
</a>
|
|
<span class="hidden md:inline text-ink-500">
|
|
{{ current_user.full_name or current_user.login }}
|
|
<span class="text-ink-300">·</span>
|
|
<span class="text-brand-700">{{ current_user.role }}</span>
|
|
</span>
|
|
<form method="post" action="{{ url_for('auth.logout') }}" class="inline">
|
|
<button type="submit"
|
|
class="inline-flex items-center justify-center gap-1
|
|
min-w-10 min-h-10 px-2 sm:px-3 rounded-lg
|
|
text-ink-700 hover:bg-ink-100 transition"
|
|
title="Выйти" aria-label="Выйти">
|
|
<span class="material-symbols-outlined text-base">logout</span>
|
|
<span class="hidden sm:inline">Выйти</span>
|
|
</button>
|
|
</form>
|
|
{% else %}
|
|
<a href="{{ url_for('auth.login_page') }}"
|
|
class="inline-flex items-center gap-1 px-3 py-2 rounded-lg
|
|
text-brand-700 hover:bg-brand-50 transition min-h-10">
|
|
<span class="material-symbols-outlined text-base">login</span>
|
|
Войти
|
|
</a>
|
|
{% endif %}
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="mx-auto max-w-6xl px-4 py-6">
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<footer class="mx-auto max-w-6xl px-4 py-8 text-xs text-ink-500">
|
|
{% block footer %}testing-flask-app · Этап 1{% endblock %}
|
|
</footer>
|
|
|
|
{% block scripts %}{% endblock %}
|
|
</body>
|
|
</html>
|