-
Notifications
You must be signed in to change notification settings - Fork 0
/
window.html
49 lines (39 loc) · 1.73 KB
/
window.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
<html>
<head>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="scrollbar.css">
<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=Jaldi:wght@400;700&display=swap" rel="stylesheet">
<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=Quicksand:[email protected]&display=swap" rel="stylesheet">
</head>
<body>
<div id="listCreation" class="parentFB">
<h1>Create a new list.</h1>
<p>You'll sort it in the next step.</p>
<!-- Contents added at runtime -->
<div id="todoListContainer"></div> <!-- contains finished items -->
<div id="newItemsContainer"></div> <!-- contains input boxes -->
<div>
<button id="doneButton">Done</button>
</div>
<p>(Don't worry, you can add more later.)</p>
</div>
<div id="sorting" class="parentFB">
<h1>For each pair, choose the item that is higher priority.</h1>
<div style="display: flex; justify-content: center; align-items: center; height: 50vh; margin: 5px;">
<button class="sortOption" id="left">Option 1</button>
<button class="sortOption" id="right">Option 2</button>
</div>
<p>(You can reorder individual items in the next step, or sort again later. )</p>
</div>
<div id="finalList" class="parentFB">
<h1>To-do:</h1>
<div id="todoList"></div>
</div>
<script src="sort.js"></script>
<script src="windowScript.js"></script>
</body>
</html>