forked from ScienceNerd2240/OoTxMM-Item-Sanity-Checklist
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
143 lines (133 loc) · 7.99 KB
/
index.html
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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!DOCTYPE html>
<html>
<head>
<title>Sanity Checklist Prototype</title>
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="styles/main-header.css">
<link rel="stylesheet" href="styles/main-checklist.css">
<link rel="stylesheet" href="styles/main-options.css">
</head>
<body>
<header class="fix-top">
<h1 style="text-align: center;">OOTxMM Randomizer - Sanity-Checklist</h1>
</header>
<main>
<section class="display-options">
<input type="checkbox"> Hide completed categories
<input type="checkbox"> Hide completed checks
</section>
<section class="sanity-options">
<div class="game">
<div>
<label>OoT</label>
<input type="radio" name="game" checked>
</div>
<div>
<label>MM</label>
<input type="radio" name="game">
</div>
</div>
<div class="area-sanities">
<div class="sanity">
<div class="drop-name">
<label for="sanity">Sanity Type:</label>
<div class="hint">
<label>?</label>
<div class="tooltip">
<p><strong>Scrubs: </strong>Each Deku Scrub that do a one-time trade</p>
<p><strong>Shops: </strong>Each Shop has a total of 8 completely random items</p>
<p><strong>Cows: </strong>Each Cow will provide a random Item when <strong>Epona's Song</strong> has been played</p>
<p><strong>Grass: </strong>Each bundle of Grass will have a random Item on the first destruction</p>
<p><strong>Pots: </strong>Each Pot will have a random Item on the first destruction</p>
<p><strong>Crates: </strong>Each wooden Crate will have a random Item on the first destruction</p>
</div>
</div>
</div>
<select name="sanity" id="sanity">
<option value="scrub" selected>Scrubs</option>
<option value="shop">Shops</option>
<option value="cow">Cows</option>
<option value="pots">Pots</option>
<option value="grass">Grass</option>
<option value="grass" disabled>Crates (Coming Soon)</option>
</select>
</div>
<div class="region">
<div class="drop-name">
<label for="region">Region:</label>
<div class="hint">
<label>?</label>
<div class="tooltip">
<p><strong>Overworld: </strong>Every (major) area that is accessible and not a dungeon or Grotto. (Includes sub-areas such as houses)</p>
<p><strong>Dungeons: </strong>Everything that can be found within a Dungeon. (Ex.: Deku Tree, Great Bay Temple)</p>
<p><strong>Grotto: </strong>Everything in that can be found in a Grotto. (Holes in the ground which can require <strong>Bombs</strong> or <strong>Song of Time</strong> to be exposed. They usually contain at least a GS (OoT) or a chest.)</p>
<p><strong>Ganon/Moon: </strong>Everything that can be found at Ganon's Castle or The Moon, depednding on the Game you have selected. (Needs to be done exclusively with JavaScript)</p>
</div>
</div>
</div>
<select name="region" id="region">
<option value="overworld" selected>Overworld</option>
<option value="dungeon">Dungeons</option>
<option value="grotto">Grottos</option>
<option value="ganon-moon" disabled>Ganon/Moon</option>
</select>
</div>
</div>
</section>
<section class="area-checklist">
<section class="check-category" id="cateogry-1">
<p class="name-category">List of Checks 1</p>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script as soon as fucking possible this text will soon overflow and we will see how it affects the line like holy shit this is one fucking long line of text right here
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox">
<label>Try to do this properly in Java Script as soon as fucking possible this text will soon overflow and we will see how it affects the line like holy shit this is one fucking long line of text right here</label>
</div>
<div class="check">
<input type="checkbox">
<label>Try to do this properly in Java Script</label>
</div>
</section>
<section class="check-category" id="cateogry-2">
<p class="name-category">List of Checks 2</p>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script as soon as fucking possible this text will soon overflow and we will see how it affects the line like holy shit this is one fucking long line of text right here
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox"> Try to do this properly in Java Script
</div>
<div class="check">
<input type="checkbox">
<label>Try to do this properly in Java Script as soon as fucking possible this text will soon overflow and we will see how it affects the line like holy shit this is one fucking long line of text right here</label>
</div>
<div class="check">
<input type="checkbox">
<label>Try to do this properly in Java Script</label>
</div>
</section>
</section>
</main>
</body>
</html>