Update frontend to dark obsidian theme
This commit is contained in:
Dmitry Belan
Binary file not shown.
+4
-3
@@ -9,7 +9,7 @@ class AnswersForm(forms.Form):
|
||||
label='Ответ:',
|
||||
required=False,
|
||||
widget=forms.Textarea(attrs={
|
||||
'class': 'w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500',
|
||||
'class': 'w-full px-4 py-3 bg-obsidian-base border border-obsidian-border rounded-lg text-white placeholder-txt-faint focus:outline-none focus:ring-2 focus:ring-accent-blue/30 focus:border-accent-blue transition-colors font-mono text-sm',
|
||||
'rows': 3,
|
||||
'placeholder': 'Введите ваш ответ здесь...'
|
||||
})
|
||||
@@ -21,7 +21,8 @@ class AnswersForm(forms.Form):
|
||||
self.fields[f'answer_{q.id}_r{i}_c{j}'] = forms.CharField(
|
||||
required=False,
|
||||
widget=forms.TextInput(attrs={
|
||||
'class': 'w-full px-2 py-1 border rounded focus:outline-none focus:ring-1 focus:ring-blue-500',
|
||||
'class': 'w-full px-3 py-2 bg-transparent border-0 focus:ring-0 text-white font-mono text-sm',
|
||||
'placeholder': '...'
|
||||
})
|
||||
)
|
||||
else:
|
||||
@@ -29,7 +30,7 @@ class AnswersForm(forms.Form):
|
||||
label='Прикрепить файл:',
|
||||
required=False,
|
||||
widget=forms.ClearableFileInput(attrs={
|
||||
'class': 'block w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-sm file:font-semibold file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100'
|
||||
'class': 'block w-full text-sm text-txt-secondary file:mr-4 file:py-2 file:px-4 file:rounded-md file:border-0 file:text-sm file:font-semibold file:bg-obsidian-border file:text-white hover:file:bg-obsidian-borderLight transition-colors cursor-pointer'
|
||||
})
|
||||
)
|
||||
|
||||
|
||||
@@ -1,126 +1,182 @@
|
||||
{% extends 'lms/base.html' %}
|
||||
{% load lms_tags %}
|
||||
|
||||
{% block title %}{{ assignment.title }} | ЕГЭ LMS{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-8">
|
||||
<a href="{% url 'lms:dashboard' %}" class="text-blue-600 hover:underline mb-4 inline-block">← Назад к списку</a>
|
||||
<h1 class="text-3xl font-bold text-gray-900">{{ assignment.title }}</h1>
|
||||
<div class="mt-2 text-sm text-gray-500 flex gap-4">
|
||||
<span>Предмет: {{ assignment.subject.name }}</span>
|
||||
<!-- Page Header -->
|
||||
<div class="mb-7">
|
||||
<a href="{% url 'lms:dashboard' %}" class="inline-flex items-center gap-1.5 text-sm font-medium text-txt-muted hover:text-white transition-colors font-heading mb-4 bg-obsidian-card border border-obsidian-border hover:border-obsidian-borderLight px-3 py-1.5 rounded-lg">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M10 19l-7-7m0 0l7-7m-7 7h18" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
Назад к списку
|
||||
</a>
|
||||
|
||||
<div class="flex flex-col md:flex-row md:items-start justify-between gap-4">
|
||||
<div>
|
||||
<h1 class="text-2xl sm:text-3xl font-bold text-white tracking-tight font-heading">{{ assignment.title }}</h1>
|
||||
<div class="mt-2 flex items-center gap-3">
|
||||
<span class="inline-flex items-center px-2 py-0.5 rounded text-[11px] font-mono uppercase tracking-wider bg-obsidian-card text-txt-secondary border border-obsidian-border">
|
||||
Предмет: {{ assignment.subject.name }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6 mb-8">
|
||||
<h3 class="text-xl font-semibold mb-4">Описание задания</h3>
|
||||
<div class="prose max-w-none text-gray-700">
|
||||
<!-- Description block -->
|
||||
<div class="bg-obsidian-card rounded-xl border border-obsidian-border p-6 sm:p-8 mb-8 shadow-sm">
|
||||
<h3 class="text-lg font-bold text-white mb-4 font-heading border-b border-obsidian-border pb-3">Описание задания</h3>
|
||||
<div class="prose prose-invert max-w-none text-txt-secondary font-body prose-a:text-accent-blue hover:prose-a:text-accent-blueHover">
|
||||
{{ assignment.description|safe }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6">
|
||||
<h3 class="text-xl font-semibold mb-4">Ваш ответ</h3>
|
||||
<div class="bg-obsidian-card rounded-xl border border-obsidian-border p-6 sm:p-8 shadow-sm">
|
||||
<h3 class="text-lg font-bold text-white mb-6 font-heading border-b border-obsidian-border pb-3">Ваш ответ</h3>
|
||||
|
||||
{% if submission and submission.status != 'IN_PROGRESS' %}
|
||||
<div class="mb-6 p-4 rounded-lg border {% if submission.status == 'GRADED' %}bg-green-50 text-green-800 border-green-200{% else %}bg-yellow-50 text-yellow-800 border-yellow-200{% endif %}">
|
||||
<div class="mb-8 p-5 rounded-lg border {% if submission.status == 'GRADED' %}bg-emerald-950/20 text-emerald-300 border-emerald-800/40{% else %}bg-amber-950/20 text-amber-300 border-amber-800/40{% endif %}">
|
||||
{% if submission.status == 'GRADED' %}
|
||||
<h4 class="font-bold mb-2">Оценка: {{ submission.grade|default:"Не выставлена" }}</h4>
|
||||
<h4 class="font-bold mb-2 flex items-center gap-2 font-heading">
|
||||
<svg class="w-5 h-5 text-emerald-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M5 13l4 4L19 7" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
Оценка: {{ submission.grade|default:"Не выставлена" }}
|
||||
</h4>
|
||||
{% else %}
|
||||
<p>Ваша работа отправлена и ожидает проверки.</p>
|
||||
<h4 class="font-bold mb-2 flex items-center gap-2 font-heading">
|
||||
<span class="w-2 h-2 rounded-full bg-amber-400 animate-pulse"></span>
|
||||
Ваша работа отправлена и ожидает проверки.
|
||||
</h4>
|
||||
{% endif %}
|
||||
|
||||
{% if submission.teacher_feedback %}
|
||||
<p class="mt-2"><strong>Общий комментарий:</strong> {{ submission.teacher_feedback }}</p>
|
||||
<div class="mt-4 p-4 rounded bg-obsidian-base border border-obsidian-borderLight">
|
||||
<p class="font-medium text-white text-sm mb-1">Общий комментарий преподавателя:</p>
|
||||
<p class="text-sm text-txt-secondary">{{ submission.teacher_feedback }}</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<h4 class="font-bold mb-4 text-gray-800">Ваши ответы на задачи:</h4>
|
||||
<div class="space-y-4">
|
||||
<h4 class="font-bold mb-5 text-white font-heading">Ваши ответы на задачи:</h4>
|
||||
<div class="space-y-6">
|
||||
{% for answer in submission.answers.all %}
|
||||
<div class="p-4 bg-gray-50 border rounded-lg">
|
||||
<h5 class="font-medium text-sm text-gray-500 mb-2">Задача {{ forloop.counter }}: {{ answer.question.text|striptags|truncatewords:10 }}</h5>
|
||||
{% if answer.question.question_type == 'TEXT_AUTO' %}
|
||||
<p class="text-gray-800"><strong>Ваш ответ:</strong> {{ answer.text_answer|default:"Нет" }}</p>
|
||||
<p class="text-sm mt-1 {% if answer.is_correct %}text-green-600{% elif answer.is_correct == False %}text-red-600{% else %}text-gray-500{% endif %}">
|
||||
{% if answer.is_correct %}
|
||||
<span class="material-icons text-[14px] align-middle">check_circle</span> Верно
|
||||
{% elif answer.is_correct == False %}
|
||||
<span class="material-icons text-[14px] align-middle">cancel</span> Неверно
|
||||
{% else %}
|
||||
<span class="material-icons text-[14px] align-middle">help_outline</span> Ожидает проверки
|
||||
{% endif %}
|
||||
</p>
|
||||
{% elif answer.question.question_type == 'TABLE_AUTO' %}
|
||||
<p class="text-gray-800 mb-2"><strong>Ваш ответ:</strong></p>
|
||||
{% load lms_tags %}
|
||||
{% with table_data=answer.text_answer|parse_json %}
|
||||
{% if table_data %}
|
||||
<table class="w-full border-collapse border border-gray-300 mb-4 text-sm bg-white">
|
||||
{% for row in table_data %}
|
||||
<tr>
|
||||
<td class="border border-gray-300 p-2">{{ row.0 }}</td>
|
||||
<td class="border border-gray-300 p-2">{{ row.1 }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
{% else %}
|
||||
<p class="text-gray-800">Нет ответа</p>
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
<p class="text-sm mt-1 {% if answer.is_correct %}text-green-600{% elif answer.is_correct == False %}text-red-600{% else %}text-gray-500{% endif %}">
|
||||
{% if answer.is_correct %}
|
||||
<span class="material-icons text-[14px] align-middle">check_circle</span> Верно
|
||||
{% elif answer.is_correct == False %}
|
||||
<span class="material-icons text-[14px] align-middle">cancel</span> Неверно
|
||||
{% else %}
|
||||
<span class="material-icons text-[14px] align-middle">help_outline</span> Ожидает проверки
|
||||
{% endif %}
|
||||
</p>
|
||||
{% else %}
|
||||
{% if answer.file_answer %}
|
||||
<p class="text-gray-800"><strong>Прикрепленный файл:</strong> <a href="{{ answer.file_answer.url }}" class="text-blue-600 hover:underline">Скачать</a></p>
|
||||
{% else %}
|
||||
<p class="text-gray-500">Файл не прикреплен</p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<div class="p-5 bg-obsidian-base border border-obsidian-border rounded-lg relative overflow-hidden">
|
||||
<!-- Status indicator line -->
|
||||
<div class="absolute left-0 top-0 bottom-0 w-1 {% if answer.is_correct %}bg-emerald-500{% elif answer.is_correct == False %}bg-rose-500{% else %}bg-txt-faint{% endif %}"></div>
|
||||
|
||||
{% if answer.points is not None %}
|
||||
<p class="mt-2 text-sm text-blue-800 font-medium">Баллы: {{ answer.points }}</p>
|
||||
{% endif %}
|
||||
{% if answer.comment %}
|
||||
<p class="mt-1 text-sm text-gray-700 bg-white p-2 rounded border"><strong>Комментарий:</strong> {{ answer.comment }}</p>
|
||||
{% endif %}
|
||||
<h5 class="font-medium text-sm text-txt-muted mb-3 pl-2">Задача {{ forloop.counter }}: {{ answer.question.text|striptags|truncatewords:10 }}</h5>
|
||||
|
||||
<div class="pl-2">
|
||||
{% if answer.question.question_type == 'TEXT_AUTO' %}
|
||||
<div class="bg-obsidian-card p-3 rounded border border-obsidian-borderLight mb-3">
|
||||
<span class="text-xs text-txt-faint uppercase font-mono block mb-1">Ваш ответ</span>
|
||||
<p class="text-white font-medium">{{ answer.text_answer|default:"Нет" }}</p>
|
||||
</div>
|
||||
{% elif answer.question.question_type == 'TABLE_AUTO' %}
|
||||
<span class="text-xs text-txt-faint uppercase font-mono block mb-2">Ваш ответ (Таблица)</span>
|
||||
{% with table_data=answer.text_answer|parse_json %}
|
||||
{% if table_data %}
|
||||
<div class="overflow-x-auto mb-3">
|
||||
<table class="w-full border-collapse border border-obsidian-borderLight text-sm text-left">
|
||||
{% for row in table_data %}
|
||||
<tr>
|
||||
<td class="border border-obsidian-borderLight p-2.5 text-txt-secondary bg-obsidian-card">{{ row.0 }}</td>
|
||||
<td class="border border-obsidian-borderLight p-2.5 text-white bg-obsidian-base">{{ row.1 }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
{% else %}
|
||||
<p class="text-txt-muted mb-3">Нет ответа</p>
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
{% else %}
|
||||
{% if answer.file_answer %}
|
||||
<p class="text-txt-secondary mb-3 text-sm">
|
||||
<strong class="text-white">Прикрепленный файл:</strong>
|
||||
<a href="{{ answer.file_answer.url }}" class="inline-flex items-center gap-1 text-accent-blue hover:text-accent-blueHover">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
|
||||
Скачать
|
||||
</a>
|
||||
</p>
|
||||
{% else %}
|
||||
<p class="text-txt-muted mb-3 text-sm">Файл не прикреплен</p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<div class="flex flex-wrap items-center gap-4 text-sm mt-3 pt-3 border-t border-obsidian-borderLight">
|
||||
<div class="flex items-center gap-1.5 {% if answer.is_correct %}text-emerald-400{% elif answer.is_correct == False %}text-rose-400{% else %}text-txt-muted{% endif %} font-medium">
|
||||
{% if answer.is_correct %}
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
|
||||
Верно
|
||||
{% elif answer.is_correct == False %}
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
|
||||
Неверно
|
||||
{% else %}
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
|
||||
Ожидает проверки
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if answer.points is not None %}
|
||||
<div class="px-2 py-0.5 rounded bg-obsidian-card border border-obsidian-borderLight font-mono text-accent-blue text-xs">
|
||||
Баллы: {{ answer.points }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if answer.comment %}
|
||||
<div class="mt-3 p-3 text-sm bg-obsidian-card border border-obsidian-borderLight rounded-r-lg border-l-2 border-l-accent-blue">
|
||||
<span class="text-txt-faint text-xs font-mono uppercase block mb-1">Комментарий преподавателя</span>
|
||||
<span class="text-txt-secondary">{{ answer.comment }}</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% elif needs_start %}
|
||||
<div class="mb-6 p-8 text-center rounded-2xl border bg-indigo-50 border-indigo-200">
|
||||
<span class="material-icons text-indigo-500 text-6xl mb-4">hourglass_top</span>
|
||||
<h4 class="text-2xl font-bold mb-2 text-indigo-900">Задание на время</h4>
|
||||
<p class="text-indigo-800 text-lg mb-6">На выполнение этого задания отводится <strong>{{ assignment.time_limit }} минут(ы)</strong>. Как только вы нажмете кнопку ниже, запустится обратный отсчет. По истечении времени ваши ответы будут отправлены автоматически.</p>
|
||||
|
||||
<form method="post">
|
||||
{% elif needs_start %}
|
||||
<div class="p-8 text-center rounded-2xl border bg-obsidian-base border-accent-blue/30 shadow-lg relative overflow-hidden">
|
||||
<div class="absolute inset-0 bg-accent-blue/5 pointer-events-none"></div>
|
||||
|
||||
<svg class="w-16 h-16 mx-auto text-accent-blue mb-5 relative z-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||
</svg>
|
||||
|
||||
<h4 class="text-2xl font-bold mb-3 text-white font-heading relative z-10">Задание на время</h4>
|
||||
<p class="text-txt-secondary text-base mb-8 max-w-xl mx-auto relative z-10">На выполнение этого задания отводится <strong class="text-white font-mono bg-obsidian-card px-2 py-0.5 rounded border border-obsidian-border">{{ assignment.time_limit }} мин.</strong> Как только вы нажмете кнопку ниже, запустится обратный отсчет. По истечении времени ваши ответы будут отправлены автоматически.</p>
|
||||
|
||||
<form method="post" class="relative z-10">
|
||||
{% csrf_token %}
|
||||
<input type="hidden" name="action" value="start">
|
||||
<button type="submit" class="px-8 py-4 bg-indigo-600 text-white text-lg font-bold rounded-xl shadow hover:bg-indigo-700 transition">
|
||||
<button type="submit" class="inline-flex items-center gap-2 px-8 py-3.5 bg-accent-blue text-white font-bold rounded-lg shadow-lg shadow-accent-blue/20 hover:bg-accent-blueHover hover:shadow-accent-blue/40 transition-all active:scale-95 font-heading text-lg">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path><path d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
||||
Начать выполнение
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% elif not can_submit %}
|
||||
<div class="mb-6 p-4 rounded-lg border bg-red-50 text-red-800 border-red-200">
|
||||
<h4 class="font-bold mb-2">Прием ответов завершен</h4>
|
||||
<p>Вы больше не можете отправлять ответы, так как дедлайн истек или время на выполнение закончилось.</p>
|
||||
<div class="p-5 rounded-lg border bg-rose-950/20 text-rose-300 border-rose-800/40">
|
||||
<h4 class="font-bold mb-2 flex items-center gap-2 font-heading">
|
||||
<svg class="w-5 h-5 text-rose-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg>
|
||||
Прием ответов завершен
|
||||
</h4>
|
||||
<p class="text-sm">Вы больше не можете отправлять ответы, так как дедлайн истек или время на выполнение закончилось.</p>
|
||||
</div>
|
||||
|
||||
{% else %}
|
||||
{% if time_left_seconds is not None %}
|
||||
<div id="timer-banner" class="sticky top-4 z-50 mb-6 p-4 rounded-xl border bg-indigo-600 text-white shadow-lg flex justify-between items-center">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="material-icons animate-pulse">timer</span>
|
||||
<span class="font-medium text-lg">Осталось времени:</span>
|
||||
<div id="timer-banner" class="sticky top-16 sm:top-20 z-40 mb-8 p-4 rounded-xl border bg-obsidian-base border-accent-blue shadow-lg shadow-accent-blue/10 flex justify-between items-center transition-colors duration-300">
|
||||
<div class="flex items-center gap-2.5">
|
||||
<svg class="w-6 h-6 text-accent-blue animate-pulse" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
||||
<span class="font-medium text-sm sm:text-base text-white">Осталось времени:</span>
|
||||
</div>
|
||||
<div class="text-2xl font-mono font-bold tracking-wider" id="countdown-display">
|
||||
<div class="text-2xl sm:text-3xl font-mono font-bold tracking-wider text-white bg-obsidian-card px-3 py-1 rounded-lg border border-obsidian-border" id="countdown-display">
|
||||
--:--:--
|
||||
</div>
|
||||
</div>
|
||||
@@ -128,20 +184,23 @@
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
let timeLeft = {{ time_left_seconds }};
|
||||
const display = document.getElementById('countdown-display');
|
||||
const banner = document.getElementById('timer-banner');
|
||||
const form = document.getElementById('assignment-form');
|
||||
|
||||
function updateTimer() {
|
||||
if (timeLeft <= 0) {
|
||||
display.textContent = '00:00:00';
|
||||
display.classList.add('text-red-300');
|
||||
display.classList.add('text-rose-400', 'border-rose-500/50', 'bg-rose-950/30');
|
||||
display.classList.remove('text-white', 'bg-obsidian-card', 'border-obsidian-border');
|
||||
banner.classList.add('border-rose-500', 'shadow-rose-500/20');
|
||||
banner.classList.remove('border-accent-blue', 'shadow-accent-blue/10');
|
||||
|
||||
// Auto submit
|
||||
if (form) {
|
||||
// Prevent multiple submissions
|
||||
form.onsubmit = null;
|
||||
const btn = form.querySelector('button[type="submit"]');
|
||||
if (btn) btn.disabled = true;
|
||||
|
||||
// Append a hidden flag
|
||||
const input = document.createElement('input');
|
||||
input.type = 'hidden';
|
||||
input.name = 'auto_submit';
|
||||
@@ -161,8 +220,10 @@
|
||||
(m < 10 ? '0' + m : m) + ':' +
|
||||
(s < 10 ? '0' + s : s);
|
||||
|
||||
if (timeLeft < 60) {
|
||||
display.classList.add('text-red-300', 'animate-pulse');
|
||||
if (timeLeft < 60 && !banner.classList.contains('border-rose-500')) {
|
||||
display.classList.add('text-rose-400');
|
||||
banner.classList.add('border-rose-500', 'bg-rose-950/10');
|
||||
banner.classList.remove('border-accent-blue', 'bg-obsidian-base');
|
||||
}
|
||||
|
||||
timeLeft--;
|
||||
@@ -180,44 +241,61 @@
|
||||
{% csrf_token %}
|
||||
|
||||
{% for q, field_type, field in question_fields %}
|
||||
<div class="p-5 border rounded-xl bg-gray-50 border-gray-200">
|
||||
<h4 class="font-semibold text-lg mb-2 text-gray-800">Задача {{ forloop.counter }}</h4>
|
||||
<div class="prose max-w-none text-gray-700 mb-4">
|
||||
<div class="p-5 sm:p-6 border rounded-xl bg-obsidian-base border-obsidian-border transition-colors focus-within:border-obsidian-borderLight">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<span class="flex items-center justify-center w-8 h-8 rounded-full bg-obsidian-card border border-obsidian-borderLight text-txt-secondary font-mono text-sm font-bold">
|
||||
{{ forloop.counter }}
|
||||
</span>
|
||||
<h4 class="font-semibold text-lg text-white font-heading">Задача</h4>
|
||||
</div>
|
||||
|
||||
<div class="prose prose-invert max-w-none text-txt-secondary mb-6 font-body">
|
||||
{{ q.text|safe }}
|
||||
</div>
|
||||
|
||||
{% if q.attached_file %}
|
||||
<div class="mb-4">
|
||||
<a href="{{ q.attached_file.url }}" class="inline-flex items-center px-3 py-1.5 bg-white border text-gray-700 rounded hover:bg-gray-50 transition text-sm" target="_blank">
|
||||
<span class="material-icons mr-1 text-[16px]">attach_file</span> Скачать файл к задаче
|
||||
<div class="mb-6">
|
||||
<a href="{{ q.attached_file.url }}" class="inline-flex items-center gap-2 px-4 py-2 bg-obsidian-card border border-obsidian-borderLight text-txt-secondary rounded-lg hover:bg-obsidian-border hover:text-white transition-colors text-sm font-medium" target="_blank">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
|
||||
Скачать файл к задаче
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<div class="bg-obsidian-card p-5 rounded-lg border border-obsidian-borderLight">
|
||||
{% if field_type == 'table' %}
|
||||
<p class="block text-sm font-medium text-gray-700 mb-2">Заполните таблицу:</p>
|
||||
<table class="w-full border-collapse border border-gray-300 mb-4">
|
||||
{% for row_fields in field %}
|
||||
<tr>
|
||||
<td class="border border-gray-300 p-2">{{ row_fields.0 }}</td>
|
||||
<td class="border border-gray-300 p-2">{{ row_fields.1 }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
<p class="block text-sm font-medium text-txt-secondary mb-3">Заполните таблицу:</p>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="w-full border-collapse border border-obsidian-borderLight mb-1 text-sm bg-obsidian-base rounded-lg overflow-hidden">
|
||||
{% for row_fields in field %}
|
||||
<tr>
|
||||
<td class="border border-obsidian-borderLight p-2 w-1/2">
|
||||
<div class="relative">{{ row_fields.0 }}</div>
|
||||
</td>
|
||||
<td class="border border-obsidian-borderLight p-2 w-1/2">
|
||||
<div class="relative">{{ row_fields.1 }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
{% else %}
|
||||
<label for="{{ field.id_for_label }}" class="block text-sm font-medium text-gray-700 mb-2">{{ field.label }}</label>
|
||||
<label for="{{ field.id_for_label }}" class="block text-sm font-medium text-txt-secondary mb-2">{{ field.label }}</label>
|
||||
{{ field }}
|
||||
{% if field.errors %}
|
||||
<p class="mt-1 text-sm text-red-600">{{ field.errors.0 }}</p>
|
||||
<p class="mt-2 text-sm text-rose-400 flex items-center gap-1">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg>
|
||||
{{ field.errors.0 }}
|
||||
</p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<div class="pt-4">
|
||||
<button type="submit" class="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition font-medium">
|
||||
<div class="pt-6 border-t border-obsidian-border flex justify-end">
|
||||
<button type="submit" class="inline-flex items-center gap-2 px-8 py-3 bg-accent-blue text-white font-bold rounded-lg shadow-md hover:bg-accent-blueHover hover:shadow-accent-blue/20 transition-all active:scale-95 font-heading">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path d="M5 13l4 4L19 7" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
|
||||
Отправить ответ
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1,14 +1,70 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<html class="dark h-full" lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="utf-8"/>
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
||||
<title>{% block title %}ЕГЭ LMS{% endblock %}</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<!-- Google Fonts: Space Grotesk, Plus Jakarta Sans, JetBrains Mono -->
|
||||
<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;700&family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap" rel="stylesheet"/>
|
||||
<!-- Tailwind CSS v3 with forms and container-queries -->
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
darkMode: 'class',
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
obsidian: {
|
||||
base: '#11131b',
|
||||
deep: '#0c0e16',
|
||||
card: '#191b23',
|
||||
border: '#2e313c',
|
||||
borderLight: '#3b3f4d',
|
||||
},
|
||||
accent: {
|
||||
blue: '#2563eb',
|
||||
blueHover: '#1d4ed8',
|
||||
blueSubtle: 'rgba(37, 99, 235, 0.12)',
|
||||
blueBorder: '#3b82f6',
|
||||
},
|
||||
status: {
|
||||
emerald: '#10b981',
|
||||
emeraldBg: 'rgba(16, 185, 129, 0.12)',
|
||||
amber: '#f59e0b',
|
||||
amberBg: 'rgba(245, 158, 11, 0.12)',
|
||||
rose: '#ef4444',
|
||||
roseBg: 'rgba(239, 68, 68, 0.12)',
|
||||
},
|
||||
txt: {
|
||||
primary: '#f1f5f9',
|
||||
secondary: '#cbd5e1',
|
||||
muted: '#94a3b8',
|
||||
faint: '#64748b'
|
||||
}
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['"Space Grotesk"', 'sans-serif'],
|
||||
body: ['"Plus Jakarta Sans"', 'sans-serif'],
|
||||
mono: ['"JetBrains Mono"', 'monospace'],
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
body { font-family: 'Inter', sans-serif; background-color: #f8fafc; }
|
||||
|
||||
body {
|
||||
background-color: #11131b;
|
||||
color: #f1f5f9;
|
||||
font-family: "Plus Jakarta Sans", sans-serif;
|
||||
}
|
||||
h1, h2, h3, nav button, .font-heading {
|
||||
font-family: "Space Grotesk", sans-serif;
|
||||
}
|
||||
.font-technical {
|
||||
font-family: "JetBrains Mono", monospace;
|
||||
}
|
||||
/* Исправление для картинок из CKEditor: растягиваем по ширине и сохраняем пропорции */
|
||||
.prose img {
|
||||
width: 100% !important;
|
||||
@@ -17,41 +73,91 @@
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="text-gray-800 antialiased h-screen flex flex-col">
|
||||
<body class="min-h-full flex flex-col antialiased selection:bg-accent-blue selection:text-white bg-obsidian-base text-txt-primary">
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="bg-white border-b border-gray-200 shadow-sm">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between h-16">
|
||||
<div class="flex items-center">
|
||||
<a href="/" class="flex-shrink-0 flex items-center gap-2">
|
||||
<span class="material-icons text-blue-600">school</span>
|
||||
<span class="font-bold text-xl tracking-tight text-gray-900">ЕГЭ LMS</span>
|
||||
<!-- BEGIN: MainHeader -->
|
||||
<header class="sticky top-0 z-50 w-full border-b border-obsidian-border bg-obsidian-deep/95 backdrop-blur-md" data-purpose="site-navigation-header">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 flex items-center justify-between">
|
||||
<!-- Brand Identity Logo & Name -->
|
||||
<div class="flex items-center space-x-3">
|
||||
<a href="/" class="flex items-center space-x-3 group">
|
||||
<div class="w-8 h-8 rounded bg-accent-blue flex items-center justify-center text-white group-hover:bg-accent-blueHover transition-colors">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M12 14l9-5-9-5-9 5 9 5z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
<path d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="text-lg font-bold tracking-tight text-white flex items-center gap-1.5 font-heading">
|
||||
ЕГЭ <span class="text-accent-blue font-bold tracking-tight">LMS</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- User Navigation & Controls -->
|
||||
<div class="flex items-center space-x-3 sm:space-x-6">
|
||||
{% if user.is_authenticated %}
|
||||
{% if user.is_staff %}
|
||||
<!-- Admin Panel Link -->
|
||||
<a class="text-xs sm:text-sm font-medium text-txt-muted hover:text-white transition-colors duration-150 flex items-center gap-1.5 py-1 px-2 rounded hover:bg-obsidian-card font-heading" href="{% url 'admin:index' %}">
|
||||
<svg class="w-4 h-4 text-txt-muted" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
<path d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
<span class="hidden sm:inline">Админ-панель</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
{% if user.is_authenticated %}
|
||||
{% if user.is_staff %}
|
||||
<a href="{% url 'admin:index' %}" class="text-sm font-medium text-purple-600 hover:text-purple-800 transition">Админ-панель</a>
|
||||
{% endif %}
|
||||
<span class="text-sm text-gray-600">Привет, <b>{{ user.first_name|default:user.username }}</b></span>
|
||||
<form action="{% url 'lms:logout' %}" method="post" class="inline">
|
||||
{% csrf_token %}
|
||||
<button type="submit" class="text-sm font-medium text-red-600 hover:text-red-800 transition">Выйти</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a href="{% url 'lms:login' %}" class="text-sm font-medium text-blue-600 hover:text-blue-800 transition">Войти</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<!-- User Profile Pill -->
|
||||
<div class="flex items-center space-x-2 pl-3 border-l border-obsidian-border" data-purpose="user-greeting">
|
||||
<div class="w-6 h-6 rounded bg-obsidian-border text-txt-secondary flex items-center justify-center font-bold text-xs font-mono uppercase">
|
||||
{{ user.first_name.0|default:user.username.0 }}
|
||||
</div>
|
||||
<span class="text-xs sm:text-sm text-txt-muted">
|
||||
Привет, <strong class="text-txt-primary font-semibold font-heading">{{ user.first_name|default:user.username }}</strong>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Logout Action Button -->
|
||||
<form action="{% url 'lms:logout' %}" method="post" class="inline m-0 p-0 flex">
|
||||
{% csrf_token %}
|
||||
<button type="submit" class="text-xs sm:text-sm font-medium text-rose-400 hover:text-rose-300 transition-colors duration-150 flex items-center gap-1 py-1 px-2 rounded hover:bg-rose-950/20 font-heading">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
<span class="hidden sm:inline">Выйти</span>
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a href="{% url 'lms:login' %}" class="text-xs sm:text-sm font-medium text-accent-blue hover:text-accent-blueHover transition-colors duration-150 flex items-center gap-1.5 py-1 px-3 rounded bg-accent-blue/10 hover:bg-accent-blue/20 font-heading">
|
||||
Войти
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Main Content -->
|
||||
<main class="flex-1 max-w-7xl w-full mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||||
<!-- BEGIN: MainContent -->
|
||||
<main class="flex-1 max-w-7xl w-full mx-auto px-4 sm:px-6 lg:px-8 py-8 sm:py-10">
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</main>
|
||||
<!-- END: MainContent -->
|
||||
|
||||
<!-- BEGIN: MinimalFooter -->
|
||||
<footer class="mt-auto border-t border-obsidian-border py-5 text-xs text-txt-muted bg-obsidian-deep/50" data-purpose="site-footer">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex flex-col sm:flex-row items-center justify-between gap-3">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="font-mono text-txt-muted text-[11px]">© 2026 ЕГЭ LMS. Все права защищены.</span>
|
||||
</div>
|
||||
<div class="flex items-center space-x-6">
|
||||
<span class="inline-flex items-center gap-1.5 text-[11px] font-mono text-txt-secondary">
|
||||
<span class="w-1.5 h-1.5 rounded-full bg-status-emerald"></span>
|
||||
Системы работают штатно
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!-- END: MinimalFooter -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,80 +4,123 @@
|
||||
{% block title %}Мои задания | ЕГЭ LMS{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="mb-8 flex justify-between items-end border-b pb-4">
|
||||
<div>
|
||||
<h1 class="text-3xl font-bold text-gray-900">Мои задания</h1>
|
||||
<p class="text-gray-500 mt-1">Список всех доступных заданий для выполнения.</p>
|
||||
</div>
|
||||
<div class="mb-7" data-purpose="page-title-block">
|
||||
<h1 class="text-2xl sm:text-3xl font-bold text-white tracking-tight font-heading">Мои задания</h1>
|
||||
<p class="mt-1.5 text-sm text-txt-secondary max-w-2xl font-body">Список всех доступных заданий для выполнения.</p>
|
||||
</div>
|
||||
|
||||
{% if assignments %}
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5" data-purpose="task-cards-grid">
|
||||
{% for assignment in assignments %}
|
||||
{% get_submission submissions assignment.id as sub %}
|
||||
<div class="bg-white rounded-2xl shadow-sm hover:shadow-md border border-gray-100 transition-all duration-200 overflow-hidden flex flex-col">
|
||||
<div class="p-6 flex-1">
|
||||
<div class="flex justify-between items-start mb-4">
|
||||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
||||
{{ assignment.subject.name }}
|
||||
<article class="bg-obsidian-card rounded border border-obsidian-border hover:border-obsidian-borderLight p-6 flex flex-col justify-between transition-colors duration-150 relative" data-purpose="task-card">
|
||||
<div>
|
||||
<!-- Header Badges -->
|
||||
<div class="flex items-center justify-between gap-2 mb-4">
|
||||
<span class="inline-flex items-center px-2 py-0.5 rounded text-[11px] font-mono uppercase tracking-wider bg-obsidian-base text-txt-secondary border border-obsidian-border">
|
||||
{{ assignment.subject.name|default:"Предмет" }}
|
||||
</span>
|
||||
|
||||
{% if sub %}
|
||||
{% if sub.status == 'GRADED' %}
|
||||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">
|
||||
<span class="material-icons text-[12px] mr-1">done_all</span> Проверено ({{ sub.grade|default:"-" }})
|
||||
<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded text-xs font-mono font-medium bg-emerald-950/40 text-emerald-300 border border-emerald-800/50">
|
||||
<svg class="w-3 h-3 text-emerald-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M5 13l4 4L19 7" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
Принято ({{ sub.grade|default:"-" }})
|
||||
</span>
|
||||
{% elif sub.status == 'IN_PROGRESS' %}
|
||||
<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded text-xs font-mono font-medium bg-accent-blue/20 text-accent-blue border border-accent-blue/30">
|
||||
<span class="w-1.5 h-1.5 rounded-full bg-accent-blue"></span>
|
||||
В процессе
|
||||
</span>
|
||||
{% else %}
|
||||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800">
|
||||
<span class="material-icons text-[12px] mr-1">schedule</span> Ожидает проверки
|
||||
<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded text-xs font-mono font-medium bg-amber-950/40 text-amber-300 border border-amber-800/50">
|
||||
<span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span>
|
||||
Ожидает проверки
|
||||
</span>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
|
||||
Не сдано
|
||||
<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded text-xs font-mono font-medium bg-rose-950/40 text-rose-400 border border-rose-800/50">
|
||||
<span class="w-1.5 h-1.5 rounded-full bg-rose-400"></span>
|
||||
Требует сдачи
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-2 line-clamp-2">
|
||||
<!-- Assignment Title -->
|
||||
<h2 class="text-lg font-bold text-white tracking-tight leading-snug mb-3 font-heading">
|
||||
{{ assignment.title }}
|
||||
</h3>
|
||||
<p class="text-gray-500 text-sm line-clamp-3 mb-4">
|
||||
{{ assignment.description|striptags|truncatewords:20 }}
|
||||
</p>
|
||||
</h2>
|
||||
|
||||
<div class="text-xs text-gray-400 mt-auto flex flex-col gap-1">
|
||||
<span class="flex items-center gap-1">
|
||||
<span class="material-icons text-[14px]">event</span>
|
||||
Добавлено: {{ assignment.created_at|date:"d M Y" }}
|
||||
</span>
|
||||
{% if assignment.description %}
|
||||
<div class="mb-5 line-clamp-3 text-sm text-txt-secondary font-body">
|
||||
{{ assignment.description|striptags }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- Task Metadata -->
|
||||
<div class="space-y-2.5 text-xs text-txt-muted pt-3 border-t border-obsidian-border mb-6">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="flex items-center gap-1.5 text-txt-muted">
|
||||
<svg class="w-3.5 h-3.5 text-txt-faint" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
Добавлено:
|
||||
</span>
|
||||
<span class="font-mono text-txt-secondary">{{ assignment.created_at|date:"d M Y" }}</span>
|
||||
</div>
|
||||
{% if assignment.deadline %}
|
||||
<span class="flex items-center gap-1 {% if assignment.deadline < now %}text-red-500{% else %}text-gray-500{% endif %}">
|
||||
<span class="material-icons text-[14px]">timer</span>
|
||||
Дедлайн: {{ assignment.deadline|date:"d M Y, H:i" }}
|
||||
</span>
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="flex items-center gap-1.5 text-txt-muted">
|
||||
<svg class="w-3.5 h-3.5 {% if assignment.deadline < now %}text-rose-400{% else %}text-amber-400{% endif %}" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
Дедлайн:
|
||||
</span>
|
||||
<span class="font-mono font-medium {% if assignment.deadline < now %}text-rose-400{% else %}text-amber-300{% endif %}">{{ assignment.deadline|date:"d M Y, H:i" }}</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if assignment.time_limit %}
|
||||
<span class="flex items-center gap-1 text-indigo-600 font-medium mt-1">
|
||||
<span class="material-icons text-[14px]">hourglass_empty</span>
|
||||
Время на решение: {{ assignment.time_limit }} мин.
|
||||
</span>
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="flex items-center gap-1.5 text-txt-muted">
|
||||
<svg class="w-3.5 h-3.5 text-txt-faint" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
Лимит времени:
|
||||
</span>
|
||||
<span class="font-mono text-txt-secondary">{{ assignment.time_limit }} мин.</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 p-4 border-t border-gray-100">
|
||||
<a href="{% url 'lms:assignment_detail' assignment.pk %}" class="w-full inline-flex justify-center items-center px-4 py-2 border border-transparent text-sm font-medium rounded-lg text-white bg-blue-600 hover:bg-blue-700 shadow-sm transition-colors">
|
||||
{% if sub %}Смотреть ответ{% else %}Выполнить задание{% endif %}
|
||||
|
||||
<!-- Action Button -->
|
||||
{% if sub %}
|
||||
{% if sub.status == 'IN_PROGRESS' %}
|
||||
<a class="w-full inline-flex items-center justify-center text-center font-heading font-medium text-xs sm:text-sm bg-accent-blue hover:bg-accent-blueHover active:bg-blue-800 text-white py-2.5 px-4 rounded transition-colors duration-150 shadow-sm" href="{% url 'lms:assignment_detail' assignment.pk %}">
|
||||
Продолжить решение
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a class="w-full inline-flex items-center justify-center text-center font-heading font-medium text-xs sm:text-sm bg-obsidian-border hover:bg-obsidian-borderLight active:bg-obsidian-border text-txt-primary py-2.5 px-4 rounded transition-colors duration-150" href="{% url 'lms:assignment_detail' assignment.pk %}">
|
||||
Смотреть ответ
|
||||
</a>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<a class="w-full inline-flex items-center justify-center text-center font-heading font-medium text-xs sm:text-sm bg-accent-blue hover:bg-accent-blueHover active:bg-blue-800 text-white py-2.5 px-4 rounded transition-colors duration-150 shadow-sm" href="{% url 'lms:assignment_detail' assignment.pk %}">
|
||||
Приступить к решению
|
||||
</a>
|
||||
{% endif %}
|
||||
</article>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="text-center py-20">
|
||||
<span class="material-icons text-gray-300 text-6xl mb-4">assignment_turned_in</span>
|
||||
<h3 class="text-xl font-medium text-gray-900 mb-1">Пока заданий нет</h3>
|
||||
<p class="text-gray-500">Учитель еще не добавил новые задания.</p>
|
||||
<div class="text-center py-20 bg-obsidian-card rounded border border-obsidian-border max-w-2xl mx-auto">
|
||||
<svg class="w-16 h-16 mx-auto text-txt-faint mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
|
||||
</svg>
|
||||
<h3 class="text-xl font-medium text-white mb-1 font-heading">Пока заданий нет</h3>
|
||||
<p class="text-txt-secondary font-body text-sm">Учитель еще не добавил новые задания.</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
|
||||
Binary file not shown.
Reference in New Issue
Block a user