-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
29 lines (29 loc) · 1.36 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>do0ori's Progress Bar</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="progress-container">
<div id="progress-bar">
<span id="count-display">0 / 0</span>
</div>
<input type="number" min="1" id="total-input" placeholder="Total" />
</div>
<div id="context-menu">
<div class="context-menu-item" id="reset-progress">
Reset progress to 0
</div>
<div class="context-menu-item">
<label for="bar-color-picker">Bar color</label>
<input type="color" id="bar-color-picker">
<button id="bar-color-reset-btn">
<svg xmlns="http://www.w3.org/2000/svg" height="12" width="12" viewBox="0 0 512 512"><path fill="#000000" d="M463.5 224H472c13.3 0 24-10.7 24-24V72c0-9.7-5.8-18.5-14.8-22.2s-19.3-1.7-26.2 5.2L413.4 96.6c-87.6-86.5-228.7-86.2-315.8 1c-87.5 87.5-87.5 229.3 0 316.8s229.3 87.5 316.8 0c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0c-62.5 62.5-163.8 62.5-226.3 0s-62.5-163.8 0-226.3c62.2-62.2 162.7-62.5 225.3-1L327 183c-6.9 6.9-8.9 17.2-5.2 26.2s12.5 14.8 22.2 14.8H463.5z"/></svg>
</button>
</div>
</div>
<script src="progressbar.js"></script>
</body>