93 lines
5.5 KiB
HTML
93 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Неотложка · Экзамен для студентов-медиков</title>
|
||
<meta name="description" content="Интерактивный экзамен: клинические кейсы по неотложной помощи с говорящими пациентами. Назначьте обследования, лечение, поставьте диагноз и окажите экстренную помощь на время.">
|
||
<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;700;800&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="style.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- HERO -->
|
||
<section class="hero">
|
||
<div class="container">
|
||
<span class="pill">🩺 Экзамен · 6 курс · по протоколам МЗ РК</span>
|
||
<h1>Говорящие пациенты.<br>Экзамен по неотложке.</h1>
|
||
<p class="lead">Шесть клинических кейсов по алгоритмам клинических протоколов МЗ РК. Пациент сам рассказывает жалобы — включите звук. Вы сами назначаете обследования и лечение, ставите диагноз и оказываете экстренную помощь на время. В конце — оценка в процентах.</p>
|
||
<div class="hero-actions">
|
||
<a class="btn btn-primary" href="#cases">К кейсам</a>
|
||
<button class="btn btn-ghost" id="startFullExam">🏆 Начать полный экзамен</button>
|
||
</div>
|
||
<div class="hero-stats">
|
||
<div><b>6</b><span>кейсов</span></div>
|
||
<div><b>4</b><span>этапа в кейсе</span></div>
|
||
<div><b>60с</b><span>на экстренную помощь</span></div>
|
||
<div><b>%</b><span>итоговая оценка</span></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- КАК ЭТО РАБОТАЕТ -->
|
||
<section id="how" class="section section-light">
|
||
<div class="container">
|
||
<h2 class="h2">Как устроен экзамен</h2>
|
||
<p class="sub">Каждый кейс — это 4 шага решения. За каждый шаг начисляются баллы. Чем точнее выбор, тем выше оценка.</p>
|
||
<div class="steps">
|
||
<div class="step"><div class="step-n">1</div><h3>Обследования</h3><p>Выберите необходимые исследования из списка. Не назначайте лишнее.</p></div>
|
||
<div class="step"><div class="step-n">2</div><h3>Лечение</h3><p>Назначьте препараты из перечня. Избегайте противопоказанных.</p></div>
|
||
<div class="step"><div class="step-n">3</div><h3>Диагноз</h3><p>Выберите верный диагноз из вариантов.</p></div>
|
||
<div class="step"><div class="step-n">4</div><h3>Экстренная помощь ⏱</h3><p>За 60 секунд выберите правильные действия. Время пошло!</p></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- КЕЙСЫ -->
|
||
<section id="cases" class="section">
|
||
<div class="container">
|
||
<h2 class="h2">Клинические кейсы</h2>
|
||
<p class="sub">Решите кейс отдельно или пройдите весь экзамен. Карточки открывают пошаговый режим с оценкой.</p>
|
||
<div class="filters" id="filters">
|
||
<button class="filter is-active" data-filter="all">Все кейсы</button>
|
||
<button class="filter" data-filter="aks">ОКС / инфаркт</button>
|
||
<button class="filter" data-filter="odn">ОДН / астма / ХОБЛ</button>
|
||
<button class="filter" data-filter="shock">Шок и травма</button>
|
||
</div>
|
||
<div class="grid" id="caseGrid"></div>
|
||
<div class="exam-cta">
|
||
<div>
|
||
<h3>Готовы проверить себя целиком?</h3>
|
||
<p>Полный экзамен — все 6 кейсов подряд с итоговой оценкой в процентах и разбивкой по темам.</p>
|
||
</div>
|
||
<button class="btn btn-primary big" id="startFullExam2">🏆 Начать полный экзамен</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- FOOTER -->
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<p><b>Неотложка</b> — учебный экзаменационный симулятор для студентов-медиков. Алгоритмы решения основаны на клинических протоколах диагностики и лечения МЗ РК. Материалы носят обучающий характер и не заменяют первоисточники.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- ЭКЗАМЕН (полноэкранный overlay) -->
|
||
<div class="exam" id="exam" hidden>
|
||
<div class="exam-bar">
|
||
<div class="exam-bar-l">
|
||
<span class="exam-progress-label" id="examProgressLabel">Кейс 1 из 6</span>
|
||
<span class="exam-dots" id="examDots"></span>
|
||
</div>
|
||
<button class="exam-exit" id="examExit">✕ Выйти</button>
|
||
</div>
|
||
<div class="exam-stage-track" id="stageTrack"></div>
|
||
<div class="exam-body" id="examBody"></div>
|
||
</div>
|
||
|
||
<script src="app.js"></script>
|
||
</body>
|
||
</html>
|