Files
dicosemiopsy-qcm/index.html
T
2023-06-05 16:00:39 +02:00

37 lines
1.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DICOMIOPSY QCM</title>
<link rel="stylesheet" href="style.css">
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script type="text/javascript" src="main.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- card related -->
<!--
<meta name="twitter:card" content="summary_large_image">
<meta property="og:title" content="">
<meta property="twitter:title" content="">
<meta property="og:description" content="">
<meta property="twitter:description" content="">
<meta property="og:image" content="https://.../preview_640x320.jpg">
<meta property="twitter:image" content="">
<meta property="org:url" content="https://...">
-->
</head>
<body>
<main id="app" style="display:none">
<h1>DICOMIOPSY QCM</h1>
<div>
<div id='status'>Score : <span class="good">{{ good }} ✔</span> | <span class="bad">{{ bad }} ✘</span></div>
<h2 id="question">{{ data[question].name }}</div>
<template v-for="(answer, i) in answers">
<div class="answer" :class="{right: show_results && answer.id === this.question, wrong: show_results && answer.clicked && answer.id !== this.question}" @click="click(i)">{{ data[answer.id].description }}</div>
</template>
</div>
<br>
<small><a href="https://twitter.com/_klemek" target="_blank">@Klemek</a> - <a href="https://github.com/Klemek/dicosemiopsy-qcm" target="_blank">Github Repository</a> - 2023</small>
</main>
</body>
</html>