JS-LearningCards/index.html at main · JkutkutArchive/JS-LearningCards · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html><html>
	<head>
		<meta charset="utf-8">
        <meta name="author" content="Jkutkut">

		<!-- Logo & title -->
		<title>Learning Card</title>
		<!-- <link rel="icon" href=""> -->

		<!-- CSS -->
		<link rel="stylesheet" type="text/css" href="./Res/CSS/common.css">
		<link rel="stylesheet" type="text/css" href="./Res/CSS/card/card_common.css">
		<link rel="stylesheet" type="text/css" href="./Res/CSS/menu.css">

		<!-- JS -->
		<script src="./Res/JS/cssLogic.js"></script>
		<script src="./Res/JS/handleContent.js"></script>
	</head>
	<body>
		<div class="loadMenu">
			<div class="loadMenuBar">
				<div class="menuBtn newData">
					<label>
						<div class="menuBtn">
							<input id="loadQuestionsBtn" type="file" required/>
							<span>Load questions</span>
						</div>
					</label>
				</div>
				<!-- <div class="menuBtn continueData">
					<p>Continue</p>
				</div> -->
				<div class="createQuestions menuBtn">
					<p>Create questions</p>
				</div>
			</div>
			<div class="dragDropData">
				<p>Drop file to load questions.</p>
			</div>
		</div>
		<div class="cardMenu">
			<div class="card">
				<div class="card-face front">
					<div class="question">
						<div class="questionText textLabel">
							<p>This is the question</p>
						</div>
						<div class="image questionImage">
							<img id="questionImage" src="" alt="question">
						</div>
					</div>
				</div>
				<div class="card-face back">
					<div class="answer">
						<div class="answerText textLabel">
							<p>This is the response</p>
						</div>
						<div class="image answerImage">
							<img id="answerImage" src="" alt="question">
						</div>
						<div class="detailAnswerText textLabel smallerLabel">
							<p></p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>