-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
336 lines (328 loc) · 14.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
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
<!-- Begin Code Snippet Docstring -->
<!--
This code snippet is an HTML document that represents a personal website. It includes metadata, stylesheets, scripts, and sections for different content such as an introduction, about me, skills, quotes, and contact form. The website includes various styles and scripts for visual effects and interactivity. The code snippet does not have any explicit inputs and generates an HTML document that can be rendered by a web browser.
-->
<!-- End Code Snippet Docstring -->
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="google-site-verification" content="CCdRdGi4mcQEMv_Q4-K8uQwAU59lbJEycK-zBCBX4q0" />
<meta name="description"
content="Hello, I'm a Web developer, YouTuber, and a BCA Student. If you want your own website or play games online then coffee with me.">
<meta name="keywords"
content="web development, web designing, youtube, javascript, tutorials, react, angular, website, seo, bca student, social media marketing, freelancer, bengaluru, india ">
<meta name="author" content="Saurav Byadwal">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta property="og:title" content="Saurav Byadwal " />
<meta property="og:url" content="index.html" />
<meta property="og:image" content="img/logo.png" />
<meta property="og:site_name" content="Saurav Byadwal" />
<meta property="og:description"
content="Hello, I'm a Web developer, YouTuber, and a BCA Student. If you want your own website or play games online then coffee with me." />
<title>Saurav Byadwal</title>
<link href="img/favicon.ico" type="image/x-icon" rel="shortcut icon" />
<link rel="stylesheet" href="css/foundation.css" />
<script src="js/vendor/modernizr.js"></script>
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/font.css" />
<link rel="stylesheet" href="css/animate.css" />
<link rel="stylesheet" href="css/icon.css" />
<link href="https://fonts.googleapis.com/css?family=Sacramento" rel="stylesheet">
<link rel="stylesheet" href="font/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/component.css" />
<script src="js/modernizr.custom.js"></script>
<script src="js/jquery.min.js"></script>
<script type="text/javascript">
function hasScrolled() {var l = $(this).scrollTop(); Math.abs(lastScrollTop - l) <= delta || (l > lastScrollTop && l > navbarHeight ? $("header").removeClass("nav-down").addClass("nav-up") : l + $(window).height() < $(document).height() && $("header").removeClass("nav-up").addClass("nav-down"), lastScrollTop = l)} jQuery(window).scroll(function () {0 == jQuery(this).scrollTop() ? $("header").addClass("reachedTop") : $("header").removeClass("reachedTop")}); var didScroll, lastScrollTop = 0, delta = 2, navbarHeight = $("header").outerHeight(); $(window).scroll(function (l) {didScroll = !0}), setInterval(function () {didScroll && (hasScrolled(), didScroll = !1)}, 250);
</script>
</head>
<body>
<header class="nav-down reachedTop">
<div class="wrapper" id="wrapper">
<div class="row">
<div class="small-12 large-12 columns alignCenter">
<ul class="menu">
<li><a href="#me">about</a></li>
<li><a href="#myskills">skills</a></li>
<li><a href="#coffeewithme">coffee with me</a></li>
</div>
</div>
</div>
</header>
<section class="intro" id="intro">
<div class="row" id="middle_row">
<div class="medium-12 columns alignCenter">
<section class="cd-intro">
<h1 class="cd-headline clip is-full-width">
<img src="img/plane.gif"><br>
<span class="title">Saurav Byadwal</span><br>
<span class="iama">I am </span>
<span class="cd-words-wrapper">
<b class="is-visible">a web developer. </b>
<b>a YouTuber.</b>
<b>a Gamer.</b>
<b>a BCA Student.</b>
<b>a proud Indian.</b>
</span><br>
</h1>
</section>
<a href="#coffeewithme" class="btn"> Coffee with me</a>
</div>
</div>
</section>
<section class="about" id="me">
<div class="row">
<div class="large-12 medium-12 columns">
<div class="large-4 medium-4 columns">
<img class="logo" src="img/Saurav.jpg">
<div class="medium-12 columns">
<ul class="tools">
<li><a href="https://youtube.com/@Sauravby?si=cauI40Ox_sfdGFFi" target="_blank"><i class="fa fa-youtube-play"></i></a></li>
<li><a href="https://www.facebook.com/saurav.byadwal" target="_blank"><i
class="fa fa-facebook-official"></i></a></li>
<li><a href="https://www.linkedin.com/in/saurav-byadwal-125176199/" target="_blank"><i
class="fa fa-linkedin-square"></i></a></li>
<li><a href="mailto:sauravbyadwal@gmail.com" target="_blank"><i class="fa fa-envelope-o"></i></a></li>
<li><a href="https://instagram.com/sauravbyadwal?utm_source=qr&igshid=ZDc4ODBmNjlmNQ%3D%3D" target="_blank"><i class="fa fa-instagram"></i></a></li>
</ul>
</div>
</div>
<div class="large-8 medium-8 columns">
<h1>About me.</h1>
<p>
Hi, I am <a href="https://instagram.com/sauravbyadwal?utm_source=qr&igshid=ZDc4ODBmNjlmNQ%3D%3D" target="_blank">Saurav Byadwal</a>, a 18 year old Web
developer, YouTuber, and a Gamer living in <a href="https://goo.gl/maps/x8JF1zkp3drQukTT8"
target="_blank">Jaipur, India</a>. I am a BCA Student.
</p>
<p>
Have a look at my <a href="https://youtube.com/@Sauravby?si=cauI40Ox_sfdGFFi" target="_blank">YouTube Channel</a>, <a
href="#myskills">skills</a> or just connect with me on <a href="https://www.linkedin.com/in/saurav-byadwal-125176199/"
target="_blank">LinkedIn</a>. I am always excited to do business with like-minded people, let's discuss this over <a href="#coffeewithme">coffee</a>.
</p>
</div>
</div>
</div>
</section>
<hr class="num">
<section class="numbers-wrapper">
<section class="numbers-inner-wrapper">
<div class="numbers">
<h4 id="coded-lines">12 000</h4>
<span>lines of code</span>
</div>
<div class="numbers">
<h4 id="rendered-pixels">783 509</h4>
<span>pixels rendered</span>
</div>
<div class="numbers">
<h4 id="coffee-cups">512</h4>
<span>cups of coffee drink</span>
</div>
<div class="numbers">
<h4 id="projects-completed">2</h4>
<span>projects completed</span>
</div>
</section>
</section>
<section class="myskills" id="myskills">
<div class="row alignCenter">
<h1>Skills.</h1>
<div class="skills">
</div>
<div class="downloadCV">
<p>
Download my Resume
</p>
<img class="resume" onclick="changeImage()" src="img/dwnld.png">
</div>
</div>
</section>
<section class="quotes" id="quotes">
<div class="row alignCenter">
<h1>Inspiring Quotes.</h1>
<p>
</p>
<div id="quote-slider" class="cbp-fwslider">
<ul>
<li>
<img class="quotes_img" src="img/quotes/steve-jobs.jpg" alt="Steve Jobs" />
<h2 class="quotelines">" Because the people who are crazy enough to think they can<br>
change the world are the ones who do. "</h2>
<p class="desc">
by <b>Steve Jobs</b>
</p>
</li>
<li>
<img class="quotes_img" src="img/quotes/bill-gates.jpg" alt="Bill Gates" />
<h2 class="quotelines">" Success is a lousy teacher. It seduces smart people into<br>
thinking they can't lose. "</h2>
<p class="desc">
by <b>Bill Gates</b>
</p>
</li>
<li>
<img class="quotes_img" src="img/quotes/linus-torvalds.jpg" alt="Linus Torvalds" />
<h2 class="quotelines">" See, you not only have to be a good coder to create system<br>
like Linux, you have to be a sneaky bastard too. "</h2>
<p class="desc">
by <b>Linus Torvalds</b>
</p>
</li>
<li>
<img class="quotes_img" src="img/quotes/larry-page.jpg" alt="Larry Page" />
<h2 class="quotelines">" If you're changing the world, you're working on important things.<br>
You're excited to get up in the morning. "</h2>
<p class="desc">
by <b>Larry Page</b>
</p>
</li>
</ul>
</div>
</div>
</section>
<section class="coffeewithme" id="coffeewithme">
<div class="row alignCenter">
<h1>Coffee with me.</h1>
<p>
I am always excited to work on some awesome projects, message me and let's discuss over coffee.
</p>
<form id="theForm" class="simform" autocomplete="off">
<div class="simform-inner">
<ol class="questions">
<li>
<span><label for="q1">Write a message for me below</label></span>
<input id="q1" name="q1" type="text" />
</li>
<li>
<span><label for="q2">Your name</label></span>
<input id="q2" name="q2" type="text" />
</li>
<li>
<span><label for="q3">Your email or phone number</label></span>
<input id="q3" name="q3" type="text" />
</li>
</ol>
<!-- /questions -->
<button class="submit" type="submit">Send answers</button>
<div class="controls">
<button class="next"><i class="fa fa-arrow-right"></i></button>
<div class="progress">
</div>
<span class="number">
<span class="number-current"></span>
<span class="number-total"></span>
</span>
<span class="error-message"></span>
</div>
<!-- / controls -->
</div>
<!-- /simform-inner -->
<span class="final-message"></span>
</form>
<!-- /simform -->
</div>
</section>
<section class="sayhello" id="hello">
<div class="row">
<div class="large-4 columns pad10">
<p>
<b></b><br>
</p>
</div>
<div class="large-4 columns">
<p class="footTitle alignCenter">
Saurav Byadwal
</p>
<p class="madewithlove">
Made with <i class="fa fa-heart"></i> in India
</p>
</div>
<div class="large-4 columns alignCenter pad10">
<p class="alignCenter">
You can find me everywhere
</p>
<ul class="tools">
<li><a href="https://youtube.com/@Sauravby?si=cauI40Ox_sfdGFFi" target="_blank"><i class="fa fa-youtube-play"></i></a></li>
<li><a href="https://instagram.com/sauravbyadwal?utm_source=qr&igshid=ZDc4ODBmNjlmNQ%3D%3D" target="_blank"><i class="fa fa-instagram"></i></a></li>
<li><a href="https://www.facebook.com/saurav.byadwal" target="_blank"><i
class="fa fa-facebook-official"></i></a></li>
<li><a href="https://www.linkedin.com/in/saurav-byadwal-125176199/" target="_blank"><i
class="fa fa-linkedin-square"></i></a></li>
<li><a href="mailto:sauravbyadwal@gmail.com" target="_blank"><i class="fa fa-envelope-o"></i></a></li>
</ul>
</div>
</div>
<img class="footer-image" src="img/foot.jpg">
</section>
<script src="js/classie.js"></script>
<script src="js/stepsForm.js"></script>
<script src="js/jquery.animateNumber.min.js"></script>
<script src="js/jquery.cbpFWSlider.min.js"></script>
<script>
$(function () {
$('#cbp-fwslider').cbpFWSlider();
$('#quote-slider').cbpFWSlider();
setInterval(function () {
if ($('.cbp-fwnext').eq(1).is(":visible")) {
$('.cbp-fwnext').eq(1).click();
}
else {
$('.cbp-fwdots').eq(1).find('span').click();
}
}, 6000);
});
</script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function () {
$('header a').bind('click', function (event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500, 'easeInOutExpo');
event.preventDefault();
});
});
$(function () {
$('#intro a').bind('click', function (event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500, 'easeInOutExpo');
event.preventDefault();
});
});
</script>
<script src="js/foundation.min.js"></script>
<script>
$(document).foundation();
</script>
<script src="js/textRotate.js"></script>
<script type="text/javascript">
var sc_project = 11086857;
var sc_invisible = 1;
var sc_security = "58e9ef84";
var scJsHost = (("https:" == document.location.protocol) ?
"https://secure." : "http://www.");
document.write("<sc" + "ript type='text/javascript' src='" +
scJsHost +
"statcounter.com/counter/counter.js'></" + "script>");
</script>
<noscript>
<div class="statcounter"><a title="create counter" href="http://statcounter.com/free-hit-counter/"
target="_blank"><img class="statcounter" src="//c.statcounter.com/11086857/0/58e9ef84/1/" alt="create
counter"></a></div>
</noscript>
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date(); a = s.createElement(o),
m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-36122972-4', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>