-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
86 lines (79 loc) · 4.03 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<!--<meta http-equiv="X-UA-Compatible" content="IE=edge">-->
<title>HoleCutter</title>
<link href="css/pure-min.css" rel="stylesheet">
<link href="css/forms-min.css" rel="stylesheet">
<link href="css/grids-responsive-min.css" rel="stylesheet">
<link href="css/default.css" rel="stylesheet">
</head>
<body>
<!-- Title/description -->
<h1 class='title'>Hole Cutter</h1>
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-2 image-container">
<div class="image-wrapper">
<img class='pure-img' src="images/hole.png">
<p class='diameter-id'></p>
<p class='depth-id'></p>
</div>
</div>
<div class="pure-u-1 pure-u-md-1-3">
<button class="center-bit" >Center Bit</button>
<div class="pure-u-1 settings">
<img class="lock" src="images/lock.jpg">
<img class="unlock" src="images/unlock.jpg">
<div class="pure-menu pure-menu-horizontal">
<ul class="pure-menu-list">
<li class="pure-menu-item"><a href="#" class="pure-menu-link basic-link">Basic</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link advanced-link">Advanced</a></li>
</ul>
</div>
<div class='content'>
<div id="signupForm" class="pure-form pure-form-stacked basic-setting" data-parsley-validate>
<fieldset>
<div class="pure-control-group">
<label class='basic' for="diameter">Diameter (in)</label>
<input class='basic' id="diameter" type="number" step="any" data-parsley-required="true" placeholder="Diameter" data-parsley-maxlength="5" data-parsley-min="0" ></span>
</div>
<div class="pure-control-group">
<label class='basic' for="depth">Depth (in)</label>
<input class='basic' id="depth" type="number" step="any" data-parsley-required="true" placeholder="Depth" data-parsley-maxlength="5" data-parsley-min="0" >
</div>
<div class="pure-control-group">
<label class="advanced" for="feed-rate">Feed Rate (in/s)</label>
<input class='advanced' id="feed-rate" type="number" step="any" data-parsley-required="true" placeholder="Feed Rate" data-parsley-maxlength="5" data-parsley-min="0" value="3" disabled>
</div>
<div class="pure-control-group">
<label class='advanced' for="cut-through">Cut Through (in)</label>
<input class='advanced' id="cut-through" type="number" step="any" data-parsley-required="true" placeholder="Cut Through" data-parsley-maxlength="5" data-parsley-min="0" value="0.02" disabled>
</div>
<div class="pure-control-group">
<label class='advanced' for="bit-diameter">Bit Diameter (in)</label>
<input class='advanced' id="bit-diameter" type="number" step="any" data-parsley-required="true" placeholder="Bit Diameter" data-parsley-maxlength="5" data-parsley-min="0" value="0.25" disabled>
</div>
<button id="submit" >Next</button>
</fieldset>
</div>
</div>
</div>
</div>
<div class='modal'>
<div class='modal-content'>
<p></p>
<button class="exit-modal" >Okay</button>
</div>
</div>
<div class='modal-container'></div>
</div>
<script src="js/lib/jquery.min.js"></script>
<script src="js/lib/fabmo.js"></script>
<script type="text/javascript">
var fabmo = new FabMoDashboard();
</script>
<script src="js/lib/parsley.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>