-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
243 lines (213 loc) · 10.4 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
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
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="public/css/portfolio/style.css">
<meta charset="UTF-8">
<meta name="description" content="">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width">
<link href="https://fonts.cdnfonts.com/css/black-jack" rel="stylesheet">
<link href="https://fonts.cdnfonts.com/css/elvishlis" rel="stylesheet">
<title>VUK Clicks</title>
<!-- <link rel="icon" href="../img/core-img/1.png"> -->
<link rel="icon" href="../img/core-img/favicon.png">
<!-- animate on scroll css -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.3.5/css/swiper.min.css'>
<link rel="stylesheet" href="public/css/home/style.css">
<meta charset="UTF-8">
<meta name="description" content="">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width">
<link href="https://fonts.cdnfonts.com/css/black-jack" rel="stylesheet">
<link href="https://fonts.cdnfonts.com/css/elvishlis" rel="stylesheet">
<title>VUK Clicks</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" integrity="sha512-YWzhKL2whUzgiheMoBFwW8CKV4qpHQAEuvilg9FAn5VJUDwKZZxkJNuGM4XkWuk94WCrrwslk8yWNGmY1EduTA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- <link rel="icon" href="../img/core-img/1.png"> -->
<link rel="icon" href="../img/core-img/favicon.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.3.5/css/swiper.min.css'>
<title>VUKClicks</title>
</head>
<body>
<section id="header">
<nav>
<div class="navbar">
<div class="container nav-container">
<input class="checkbox" type="checkbox" name="" id="" />
<div class="hamburger-lines">
<span class="line line1"></span>
<span class="line line2"></span>
<span class="line line3"></span>
</div>
<div class="menu-items">
<li>
<a class="fa fa-instagram" href="https://www.instagram.com/vukclicks/" target="_blank" >
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;">Instagram</span>
</a>
</li>
<li>
<a class="fa fa-flickr" href="https://www.flickr.com/photos/vukhere/" target="_blank">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;">Flickr</span>
</a>
</li>
<li>
<a class="fa fa-youtube-play" href="https://www.youtube.com/@vuktcli" target="_blank">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;">Youtube</span>
</a>
</li>
<hr style="width:80%;text-align:right;margin-left:10;align:right;"/><br/>
<li>
<a class="fa-regular fa-images" href="#Portfolio" target="">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;left:20%;">Gallery</span>
</a>
</li>
<li>
<a class="fa fa-user" href="#aboutme" target="">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;left:20%;">About-me</span>
</a>
</li>
<hr style="width:80%;text-align:right;margin-right:10"/><br/>
<li>
<a class="fa fa-paw" href="./public/pages/portfolio/fauna/fauna.html" target="">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;left:20%;">Safari Diaries</span>
</a>
</li>
<li>
<a class="fa fa-plane" href="./public/pages/portfolio/travel/travel.html" target="">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;"> Wandering Eyes</span>
</a>
</li>
<li >
<a class="fas fa-panorama" href="./public/pages/portfolio/landscapes/landscape.html" target="">
<span style="font-family: 'Elvishlis', sans-serif;font-size: medium;"> Panoramas</span>
</a>
</li>
<br>
</div>
</div>
</div>
</nav>
<div id="home" class="text-box">
<h1 style="height: auto;font-size: 170px;">VUK<br><br>Clicks</h1>
<p style="font-family: 'Elvishlis', sans-serif;">
<i>“What I like about photographs is that they capture a moment that’s gone forever, impossible to reproduce.” – Karl Lagerfeld </i>
</p>
<span>↓</span>
</a>
</div>
</section>
<section id="background-video">
<video class="video-cover" playsinline autoplay loop muted>
<source src="images/home/background.mp4">
</video>
</section>
<section id="Portfolio" style>
<h1 style="font-family: 'Elvishlis', sans-serif;font-size:24px;font-style: italic; font-weight:normal;color:white;">Gallery (2012 - 2024) </h1>
<div class="grid-container">
<div>
<img class='grid-item grid-item-1' src='images/home/gallery/1.jpg' alt=''>
<p>Colmar Malaysia (French Village)</p>
</div>
<div>
<img class='grid-item grid-item-3' src='images/portfolio/travel/Scotland/12.jpg' alt=''>
<p>Nevis range, scotland</p>
</div>
<div>
<img class='grid-item grid-item-3' src='images/portfolio/travel/UK/4.jpg' alt=''>
<p>The London Eye, or the Millennium Wheel, near River Thames in London</p>
</div>
<div>
<img class='grid-item grid-item-2' src='images/home/gallery/2.jpg' alt=''>
<p>Thean Hou Temple, Chinese temple in Kuala Lumpur</p>
</div>
<div>
<img class='grid-item grid-item-4' src='images/home/gallery/4.jpg' alt=''>
<p>Buddhist temple, Penang, Malaysia</p>
</div>
<div>
<img class='grid-item grid-item-5' src='images/home/gallery/5.jpg' alt=''>
<p>Mural - Kids on bicycle by Ernest Zacharevic, Penang, Malaysia</p>
</div>
<div>
<img class='grid-item grid-item-6' src='images/home/gallery/6.jpg' alt=''>
<p>Phi-Phi Island, Thailand</p>
</div>
<div>
<img class='grid-item grid-item-7' src='images/home/gallery/7.jpg' alt=''>
<p>The Hong Kong Observation Wheel is a 60-metre tall Ferris wheel located at the Central Harbourfront, Central, Hong Kong</p>
</div>
<div>
<img class='grid-item grid-item-8' src='images/home/gallery/8.jpg' alt=''>
<p>Fishing and Boating, near Singapore waters</p>
</div>
<div>
<img class='grid-item grid-item-9' src='images/home/gallery/9.jpg' alt=''>
<p>Nagarhole National Park, is a wildlife reserve in the South Indian state of Karnataka.</p>
</div>
<div>
<img class='grid-item grid-item-10' src='images/home/gallery/10.jpg' alt=''>
<p>Members of Equus family, Singapore </p>
</div>
</div>
</section>
<section id="aboutme">
<h1 class="text-center" style="font-family: 'Elvishlis', sans-serif;font-size:50px;color:white;">About Me </h1>
<div class="wrap">
<div class="tile">
<div class="text">
<h1>
<br>#WildLife <br> #Travel <br> #Street <br> #Landscape <br> #Architecture
</h1>
</div>
</div>
<div class="tile">
<img src='images/home/profile.jpeg' style="width:80%;left:10%;height: 90%;top:7%"/>
<div class="text" style="top: 45%;">
<h3>Hey there, welcome to <br>the amazing world of <br>VUK Click’s! </h3>
</div>
</div>
<div class="tile">
<div class="text">
<br>
<br> I'm Uday - amateur photographer. <br> I just wanted to express my sheer excitement about being a hobby and travel photographer. <br>
<br>
<hr style=" background-color: #f0eaea;">
<br>
<br>Join me, on this incredible journey of visual storytelling, and let's celebrate the artistry and beauty of photography together! <div></div>
</div>
</div>
</div>
</div>
</section>
<section class="footer" style="background-color: rgb(42, 40, 40);">
<p>Copyrights © VUKClicks, 2024</p>
</section>
<script>
function myFunction() {
var x = document.getElementById("myLinks");
if (x.style.display === "block") {
x.style.display = "none";
} else {
x.style.display = "block";
}
}
</script>
<script src="public/js/home/popper.min.js%2bbootstrap.min.js.pagespeed.jc.9S4FA15Zn6.js"></script>
<script src="public/js/home/default-assets/active.js"></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-23581568-13"></script>
<!-- animate on scroll js -->
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
AOS.init();
</script>
<script src="public/js/script.js"></script>
<script src="public/js/portfolio/script.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
</body>
</html>