-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathindex.html
More file actions
160 lines (153 loc) · 7.91 KB
/
Copy pathindex.html
File metadata and controls
160 lines (153 loc) · 7.91 KB
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
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Foundation Starter Template</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/foundation-sites@6.7.5/dist/css/foundation.min.css"
crossorigin="anonymous">
<link rel="stylesheet" href="asset/css/Foundation/css/foundation.css">
<link rel="stylesheet" href="asset/css/style.css">
</head>
<body>
<!-- nav bar -->
<header class="Expanded">
<h1>NavigateUrWeek</h1>
<nav>
<ul>
<li><a href="#BUG">Before You Go</a></li>
<li><a href="#Explore">Explore</a></li>
<li><a href="#social">Contact us</a></li>
</ul>
</nav>
</header>
<!-- image orbit and link to custom search -->
<section id="box">
<div class="news-image-gallery-container">
<div class="row">
<div class="small-12 medium-12 large-8 columns">
<div class="orbit" role="region" aria-label="Favorite Space Pictures" data-orbit
data-options="animInFromLeft:fade-in; animInFromRight:fade-in; animOutToLeft:fade-out; animOutToRight:fade-out;">
<ul class="orbit-container">
<button class="orbit-previous"><span class="show-for-sr">Previous Slide</span>◀︎</button>
<button class="orbit-next"><span class="show-for-sr">Next Slide</span>▶︎</button>
<li class="is-active orbit-slide">
<a href="./asset/html/locationSearch.html">
<img class="orbit-image" src="asset/image/map.jpg" alt="Space">
<figcaption class="orbit-caption">Ready to plan Ur Weekeend!!</figcaption>
</a>
</li>
<li class="orbit-slide">
<img class="orbit-image" src="asset/image/Kiama.jpg" alt="Space">
<figcaption class="orbit-caption">Kiama</figcaption>
</li>
<li class="orbit-slide">
<img class="orbit-image" src="asset/image/Perisher.jpg" alt="Space">
<figcaption class="orbit-caption">Thredbo</figcaption>
</li>
<li class="orbit-slide">
<img class="orbit-image" src="asset/image/bondi.jpg" alt="Space">
<figcaption class="orbit-caption">Bondi Beach</figcaption>
</li>
<li class="orbit-slide">
<img class="orbit-image" src="asset/image/pebbly.jpg" alt="Space">
<figcaption class="orbit-caption">Pebbly Beach</figcaption>
</li>
</ul>
<nav class="orbit-bullets">
<button class="is-active" data-slide="0"><span class="show-for-sr">First slide details.</span><span
class="show-for-sr">Current Slide</span></button>
<button data-slide="1"><span class="show-for-sr">Second slide details.</span></button>
<button data-slide="2"><span class="show-for-sr">Third slide details.</span></button>
<button data-slide="3"><span class="show-for-sr">Fourth slide details.</span></button>
<button data-slide="4"><span class="show-for-sr">Fith slide details.</span></button>
</nav>
</div>
</div>
</div>
</div>
<!-- travel info reminder -->
<div>
<h2 id="BUG">Before You Go!</h2>
<p>Traveling can be thrilling, but it's crucial to consider certain aspects beforehand. Research your
destination's culture, customs, and laws. Check travel advisories and ensure safety. Arrange necessary travel
documents like passports, visas, and vaccinations. Set a budget covering expenses like transportation,
accommodation, meals, and activities. Prioritize health by getting recommended vaccinations and purchasing
travel insurance. Plan accommodation and transportation options in advance. Ensure safety by being aware of
scams, safeguarding belongings, and knowing emergency numbers. Create a packing list with versatile clothing and
essential items. Check connectivity options and download useful travel apps. Learn about local customs and
etiquette. Maintain a flexible itinerary to accommodate unexpected events. By considering these factors, you can
have a smoother and more enjoyable travel experience.</p>
<!-- explore locations -->
<section id="Portfolio" class="Portfolio">
<h3 id="Explore">Explore</h3>
<div class="gallery">
<div class="portfolio-item">
<img src="asset/image/Kiama.jpg" alt="Image of Kiama" class="thumbnail" height="100" width="100">
<h4>Kiama</h4>
<p><img class="currentConditionIcon" src="" alt=""><span class="currentWeather"></span></p>
</div>
<div class="portfolio-item">
<img src="asset/image/Perisher.jpg" alt="Image Of Thredbo" class="thumbnail" height="100" width="100">
<h4>Thredbo</h4>
<p><img class="currentConditionIcon" src="" alt=""><span class="currentWeather"></span></p>
</div>
<div class="portfolio-item">
<img src="asset/image/bondi.jpg" alt="Image Of Bondi beach" class="thumbnail" height="100" width="100">
<h4>Bondi Beach</h4>
<p><img class="currentConditionIcon" src="" alt=""><span class="currentWeather"></span></p>
</div>
<div class="portfolio-item">
<img src="asset/image/pebbly.jpg" alt="Image Of Pebbly beach" class="thumbnail" height="100" width="100">
<h4>Pebbly Beach</h4>
<p><img class="currentConditionIcon" src="" alt=""><span class="currentWeather"></span></p>
</div>
<div class="portfolio-item">
<img src="asset/image/dubbo.jpg" alt="Image of Dubbo Zoo" class="thumbnail" height="100" width="100">
<h4>Dubbo Zoo</h4>
<p><img class="currentConditionIcon" src="" alt=""><span class="currentWeather"></span></p>
</div>
<div class="portfolio-item">
<img src="asset/image/Abercrombie House.jpg" alt="Image oF Abercrombie House" class="thumbnail" height="100"
width="100">
<h4>Abercrombie House</h4>
<p><img class="currentConditionIcon" src="" alt=""><span class="currentWeather"></span></p>
</div>
</div>
<!-- Recently searched locations -->
<div>
<h3>Watch List</h3>
<div class="gallery" id="history">
</div>
</div>
</section>
</section>
<!-- footer socials -->
<footer>
<div id="social" class="medium-4 columns align-center">
<h4 class="marketing-site-footer-title">Socials</h4>
<div class="rounded-social-buttons">
<a class="social-button facebook" href="facebook.com"></a>
<a class="social-button twitter" href="twitter.com"></a>
<a class="social-button linkedin" href="linkedin.com"></a>
<a class="social-button google-plus" href="Google.com"></a>
</div>
</div>
<div>
<p>© 2023 My Portfolio. All rights reserved.</p>
</div>
</footer>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/foundation-sites@6.7.5/dist/js/foundation.min.js"
crossorigin="anonymous"></script>
<script>
$(document).foundation();
</script>
<script src="./asset/js/weatherAPI.js"></script>
<script src="./asset/js/site.js"></script>
</body>
</html>