Update settings for unfold admin and remove footer

This commit is contained in:
Dmitry Belan
2026-09-21 10:51:40 +03:00
parent add81dcd22
commit b691299cbb
18 changed files with 3433 additions and 16 deletions
+472
View File
@@ -0,0 +1,472 @@
<!DOCTYPE html>
<html class="dark" lang="ru"><head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<meta content="web_dashboard" name="shell-type"/>
<title>Изменить Ответ ученика — Django LMS Admin</title>
<link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&amp;family=Plus+Jakarta+Sans:wght@400;500;600;700&amp;family=Space+Grotesk:wght@500;600;700&amp;display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
<style>
@layer base {
html, body { margin: 0; padding: 0; }
body { overscroll-behavior: none; }
main > :first-child { margin-top: 0 !important; }
main > :last-child { margin-bottom: 0 !important; }
}
::-webkit-scrollbar { display: none; }
</style>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<script id="tailwind-config">
tailwind.config = {
darkMode: "class",
theme: {
extend: {
colors: {
"canvas-base": "#0B0F17",
"background": "#11131b",
"surface-container-lowest": "#0b0d14",
"surface-container-low": "#141721",
"surface-container": "#191b23",
"surface-container-high": "#23252f",
"surface-container-highest": "#2b2e3a",
"surface-border": "#2e313c",
"primary": "#3b82f6",
"primary-container": "#2563eb",
"primary-hover": "#1d4ed8",
"status-emerald": "#10b981",
"status-amber": "#f59e0b",
"status-rose": "#f43f5e",
"on-surface": "#e2e8f0",
"on-surface-variant": "#94a3b8",
"text-faint": "#64748b",
"outline": "#475569",
"outline-variant": "#2e313c"
},
fontFamily: {
sans: ["Plus Jakarta Sans", "sans-serif"],
heading: ["Space Grotesk", "sans-serif"],
mono: ["JetBrains Mono", "monospace"]
}
}
}
};
</script>
</head>
<body class="bg-background font-sans text-[14px] text-on-surface antialiased selection:bg-primary/20 selection:text-white">
<!-- Left Sidebar (Technical Obsidian) -->
<aside class="fixed left-0 top-0 h-full w-72 bg-surface-container-lowest border-r border-surface-border z-50 flex flex-col justify-between">
<div class="flex flex-col">
<!-- Workspace Brand -->
<div class="h-16 px-5 flex items-center gap-3 border-b border-surface-border bg-surface-container-lowest">
<div class="w-9 h-9 rounded bg-primary-container flex items-center justify-center text-white shadow-sm">
<span class="material-symbols-outlined text-[20px]">terminal</span>
</div>
<div class="flex flex-col min-w-0">
<span class="font-heading font-semibold text-[14px] text-on-surface tracking-tight leading-tight truncate">Администрирование</span>
<span class="font-mono text-[11px] text-text-faint tracking-wider uppercase truncate">Django ЕГЭ LMS</span>
</div>
</div>
<!-- Environment Indicator -->
<div class="px-4 py-3 border-b border-surface-border/60">
<div class="flex items-center justify-between px-3 py-1.5 rounded bg-surface-container-low border border-surface-border/60">
<div class="flex items-center gap-2 min-w-0">
<span class="w-2 h-2 rounded-full bg-status-emerald animate-pulse"></span>
<span class="font-mono text-[11px] text-on-surface-variant truncate">Окружение: Prod</span>
</div>
<span class="font-mono text-[11px] text-primary px-1.5 py-0.5 rounded bg-surface-container-high border border-primary/20">v5.1.2</span>
</div>
</div>
<!-- Navigation: ONLY Обучение (LMS) and Пользователи -->
<nav class="flex flex-col px-3 py-3 gap-y-1">
<div class="pt-2 pb-1.5 px-3 font-mono text-[10px] text-text-faint uppercase tracking-wider font-semibold">Обучение (LMS)</div>
<a class="flex items-center justify-between px-3 py-2 rounded text-on-surface-variant hover:bg-surface-container-high hover:text-white transition-colors group" href="#">
<div class="flex items-center gap-2.5 min-w-0">
<span class="material-symbols-outlined text-[18px] text-text-faint group-hover:text-primary transition-colors">assignment</span>
<span class="font-heading text-[13px] font-medium truncate">Задания</span>
</div>
<span class="font-mono text-[11px] bg-surface-container-high text-text-faint px-1.5 py-0.5 rounded border border-surface-border/40">482</span>
</a>
<a aria-current="page" class="flex items-center justify-between px-3 py-2 rounded bg-surface-container-high text-white border border-primary/30 shadow-sm" href="#">
<div class="flex items-center gap-2.5 min-w-0">
<span class="material-symbols-outlined text-[18px] text-primary">rate_review</span>
<span class="font-heading text-[13px] font-medium truncate">Ответы учеников</span>
</div>
<span class="font-mono text-[11px] bg-primary-container text-white px-1.5 py-0.5 rounded font-semibold">+19</span>
</a>
<a class="flex items-center justify-between px-3 py-2 rounded text-on-surface-variant hover:bg-surface-container-high hover:text-white transition-colors group" href="#">
<div class="flex items-center gap-2.5 min-w-0">
<span class="material-symbols-outlined text-[18px] text-text-faint group-hover:text-primary transition-colors">menu_book</span>
<span class="font-heading text-[13px] font-medium truncate">Предметы</span>
</div>
<span class="font-mono text-[11px] bg-surface-container-high text-text-faint px-1.5 py-0.5 rounded border border-surface-border/40">8</span>
</a>
<div class="pt-4 pb-1.5 px-3 font-mono text-[10px] text-text-faint uppercase tracking-wider font-semibold">Пользователи</div>
<a class="flex items-center justify-between px-3 py-2 rounded text-on-surface-variant hover:bg-surface-container-high hover:text-white transition-colors group" href="#">
<div class="flex items-center gap-2.5 min-w-0">
<span class="material-symbols-outlined text-[18px] text-text-faint group-hover:text-primary transition-colors">group</span>
<span class="font-heading text-[13px] font-medium truncate">Пользователи</span>
</div>
<span class="font-mono text-[11px] bg-surface-container-high text-text-faint px-1.5 py-0.5 rounded border border-surface-border/40">1,420</span>
</a>
</nav>
</div>
<!-- Sidebar Bottom Meta -->
<div class="p-3 border-t border-surface-border bg-surface-container-lowest">
<div class="flex items-center justify-between px-3 py-2 text-text-faint hover:text-on-surface transition-colors cursor-pointer rounded hover:bg-surface-container-low">
<div class="flex items-center gap-2">
<span class="material-symbols-outlined text-[16px]">code</span>
<span class="font-mono text-[12px]">Django 5.1.2</span>
</div>
<span class="material-symbols-outlined text-[16px]">keyboard_double_arrow_left</span>
</div>
</div>
</aside>
<!-- Main Container -->
<div class="pl-72">
<!-- Top Header (No text collisions or overlaps) -->
<header class="fixed top-0 left-72 right-0 h-16 bg-surface-container-lowest/95 backdrop-blur-md border-b border-surface-border z-40 px-6 flex items-center justify-between">
<div class="flex items-center gap-4 min-w-0">
<button class="p-1.5 text-text-faint hover:text-white rounded hover:bg-surface-container-high transition-colors" type="button">
<span class="material-symbols-outlined text-[20px]">menu</span>
</button>
<div class="flex items-center gap-2 font-mono text-[12px] truncate">
<span class="text-text-faint uppercase tracking-wider">Django Admin</span>
<span class="text-surface-border">/</span>
<span class="text-on-surface font-heading font-medium tracking-normal truncate">ЕГЭ LMS Панель управления</span>
</div>
</div>
<div class="flex items-center gap-3 flex-shrink-0">
<a class="flex items-center gap-1.5 px-3 py-1.5 rounded border border-surface-border bg-surface-container-low text-on-surface-variant hover:text-white hover:bg-surface-container-high transition-all text-[13px] font-heading" href="#">
<span class="material-symbols-outlined text-[16px] text-primary">open_in_new</span>
<span>Смотреть сайт LMS</span>
</a>
<div class="h-5 w-px bg-surface-border"></div>
<div class="flex items-center gap-2.5 pl-1">
<div class="w-8 h-8 rounded bg-surface-container-high border border-surface-border flex items-center justify-center text-primary font-mono text-[13px]">
<span class="material-symbols-outlined text-[18px]">person</span>
</div>
<div class="flex flex-col text-left">
<span class="font-heading text-[13px] text-white font-medium leading-none">Dimong</span>
<span class="font-mono text-[10px] text-status-emerald leading-tight mt-0.5">Superuser</span>
</div>
</div>
<a class="flex items-center gap-1 px-2.5 py-1.5 text-text-faint hover:text-status-rose hover:bg-status-rose/10 rounded transition-colors" href="#" title="Выйти">
<span class="material-symbols-outlined text-[18px]">logout</span>
<span class="font-heading text-[12px] hidden md:inline">Выйти</span>
</a>
</div>
</header>
<!-- Main Content Area -->
<main class="w-full pt-16 px-8 py-6 bg-background min-h-screen">
<div class="max-w-6xl mx-auto flex flex-col gap-6">
<!-- Top Navigation & Heading Context -->
<div class="flex flex-col gap-2">
<!-- Clean Breadcrumbs without overlap -->
<nav class="flex items-center gap-2 font-mono text-[12px] text-text-faint flex-wrap">
<a class="hover:text-primary transition-colors flex items-center gap-1" href="#">
<span class="material-symbols-outlined text-[14px]">home</span>
<span>Начало</span>
</a>
<span class="text-surface-border">/</span>
<a class="hover:text-primary transition-colors" href="#">Обучение (LMS)</a>
<span class="text-surface-border">/</span>
<a class="hover:text-primary transition-colors" href="#">Ответы учеников</a>
<span class="text-surface-border">/</span>
<span class="text-on-surface truncate max-w-sm">Ответ pipin (Входной контроль)</span>
</nav>
<!-- Headline & Actions Toolbar -->
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4 pt-1">
<div class="flex items-center gap-3 min-w-0">
<div class="w-10 h-10 rounded border border-surface-border bg-surface-container flex items-center justify-center text-primary flex-shrink-0">
<span class="material-symbols-outlined text-[22px]">fact_check</span>
</div>
<div class="min-w-0">
<div class="flex items-center gap-2">
<span class="font-mono text-[11px] text-primary uppercase tracking-wider font-semibold">Ответ ученика</span>
<span class="text-surface-border">•</span>
<span class="font-mono text-[12px] text-text-faint">ID: <span class="text-white font-medium">#48291</span></span>
</div>
<h1 class="font-heading text-[22px] text-white font-bold tracking-tight truncate mt-0.5">
pipin — Входной контроль по информатике
</h1>
</div>
</div>
<div class="flex items-center gap-2 flex-shrink-0">
<a class="inline-flex items-center gap-1.5 px-3 py-2 rounded border border-surface-border bg-surface-container-low hover:bg-surface-container text-on-surface font-heading text-[13px] font-medium transition-colors" href="#">
<span class="material-symbols-outlined text-[16px] text-text-faint">history</span>
<span>История изменений</span>
</a>
</div>
</div>
</div>
<!-- Verification & Grading Form -->
<form class="flex flex-col gap-6 pb-28">
<!-- Section 1: Main Submission Metadata -->
<div class="bg-surface-container-low border border-surface-border rounded-lg p-6 flex flex-col gap-6 shadow-sm">
<div class="flex items-center justify-between pb-4 border-b border-surface-border">
<div class="flex items-center gap-2">
<span class="material-symbols-outlined text-primary text-[20px]">tune</span>
<h2 class="font-heading font-semibold text-[16px] text-white tracking-tight">Параметры проверки и оценка</h2>
</div>
<div class="flex items-center gap-2 px-2.5 py-1 rounded bg-surface-container border border-surface-border">
<span class="w-2 h-2 rounded-full bg-status-amber"></span>
<span class="font-mono text-[11px] text-on-surface tracking-wide">Требует верификации</span>
</div>
</div>
<!-- Subject / Student Select Fields -->
<div class="grid grid-cols-1 lg:grid-cols-12 gap-6">
<!-- Field: Задание -->
<div class="lg:col-span-7 flex flex-col gap-1.5">
<label class="font-heading font-medium text-[13px] text-on-surface flex items-center gap-1">
<span>Задание</span>
<span class="text-status-rose font-bold">*</span>
</label>
<div class="flex items-center gap-2">
<div class="relative flex-1">
<select class="w-full bg-surface-container-lowest border border-surface-border text-on-surface font-sans text-[13px] rounded px-3 py-2 appearance-none focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary transition-colors">
<option selected="">Входной контроль по информатике (Информатика)</option>
<option>Пробный ЕГЭ 2025 #1 (Информатика)</option>
<option>Тематический блок: Рекурсивные алгоритмы</option>
</select>
<span class="material-symbols-outlined absolute right-3 top-2.5 text-text-faint pointer-events-none text-[18px]">expand_more</span>
</div>
<div class="flex items-center border border-surface-border bg-surface-container rounded p-0.5 flex-shrink-0">
<button class="p-1 rounded text-text-faint hover:text-primary hover:bg-surface-container-high transition-colors" title="Изменить" type="button">
<span class="material-symbols-outlined text-[16px]">edit</span>
</button>
<button class="p-1 rounded text-text-faint hover:text-primary hover:bg-surface-container-high transition-colors" title="Добавить" type="button">
<span class="material-symbols-outlined text-[16px]">add</span>
</button>
<button class="p-1 rounded text-text-faint hover:text-primary hover:bg-surface-container-high transition-colors" title="Просмотр" type="button">
<span class="material-symbols-outlined text-[16px]">visibility</span>
</button>
</div>
</div>
<span class="font-mono text-[11px] text-text-faint">Курс: ЕГЭ Информатика 2025 • Дедлайн: 15 мая 2024</span>
</div>
<!-- Field: Ученик -->
<div class="lg:col-span-5 flex flex-col gap-1.5">
<label class="font-heading font-medium text-[13px] text-on-surface flex items-center gap-1">
<span>Ученик</span>
<span class="text-status-rose font-bold">*</span>
</label>
<div class="flex items-center gap-2">
<div class="relative flex-1">
<select class="w-full bg-surface-container-lowest border border-surface-border text-on-surface font-sans text-[13px] rounded px-3 py-2 appearance-none focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary transition-colors">
<option selected="">pipin (Игорь Попов)</option>
<option>alexeik (Алексей Кузнецов)</option>
<option>mariya_s (Мария Смирнова)</option>
</select>
<span class="material-symbols-outlined absolute right-3 top-2.5 text-text-faint pointer-events-none text-[18px]">expand_more</span>
</div>
<div class="flex items-center border border-surface-border bg-surface-container rounded p-0.5 flex-shrink-0">
<button class="p-1 rounded text-text-faint hover:text-primary hover:bg-surface-container-high transition-colors" title="Изменить" type="button">
<span class="material-symbols-outlined text-[16px]">edit</span>
</button>
<button class="p-1 rounded text-text-faint hover:text-primary hover:bg-surface-container-high transition-colors" title="Добавить" type="button">
<span class="material-symbols-outlined text-[16px]">add</span>
</button>
<button class="p-1 rounded text-text-faint hover:text-primary hover:bg-surface-container-high transition-colors" title="Профиль" type="button">
<span class="material-symbols-outlined text-[16px]">visibility</span>
</button>
</div>
</div>
<span class="font-mono text-[11px] text-text-faint">Группа: 11-Б Профиль • TG: @pipin_dev</span>
</div>
</div>
<!-- Score & Progress Bar Panel -->
<div class="p-4 rounded border border-surface-border bg-surface-container grid grid-cols-1 md:grid-cols-12 gap-5 items-center">
<div class="md:col-span-4 flex flex-col gap-1.5">
<span class="font-heading text-[12px] uppercase text-text-faint font-semibold tracking-wider">Итоговая оценка</span>
<div class="flex items-center gap-3">
<div class="relative w-32">
<input class="w-full bg-surface-container-lowest border border-surface-border text-white font-mono text-[18px] font-semibold rounded px-3 py-1.5 text-center focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary" type="text" value="3/27"/>
</div>
<span class="font-mono text-[12px] text-text-faint">первичных баллов</span>
</div>
</div>
<div class="md:col-span-8 flex flex-col gap-2">
<div class="flex justify-between items-center font-mono text-[12px]">
<span class="text-text-faint">Выполнение: <strong class="text-white font-semibold">11.1%</strong></span>
<span class="text-status-rose font-medium">Ниже порога (Мин: 40%)</span>
</div>
<div class="w-full h-2 bg-surface-container-lowest border border-surface-border/50 rounded-full overflow-hidden">
<div class="h-full bg-status-rose rounded-full transition-all" style="width: 11.1%"></div>
</div>
<div class="flex justify-between font-mono text-[11px] text-text-faint">
<span>0 б</span>
<span>Порог: 11 б</span>
<span>Максимум: 27 б</span>
</div>
</div>
</div>
<!-- Teacher Feedback -->
<div class="flex flex-col gap-1.5">
<div class="flex items-center justify-between">
<label class="font-heading font-medium text-[13px] text-on-surface flex items-center gap-1.5">
<span class="material-symbols-outlined text-[16px] text-primary">chat_bubble_outline</span>
<span>Комментарий проверяющего к работе</span>
</label>
<span class="font-mono text-[11px] text-text-faint">Поддерживается Markdown</span>
</div>
<textarea class="w-full bg-surface-container-lowest border border-surface-border text-on-surface font-sans text-[13px] rounded p-3 focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary placeholder:text-text-faint resize-y min-h-[90px]" rows="3">Неплохое начало, но обрати внимание на 2-ю задачу: при построении дерева путей не был учтен запрет на повторное посещение вершины B. Рекомендую повторить раздел «Анализ информационных моделей».</textarea>
</div>
</div>
<!-- Section 2: Stacked Flat Table (Impeccable: No Nested Cards) -->
<div class="bg-surface-container-low border border-surface-border rounded-lg overflow-hidden shadow-sm">
<!-- Table Header Bar -->
<div class="px-6 py-4 border-b border-surface-border flex items-center justify-between bg-surface-container">
<div class="flex items-center gap-2.5">
<span class="material-symbols-outlined text-primary text-[20px]">view_list</span>
<h2 class="font-heading font-semibold text-[15px] text-white tracking-tight">Ответы на задачи (Inline)</h2>
<span class="font-mono text-[11px] px-2 py-0.5 rounded bg-surface-container-high border border-surface-border text-text-faint">2 объекта</span>
</div>
<button class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded border border-surface-border bg-surface-container-high hover:bg-surface-container-highest text-primary font-heading text-[12px] font-medium transition-colors" type="button">
<span class="material-symbols-outlined text-[16px]">add</span>
<span>Добавить ответ на задачу</span>
</button>
</div>
<!-- Flat Task Item 1 (Accepted / Emerald) -->
<div class="p-6 border-b border-surface-border flex flex-col gap-4 hover:bg-surface-container/30 transition-colors">
<div class="flex items-center justify-between">
<div class="flex items-center gap-3">
<span class="font-mono text-[12px] font-bold px-2 py-0.5 rounded bg-status-emerald/15 text-status-emerald border border-status-emerald/30">#01</span>
<span class="font-heading font-semibold text-[14px] text-white">Задача 1: Поиск оптимального маршрута по таблице весов</span>
<a class="inline-flex items-center gap-1 font-mono text-[11px] text-primary hover:underline ml-2" href="#">
<span>Условие</span>
<span class="material-symbols-outlined text-[13px]">open_in_new</span>
</a>
</div>
<label class="flex items-center gap-1.5 cursor-pointer text-text-faint hover:text-status-rose transition-colors text-[12px] font-mono">
<input class="w-3.5 h-3.5 rounded border-surface-border bg-surface-container-lowest text-status-rose focus:ring-0" type="checkbox"/>
<span>Удалить</span>
</label>
</div>
<!-- Task 1 Fields Grid -->
<div class="grid grid-cols-1 md:grid-cols-12 gap-4">
<!-- Sub: Ответ ученика -->
<div class="md:col-span-4 flex flex-col gap-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Ответ ученика</span>
<div class="flex items-center justify-between px-3 py-2 rounded bg-surface-container-lowest border border-status-emerald/40 font-mono text-[14px] font-semibold text-status-emerald">
<span>21</span>
<span class="material-symbols-outlined text-[18px]">check_circle</span>
</div>
<span class="font-mono text-[11px] text-text-faint">Эталонный ответ: 21</span>
</div>
<!-- Sub: Статус проверки -->
<div class="md:col-span-4 flex flex-col gap-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Статус проверки</span>
<div class="relative">
<select class="w-full bg-surface-container-lowest border border-surface-border text-status-emerald font-heading text-[13px] font-semibold rounded px-3 py-2 appearance-none focus:border-primary focus:outline-none">
<option selected="" value="yes">Да (Зачтено)</option>
<option value="no">Нет (Ошибка)</option>
<option value="partial">Частично</option>
</select>
<span class="material-symbols-outlined absolute right-3 top-2.5 text-status-emerald pointer-events-none text-[18px]">check</span>
</div>
<span class="font-mono text-[11px] text-text-faint">Автопроверка совпала</span>
</div>
<!-- Sub: Баллы -->
<div class="md:col-span-4 flex flex-col gap-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Баллы за номер</span>
<div class="relative">
<input class="w-full bg-surface-container-lowest border border-surface-border text-white font-mono text-[14px] font-semibold rounded px-3 py-2 focus:border-primary focus:outline-none" max="1" min="0" type="number" value="1"/>
<span class="absolute right-3 top-2.5 text-text-faint font-mono text-[11px]">макс: 1</span>
</div>
<span class="font-mono text-[11px] text-text-faint">100% за задание</span>
</div>
<!-- Sub: Комментарий к задаче -->
<div class="md:col-span-12 flex flex-col gap-1 pt-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Пояснение проверяющего к задаче 1</span>
<input class="w-full bg-surface-container-lowest border border-surface-border text-on-surface font-sans text-[13px] rounded px-3 py-1.5 focus:border-primary focus:outline-none placeholder:text-text-faint" placeholder="Пояснение эксперта к данному номеру..." type="text" value="Верный алгоритмический расчет кратчайшего пути."/>
</div>
</div>
</div>
<!-- Flat Task Item 2 (Incorrect / Rose) -->
<div class="p-6 flex flex-col gap-4 hover:bg-surface-container/30 transition-colors">
<div class="flex items-center justify-between">
<div class="flex items-center gap-3">
<span class="font-mono text-[12px] font-bold px-2 py-0.5 rounded bg-status-rose/15 text-status-rose border border-status-rose/30">#02</span>
<span class="font-heading font-semibold text-[14px] text-white">Задача 2: Построение таблицы истинности логической функции</span>
<a class="inline-flex items-center gap-1 font-mono text-[11px] text-primary hover:underline ml-2" href="#">
<span>Условие</span>
<span class="material-symbols-outlined text-[13px]">open_in_new</span>
</a>
</div>
<label class="flex items-center gap-1.5 cursor-pointer text-text-faint hover:text-status-rose transition-colors text-[12px] font-mono">
<input class="w-3.5 h-3.5 rounded border-surface-border bg-surface-container-lowest text-status-rose focus:ring-0" type="checkbox"/>
<span>Удалить</span>
</label>
</div>
<!-- Task 2 Fields Grid -->
<div class="grid grid-cols-1 md:grid-cols-12 gap-4">
<!-- Sub: Ответ ученика -->
<div class="md:col-span-4 flex flex-col gap-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Ответ ученика</span>
<div class="flex items-center justify-between px-3 py-2 rounded bg-surface-container-lowest border border-status-rose/40 font-mono text-[14px] font-semibold text-status-rose">
<span>34 (yxzw)</span>
<span class="material-symbols-outlined text-[18px]">cancel</span>
</div>
<span class="font-mono text-[11px] text-text-faint">Эталон: <strong class="text-white">wzyx</strong></span>
</div>
<!-- Sub: Статус проверки -->
<div class="md:col-span-4 flex flex-col gap-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Статус проверки</span>
<div class="relative">
<select class="w-full bg-surface-container-lowest border border-surface-border text-status-rose font-heading text-[13px] font-semibold rounded px-3 py-2 appearance-none focus:border-primary focus:outline-none">
<option value="yes">Да (Зачтено)</option>
<option selected="" value="no">Нет (Неверно)</option>
<option value="partial">Частично</option>
</select>
<span class="material-symbols-outlined absolute right-3 top-2.5 text-status-rose pointer-events-none text-[18px]">close</span>
</div>
<span class="font-mono text-[11px] text-status-rose">Ошибочный ответ</span>
</div>
<!-- Sub: Баллы -->
<div class="md:col-span-4 flex flex-col gap-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Баллы за номер</span>
<div class="relative">
<input class="w-full bg-surface-container-lowest border border-surface-border text-status-rose font-mono text-[14px] font-semibold rounded px-3 py-2 focus:border-primary focus:outline-none" max="1" min="0" type="number" value="0"/>
<span class="absolute right-3 top-2.5 text-text-faint font-mono text-[11px]">макс: 1</span>
</div>
<span class="font-mono text-[11px] text-text-faint">0 первичных баллов</span>
</div>
<!-- Sub: Комментарий к задаче -->
<div class="md:col-span-12 flex flex-col gap-1 pt-1">
<span class="font-mono text-[10px] uppercase text-text-faint font-semibold tracking-wider">Пояснение проверяющего к задаче 2</span>
<input class="w-full bg-surface-container-lowest border border-surface-border text-on-surface font-sans text-[13px] rounded px-3 py-1.5 focus:border-primary focus:outline-none placeholder:text-text-faint" placeholder="Пояснение эксперта к данному номеру..." type="text" value="Перепутаны переменные w и z в третьей строке истинности."/>
</div>
</div>
</div>
</div>
<!-- Bottom Sticky Action Bar (Strict Cobalt & Slate) -->
<div class="fixed bottom-0 left-72 right-0 bg-surface-container-lowest/95 backdrop-blur-md border-t border-surface-border px-8 py-3.5 z-30 flex flex-wrap items-center justify-between gap-4">
<!-- Left Action -->
<div>
<button class="inline-flex items-center gap-1.5 px-3.5 py-2 rounded border border-status-rose/30 bg-status-rose/10 text-status-rose hover:bg-status-rose hover:text-white transition-colors font-heading text-[13px] font-medium" type="button">
<span class="material-symbols-outlined text-[17px]">delete</span>
<span>Удалить Ответ ученика</span>
</button>
</div>
<!-- Right Actions -->
<div class="flex items-center gap-2.5 flex-wrap">
<button class="px-4 py-2 rounded border border-surface-border bg-surface-container hover:bg-surface-container-high text-on-surface font-heading text-[13px] font-medium transition-colors" type="button">
Сохранить и добавить другой объект
</button>
<button class="px-4 py-2 rounded border border-surface-border bg-surface-container hover:bg-surface-container-high text-on-surface font-heading text-[13px] font-medium transition-colors" type="button">
Сохранить и продолжить редактирование
</button>
<button class="inline-flex items-center gap-2 px-5 py-2 rounded bg-primary-container hover:bg-primary-hover text-white font-heading text-[13px] font-semibold tracking-wide transition-colors shadow-sm" type="submit">
<span class="material-symbols-outlined text-[17px]">save</span>
<span>Сохранить</span>
</button>
</div>
</div>
</form>
</div>
</main>
</div>
</body></html>