-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
131 lines (118 loc) · 5.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
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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!--Import Google Icon Font -- needed for Materialize-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- awesome fonts -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
<!-- Compiled and minified Materialize CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link rel="stylesheet" href="./assets/css/style.css" />
<title>Visit America</title>
<link rel="shortcut icon" type="image/jpg" href="./assets/img/favicon.ico"/>
</head>
<body>
<nav>
<!-- <There are no links in the nav bar because we go to page 2 by clicking a>
park and return through event listeners on visit america title and return btn -->
<div id="HC-home" style="padding-left: 1%"
class="nav-wrapper green darken-3 white-text z-depth-3">
<ul class="left">
<li class="visit-america-logo">Visit America</li>
</ul>
</div>
</nav>
<div class="hero z-depth-2">
<!-- hero is in css file -->
</div>
<main style="padding-bottom:1%" class="container">
<h3>Bringing America to You</h3>
<p>In a time of global pandemic, when travel opportunities are limited, Visit America lets you explore the National Park System without leaving home. Whether planning a trip or day-dreaming about travel, Visit America brings the United States to your fingertips. </p>
<div id="park-search" class="input-field col s6">
<select id="state-name" class="browser-default">
<option id=“blank” value=“” disabled selected>Click to select a state</option>
<option id="AL" value="Alabama">Alabama</option>
<option id="AK" value="Alaska">Alaska</option>
<option id="AZ" value="Arizona">Arizona</option>
<option id="AR" value="Arkansas">Arkansas</option>
<option id="CA" value="California">California</option>
<option id="CO" value="Colorado">Colorado</option>
<option id="CT" value="Connecticut">Connecticut</option>
<option id="DE" value="Delaware">Delaware</option>
<option id="FL" value="Florida">Florida</option>
<option id="GA" value="Georgia">Georgia</option>
<option id="HI" value="Hawaii">Hawaii</option>
<option id="ID" value="Idaho">Idaho</option>
<option id="IL" value="Illinois">Illinois</option>
<option id="IN" value="Indiana">Indiana</option>
<option id="IA" value="Iowa">Iowa</option>
<option id="KS" value="Kansas">Kansas</option>
<option id="KY" value="Kentucky">Kentucky</option>
<option id="LA" value="Louisiana">Louisiana</option>
<option id="ME" value="Maine">Maine</option>
<option id="MD" value="Maryland">Maryland</option>
<option id="MA" value="Massachusetts">Massachusetts</option>
<option id="MI" value="Michigan">Michigan</option>
<option id="MN" value="Minnesota">Minnesota</option>
<option id="MS" value="Mississippi">Mississippi</option>
<option id="MO" value="Missouri">Missouri</option>
<option id="MT" value="Montana">Montana</option>
<option id="NE" value="Nebraska">Nebraska</option>
<option id="NV" value="Nevada">Nevada</option>
<option id="NH" value="New Hampshire">New Hampshire</option>
<option id="NJ" value="New Jersey">New Jersey</option>
<option id="NM" value="New Mexico">New Mexico</option>
<option id="NY" value="New York">New York</option>
<option id="NC" value="North Carolina">North Carolina</option>
<option id="ND" value="North Dakota">North Dakota</option>
<option id="OH" value="Ohio">Ohio</option>
<option id="OK" value="Oklahoma">Oklahoma</option>
<option id="OR" value="Oregon">Oregon</option>
<option id="PA" value="Pennsylvania">Pennsylvania</option>
<option id="RI" value="Rhode Island">Rhode Island</option>
<option id="SC" value="South Carolina">South Carolina</option>
<option id="SD" value="South Dakota">South Dakota</option>
<option id="TN" value="Tennessee">Tennessee</option>
<option id="TX" value="Texas">Texas</option>
<option id="UT" value="Utah">Utah</option>
<option id="VT" value="Vermont">Vermont</option>
<option id="VA" value="Virginia">Virginia</option>
<option id="WA" value="Washington">Washington</option>
<option id="DC" value="Washington D.C.">Washington, D.C.</option>
<option id="WV" value="West Virginia">West Virginia</option>
<option id="WI" value="Wisconsin">Wisconsin</option>
<option id="WY" value="Wyoming">Wyoming</option>
</select>
</div>
<div class="row">
<div id="list" class="col s12 m6 l6">
<!--js builds heading string "Parks in 'whatever park is selected'" -->
<h5 id="park-heading">National Parks</h5>
<ul id="park-list"></ul>
</div>
<div id="history" class="col s12 m6 l6">
<h5>Recently Viewed Parks</h5>
<!-- search history goes here -->
<ul id="park-history"></ul>
</div>
</div>
<br>
<br>
<br>
<footer>Made with blood, sweat, and many zoom meetings by: Cori, Jennifer, Stephanie, and Vicky. © 2021</footer>
</main>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script src="./assets/js/script.js"></script>
<!-- Select menu initializer for Materialize -->
<script>
$(document).ready(function () {
$('select').formSelect();
});
</script>
</body>
</html>