-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
52 lines (52 loc) · 2.91 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
<!DOCTYPE html>
<html lang='en' dir='ltr'>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<link href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,600' rel='stylesheet' />
<link rel='stylesheet' href='https://necolas.github.io/normalize.css/latest/normalize.css' />
<link rel='stylesheet' href='./index.css'>
<title>Mini Maps</title>
</head>
<body role='document'>
<div class='bodycontainer'>
<header role='banner'>
<div class='logocontainer'>
<img class='logoimg' src='./img/logo.svg' alt='logo icon' />
</div>
<div class='intromessage'>
Quickly find information about your destination
</div>
<div class='firstgeobtncontainer'>
<button role='button' class='firstgeobtn' tabindex='1'><img role='img' class='firstgeobtnimg' src='img/bluecrosshair.svg' alt='bluecrosshair icon'/>Find your location</button>
</div>
<form id='topsearchform' class='topsearchform' action='' method='post'>
<div class='topsearchcontainer'>
<label class='topsearchlabel' for="searchfrominput"><img role='img' class='searchiconimg' src='img/departdot.svg' alt='from icon'/></label>
<input role='textbox' id='searchfrominput' type='text' name='searchinputs' placeholder='From where?' value='' tabindex='2'/>
<button role='button' class='submitbutton fromsubmitbutton' type='submit' tabindex='3'><img class='searchicon' src='img/searchicon.svg' alt='searchicon'/></button>
</div>
<div class='topsearchcontainer'>
<label class='topsearchlabel' for="searchtoinput"><img role='img' class='searchiconimg' src='img/smallredpin.svg' alt='dest icon'/></label>
<input role='textbox' id='searchtoinput' type="text" name="searchinputs" placeholder='Go where?' value="" tabindex='4'/>
<button role='button' class='submitbutton tosubmitbutton' type='submit' tabindex='5'><img class='searchicon' src='img/searchicon.svg' alt='searchicon'/></button>
</div>
</form>
<button role='button' class='expandarrow' tabindex='6'><img role='img' class='expandarrowimg' src='img/collapsearrow.svg' alt='expandarrow' /></button>
</header>
<main role='main'>
<section class='mapsection'>
<div id='map'></div>
<div class='geolocationContainer'>
<button role='button' class='geolocationButton' title='Your Location' tabindex='7'>
<img role='img' class='geolocationImg' src='img/bluecrosshair.svg' alt='bluecrosshair icon'/>
</button>
</div>
</section>
</main>
</div>
<script type='text/javascript' src='./elements.js'></script>
<script defer type='text/javascript' src='./index.js'></script>
</body>
</html>