-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmywebsite.html
237 lines (200 loc) · 11 KB
/
mywebsite.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
<!DOCTYPE html>
<html>
<head>
<title>MY PORTFOLIO</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Russo+One">
<link rel="stylesheet" href="stylesheet.css">
</head>
<body class="w3-light-gray w3-content" style="max-width:1600px">
<!-- Sidebar/menu -->
<nav class="w3-sidebar w3-collapse w3-animate-left w3-blue-gray" style="z-index:3;width:100px;" id="mySidebar">
<nav class="w3-sidebar w3-bar-block w3-small w3-hide-small w3-center w3-black" style="width:100px;margin-top: 215px; height:390px">
<a href="#" class="w3-bar-item w3-button w3-padding-large w3-hover-blue-grey">
<i class="fa fa-home fa-2x"></i>
<p>HOME</p>
</a>
<a href="#about" class="w3-bar-item w3-button w3-padding-large w3-hover-blue-grey">
<i class="fa fa-user fa-2x"></i>
<p>ABOUT</p>
</a>
<a href="#assignments" class="w3-bar-item w3-button w3-padding-large w3-hover-blue-grey">
<i class="fa fa-globe aria-hidden='true' fa-2x"></i>
<p>SWE-645</p>
</a>
<a href="#contact" class="w3-bar-item w3-button w3-padding-large w3-hover-blue-grey">
<i class="fa fa-phone-square fa-2x"></i>
<p>CONTACT</p>
</a>
</nav>
</nav>
<!-- Overlay effect when opening sidebar on small screens -->
<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>
<!-- Image on Header -->
<div class="bgimg1 w3-display-container"></div>
<!-- !PAGE CONTENT! -->
<div class="w3-main" style="margin-left:120px;margin-right: 30px">
<!-- Introduction -->
<div class="w3-row" style="padding-top: 50px;padding-bottom: 20px;">
<div class="w3-padding">
<h1 class="w3-center" style="font-size: 50px; letter-spacing: 3px;"><b>Ramaswamy Iyappan</b></h1>
<svg viewBox="0 0 1320 300">
<text x="50%" y="35%" dy=".20em" text-anchor="middle">Data Scientist</text>
</svg>
<br><br>
<center><hr style="height: 3px; width: 22%; color: #000; background-color: darkgoldenrod;"></center>
<p id="about" class="w3-padding-16" style="font-size: 18px; margin-left: 100px; margin-right: 50px; text-align: -webkit-center;">Hey there! Thank you for visiting my website. I'm more than happy to introduce myself.
<br><br>I'm Ramaswamy Iyappan, currently a Graduate Student pursuing Masters in Computer Science at George Mason University.
I'm originally from Chennai, India where I completed my Undergraduate at Vels University and this is my second semester at GMU. My field of interest include Data Mining & Machine Learning,
and I would like to work with Python, Java, C and HTML-CSS.</p>
</div>
<hr>
<!-- Left-side Main Image -->
<div class="w3-col m6 w3-center w3-padding-large">
<img src="image2.jpg" class="w3-round w3-image w3-hover-opacity-off" alt="Photo of Me" width="500" height="333">
<div class="w3-panel" style="margin-top: -5px; margin-bottom: 5px; margin-left: -10px; width: inherit; height: 20px;">
<p><i>Ramaswamy Iyappan</i></p>
</div>
<div class="w3-panel" style=" margin-top: -25px; margin-bottom: 5px; margin-right: -22px; width: inherit; float: right; height: 20px;">
<p><i class="fa fa-map-marker"> Washington D.C.</i></p>
</div>
</div>
<!-- About Me -->
<div class="w3-col m6 w3-hide-small w3-padding-large about" style="width: 47.5%; text-align: justify">
<h2 style="padding-bottom: 10px;"><b>About Me</b></h2>
<p>From when I was a little kid, to today, I have got into a close-to-heart connection with Music. Ofcourse, everyone loves music, but my story was different. I've been playing Piano and still exploring Music since my early childhood days.
By now, I've completed all 8 grades in Grand Piano and 6 grades in Music Theory. I even wanted to share this knowledge that I've gained all these years and so I stepped into conducting music classes 5 years back.</p>
<p>Speaking about Academics on the other side, I always wanted to pursue Masters in Computer Science right from my High school and finally here I am making it come true at GMU.
Sooner, I became very interested in learning in-depth about Mining Datasets, AI and Machine Learning algorithms. The Masters Degree made me develop industry-oriented skills and strategic thinking about these concepts which keeps me more engaged and inspired.</p>
<p>A message to my fellow students, "There is no tomorrow. Let's keep on giving our best and build it ourselves!."</p>
</div>
</div>
<hr>
<!-- Skills Section -->
<div class="bgimg3 w3-display-container" style="margin-left: -50px;margin-right: -30px;" id="skills">
<div class="w3-display-middle w3-padding-large w3-border w3-wide w3-text-light-grey w3-center">
<h4 class="w3-hide-medium w3-hide-small w3-xxxlarge">SKILLS</h4>
</div>
</div><br>
<div class="w3-row-padding" style="margin:0 -16px">
<div class="w3-third w3-margin-bottom">
<ul class="w3-ul w3-border w3-white w3-center w3-opacity w3-hover-opacity-off">
<li class="w3-black w3-xlarge w3-padding-32">Programming</li>
<li class="w3-padding-16">Python</li>
<li class="w3-padding-16">C++</li>
<li class="w3-padding-16">C</li>
<li class="w3-padding-16">Java</li>
</ul>
</div>
<div class="w3-third w3-margin-bottom">
<ul class="w3-ul w3-border w3-white w3-center w3-opacity w3-hover-opacity-off">
<li class="w3-teal w3-xlarge w3-padding-32">Web Development</li>
<li class="w3-padding-16">HTML</li>
<li class="w3-padding-16">CSS</li>
<li class="w3-padding-16">Javascript</li>
<li class="w3-padding-16">PHP</li>
</ul>
</div>
<div class="w3-third">
<ul class="w3-ul w3-border w3-white w3-center w3-opacity w3-hover-opacity-off">
<li class="w3-black w3-xlarge w3-padding-32">Database</li>
<li class="w3-padding-16">MySQL</li>
<li class="w3-padding-16">MS Office</li>
<li class="w3-padding-16">.NET</li>
<li class="w3-padding-16">NetBeans IDE</li>
</ul>
</div>
</div>
<p>
<button class="w3-button w3-dark-grey w3-padding-large w3-margin-top w3-margin-bottom">
<i class="fa fa-download w3-margin-right"></i>Download Resume
</button>
</p>
<hr>
<!-- Assignments Section -->
<div class="bgimg2 w3-display-container" style="margin-left: -50px;margin-right: -30px;" id="assignments">
<div class="w3-display-middle w3-padding-large w3-border w3-wide w3-text-light-grey w3-center">
<h4 class="w3-hide-medium w3-hide-small w3-xxxlarge">SWE-645</h4>
</div>
</div>
<br>
<div class="w3-container w3-padding">
<center>
<h2><b>Assignments</b></h2><br>
<!-- <p>Nothing has been posted yet. Try checking later.</p> -->
<a href="hw1_CSdept.html"><img src="csdeptlogo.png" height="260px" width="350px"></a>
<a href="https://ec2-52-86-87-37.compute-1.amazonaws.com/Survey/survey.html"><img src="surveylogo.jpg" height="260px" width="350px" style="margin-left: 25px"></a>
</center>
</div>
</div>
<hr>
<!-- Contact Section -->
<section style="margin: 0;padding: 0;background-color: #000;padding-bottom: 45px;margin-left: 0px;">
<h1 id="contact" class="section-header">Contact</h1>
<div class="contact-wrapper">
<!-- Left contact page -->
<form id="contact-form" class="form-horizontal" role="form">
<div class="form-group">
<div class="col-sm-12">
<input type="text" class="form-control" id="name" placeholder="NAME" name="name" value="" required>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input type="email" class="form-control" id="email" placeholder="EMAIL" name="email" value="" required>
</div>
</div>
<textarea class="form-control" rows="10" placeholder="MESSAGE" name="message" required></textarea>
<button class="btn btn-primary send-button" id="submit" type="submit" value="SEND">
<div class="alt-send-button">
<i class="fa fa-paper-plane w3-padding w3-center"></i><span class="send-text">SEND</span>
</div>
</button>
</form>
<!-- Right contact page -->
<div class="direct-contact-container">
<ul class="contact-list">
<li class="list-item"><i class="fa fa-map-marker fa-2x"><span class="contact-text place">Fairfax, Virginia</span></i></li>
<li class="list-item"><i class="fa fa-phone fa-2x"><span class="contact-text phone"><a href="tel:1-212-555-5555" title="Give me a call">(571) 478-3766</a></span></i></li>
<li class="list-item"><i class="fa fa-envelope fa-2x"><span class="contact-text gmail"><a href="mailto:#" title="Send me an email">riyappan@gmu.edu</a></span></i></li>
</ul>
<hr>
<ul class="social-media-list">
<li><a href="#" target="_blank" class="contact-icon">
<i class="fa fa-github" aria-hidden="true"></i></a>
</li>
<li><a href="#" target="_blank" class="contact-icon">
<i class="fa fa-facebook-square" aria-hidden="true"></i></a>
</li>
<li><a href="#" target="_blank" class="contact-icon">
<i class="fa fa-linkedin" aria-hidden="true"></i></a>
</li>
<li><a href="#" target="_blank" class="contact-icon">
<i class="fa fa-instagram" aria-hidden="true"></i></a>
</li>
</ul>
<hr>
</div>
</div>
</section>
<!-- Footer -->
<footer class="w3-center w3-dark-gray w3-padding-64 w3-hover-opacity-off">
<a href="#" class="w3-button w3-hover-black w3-hover-shadow w3-blue-gray"><i class="fa fa-arrow-up w3-margin-right"></i>To the top</a>
</footer>
<script>
// Script to open and close sidebar
function w3_open() {
document.getElementById("mySidebar").style.display = "block";
document.getElementById("myOverlay").style.display = "block";
}
function w3_close() {
document.getElementById("mySidebar").style.display = "none";
document.getElementById("myOverlay").style.display = "none";
}
</script>
</body>
</html>