-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
29 lines (26 loc) · 1.42 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
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
<script src="uploader.js" type="text/javascript"></script>
<link href="uploader.css" rel="stylesheet" />
<div id="uploader-container" class="transparent">
<h2 class="step-one">First, take your picture or select a photo from your device.</h2>
<div class="step-container step-one">
<div id="upload-button" onclick="$('#fileinput').click()">
<i id="upload-icon" class="fas fa-upload fa-9x"></i>
<img id="selected-image" src="#" alt="your selected image" />
</div>
<p><input id="fileinput" type="file" accept="image/gif, image/jpeg, image/png" onchange="onFileChange(this)"/></p>
</div>
<h2 class="step-two">We'll email your perfectly cropped photo to you in a few minutes when it's ready?</h2>
<div class="step-container step-two">
<p>Where should we send your photo?</p>
<p><input id="email" type="text" placeholder="email address"></p>
<div id="buttons">
<button onclick="showStepOne()">Back</button>
<button onclick="submit();">Submit</button>
</div>
</div>
<h2 class="step-three">That's it! Check your email for your perfectly cropped passport photo.</h2>
</div>