forked from adarshpatil/timewarp
-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
171 lines (161 loc) · 6.8 KB
/
about.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
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TimeWarp - About</title>
<link rel="shortcut icon" href="favicon.ico" />
<!-- Load CSS -->
<link href="css/style.css" rel="stylesheet" type="text/css" />
<!-- Load Fonts -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Droid+Serif:regular,italic,bold,bolditalic" type="text/css" />
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Droid+Sans:regular,bold" type="text/css" />
<!-- Load jQuery library -->
<script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script>
<!-- Load custom js -->
<script type="text/javascript" src="scripts/panelslide.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
<!-- Load topcontrol js -->
<script type="text/javascript" src="scripts/scrolltopcontrol.js"></script>
<!-- Load NIVO Slider -->
<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/nivo-theme.css" type="text/css" media="screen" />
<script src="scripts/jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="scripts/nivo-options.js" type="text/javascript"></script>
<!-- Load fancybox -->
<script type="text/javascript" src="scripts/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="scripts/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="scripts/jquery.mousewheel-3.0.4.pack.js"></script>
<link rel="stylesheet" href="css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
<script>
//We are using $(window).load here because we want to wait until the images are loaded
$(window).load(function(){
//for each description div...
$('div.description').each(function(){
//...set the opacity to 0...
$(this).css('opacity', 0.5);
//..set width same as the image...
$(this).css('width', $(this).siblings('img').width());
//...get the parent (the aboutimage) and set it's width same as the image width... '
$(this).parent().css('width', $(this).siblings('img').width());
//...set the display to block
$(this).css('display', 'block');
});
$('div.aboutimage').hover(function(){
//when mouse hover over the aboutimage div
//get it's children elements with class description '
//and show it using fadeTo
$(this).children('.description').stop().fadeTo(500, 0.8);
},function(){
//when mouse out of the aboutimage div
//use fadeTo to hide the div
$(this).children('.description').stop().fadeTo(500, 0.5);
});
});
</script>
<!-- Google Analytics -->
<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','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-50522218-1', 'adarshpatil.in');
ga('send', 'pageview');
</script>
</head>
<body>
<!--This is the START of the header-->
<div id="topcontrol" style="position: fixed; bottom: 5px; left: 960px; opacity: 1; cursor: pointer;" title="Go to Top"></div>
<div id="header-wrapper">
<div id="header">
<div id="logo"><a href="index.html"><img src="images/logo.png" width="100" height="80" alt="logo" /></a></div>
<div id="header-text">
<h3>This is a bit about me..</h3 >
<h6><a href="index.html">Home</a> → About</h6>
</div>
</div>
</div>
<!--END of header-->
<!--This is the START of the menu-->
<div id="menu-wrapper">
<div id="main-menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a class="selected" href="about.html">About →</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
<!--This is the START of the footer-->
<div id="footer">
<div id="social-box">
<ul>
<li>
<div class="facebook"><a href="http://facebook.com/adarsh.patil" target="_blank"></a></div>
</li>
<li>
<div class="twitter"><a href="http://twitter.com/adarsh_patil" target="_blank"></a></div>
</li>
</ul>
</div>
<h6>Copyright © 2014 - adarshpatil</h6>
</div>
<!--END of footer-->
</div>
<!--END of menu-->
<!--This is the START of the content-->
<div id="content">
<div class="about">
<h5>I am a Techie at heart,</h5>
<div class='aboutimage'>
<img src="images/about/techie.jpg" width="550" height="366" />
<div class='description'>
<div class='description_content'>I do what I love and I love what I do. I have been fascinated by computers since I was 15 and still continue to purse my interests in this field. I am avidly pursuing research in Computer Architecture and High Performance Computing in IISc. For more details visit my portfolio page.</div>
</div>
</div>
<br/> <br/>
<h5>I like to inspire and be inspired,</h5>
<div class='aboutimage'>
<img src="images/about/ted-blr.jpg" width="550" height="366" />
<div class='description'>
<div class='description_content'>I am a technology evangelist and firmly believe technology can be used for greater good of mandkind</div>
</div>
</div>
<br/> <br/>
<h5>I like to travel, visit places and experience different cultures,</h5>
<div class='aboutimage'>
<img src="images/about/travel.jpg" width="550" height="366" />
<div class='description'>
<div class='description_content'>Been to places all over the world. Thailand, Singapore, Malaysia, Italy, Germany, Austria, Netherlands, Vatican City, London, Frace, Swiss, Qatar, Dubai, South Afria, Kenya, Maldives, USA and more... I would like to keep exploring all my life if possible</div>
</div>
</div>
</div>
<div class="spacer"></div>
</div>
<!--END of content-->
<p class="slide"><a href="#" class="btn-slide"></a></p>
<div id="slide-panel">
<!--This is the START of the follow section-->
<div id="follow">
<h3>Get Notified About My Latest Posts & Upcoming Projects!</h3>
<h5>
<p>I do open source most of my hobby projects. I like to tickle my brain through creative expression and code.</p>
<p>Technically savvy, proficient, easy to work with and a quick learner</p>
</h5>
<img class="star-divider" src="images/subscribe_divider.png" />
<a href="http://www.twitter.com/adarsh_patil" target="_blank">
<div id="follow-twitter"><img src="images/tweet_top.png" />
<h4>Follow me on twitter</h4>
</div>
</a>
<a href="#">
<div id="follow-mail"><img src="images/mail_top.png" />
<h4>Subscribe to my newsletter</h4>
</div>
</a>
<h1>Thanks for visiting!</h1>
</div>
<!--END of follow section-->
</div>
</body>
</html>