-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathnorthside-berkeley.html
123 lines (111 loc) · 7.02 KB
/
northside-berkeley.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
<html>
<head>
<title>Welcome to HistoriCal</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> -->
<!-- Bootstrap core CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href='assets/css/styles.css' rel='stylesheet' type='text/css'>
</head>
<body>
<!-- Webpage for Northside Berkeley -->
<!--Start Navigation -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="index.html">Histori<span class="calNav">CAL</span></a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="landmarks.html"><span class="calNav">Landmarks</span></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="calNav">Browse by map</span>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="northside-berkeley.html">Northside Berkeley</a>
<a class="dropdown-item" href="west-berkeley.html">West Berkeley</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownPortfolio" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="calNav">Create a tour</span>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownPortfolio">
<a class="dropdown-item" href="walking-tour.html">Walking Tour</a>
<a class="dropdown-item" href="bicycle-tour.html">Bicycle Tour</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html"><span class="calNav">Contact</span></a>
</li>
</ul>
</div>
</div>
</nav>
<!--End Navigation -->
<div class="container">
<!--Start container -->
<!--Start Page Content -->
<!-- Top Panel -->
<div class="row">
<div class="col-lg-12">
<div class="card panel-default">
<div class="card-heading">
<h1 class="card-title">Welcome to Histori<span style="color: #FDB515" >CAL</span></h1>
</div>
<div class="container">
<h2 style="color: #003262">Northside Berkeley Map</h2>
<br>
<p style="color: #003262">Recommended tour for: walking & biking</p>
<br>
<h3 style="color: #003262">Recommended starting point: Hearst Greek Theatre </h3>
<p style="color: #003262">Located at the easternmost point of the Northside Berkeley tour, Hearst Greek Theatre is recommended because it is the landmark with the largest square feet. Not only that, the Greek theatre provides plenty of parking spaces around the area to park your vehicle and start your tour. </p>
<br>
<h3 style="color: #003262">Recommended ending point: Thornburg Village </h3>
<p style="color: #003262"> Located at the westernmost point of the Northside Berkeley tour, Thornburg Village is one of the oldest landmarks that preserves the architectire of various old European styles. Plus after you finish, you will be located right next to downtown Berkeley, where you can try the multitude of food and drink options downtown Berkeley has to offer. </p>
<br>
<p>Question: Why isn't there a line guiding the tour?</p>
<p>Answer: HistoriCAL is all about learning and exploring the history of Berkeley. So what fun would it be if you were told what order you had to see each landmark? Feel free to go wherever and discover what you want to discover </p>
<div id="map"></div>
<div id="close"></div>
</div>
</div>
</div>
</div>
<!-- End Top Panel -->
<!--End Page Content -->
<!--End container -->
</div>
<!-- Footer -->
<br>
<div class="row mb-4">
<div class="col-lg-12 text-center">
<button class="btn" id="home"><i class="material-icons ml-2 mr-2"> home</i></button>
<button class="btn" id="landmarks"><i class="material-icons ml-2 mr-2">account_balance</i></button>
<button class="btn" id="browse"><i class="material-icons ml-2 mr-2">date_range</i></button>
<button class="btn" id="tour"><i class="material-icons ml-2 mr-2">location_on</i></button>
<button class="btn" id="contact"><i class="material-icons ml-2 mr-2">settings</i></button>
</div>
</div>
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Tour historic landmarks with historiCal! © 2018</p>
</div> <!-- /.container -->
</footer>
<!-- End Footer -->
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
<!-- In the line above the end of the URL "&callback=initMap" throws an error -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA_AfrYQz44BdWqNjg_Ej72ktR6oiyvmzI"></script>
<!-- <script src="js/googlemaps.js"></script> -->
<!-- The above file works but doesn't inclued the click function -->
<script src="assets/js/north.js"></script>
</body>
</html>