-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
69 lines (69 loc) · 3.98 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>📔 Imposition Guide</title>
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/css/paper-size.css">
</head>
<body>
<div class="header"><h1>📔 Imposition Guide</h1></div>
<div class="container">
<div class="view"></div>
<form class="controls">
<label for="pages">Pages:</label>
<input type="range" min="2" max="400" value="16" id="pages" name="pages"> <output for="pages">16</output>
<label for="pagesPerSheet">Pages per sheet:</label>
<select id="pagesPerSheet" name="pagesPerSheet">
<option value="2">2</option>
<option value="4">4</option>
<option value="8" selected>8</option>
<option value="12">12</option>
<option value="16">16</option>
<option value="24">24</option>
<option value="32">32</option>
<option value="36">36</option>
</select>
<details id="options">
<summary>Options</summary>
<fieldset>
<legend id="signaturesLegend">Signatures</legend>
<label for="signatures">Number of signatures:</label>
<input type="range" min="1" value="1" id="signatures" name="signatures"> <output for="signatures">1</output>
<label class="lock-label"><input type="checkbox" name="lockSignatures">🔒</label>
<label for="maxSheets">Max sheets/signature:</label>
<input type="range" min="1" value="5" id="maxSheets" name="maxSheets"> <output for="maxSheets">3</output>
<label class="lock-label"><input type="checkbox" name="lockMaxSheets">🔒</label>
</fieldset>
<fieldset>
<legend>Binding style</legend>
<label><input type="radio" name="bindingStyle" value="perfectBinding"> Perfect binding</label>
<label><input type="radio" name="bindingStyle" value="saddleBinding"> Saddle binding</label>
<label><input type="radio" name="bindingStyle" value="mixedBinding" checked> Mixed (nested saddle)</label>
<label><input type="checkbox" name="foldTogether"> Fold sheets together</label>
</fieldset>
<fieldset>
<legend>Other</legend>
<label for="paperSize">Paper size:</label>
<select id="paperSize" name="paperSize">
<optgroup label="ISO 216">
<option value="A3">A3 · 297×420 mm</option>
<option value="A4" selected>A4 · 210×297 mm</option>
<option value="B3">B3 · 353×500 mm</option>
<option value="B4">B4 · 250×353 mm</option>
</optgroup>
<optgroup label="North American">
<option value="letter">Letter · 8½×11 inch</option>
<option value="legal">Legal · 8½×14 inch</option>
<option value="tabloid">Tabloid · 17×11 inch</option>
</optgroup>
</select>
<label>Max bindable sheets: <input type="number" min="2" value="20" name="maxBindableSheets"></label>
<label>Max foldable layers: <input type="number" min="2" value="32" name="maxFoldableLayers"></label>
</fieldset>
</details>
</form>
</div>
<script type="module" src="assets/js/script.js"></script>
</body>
</html>