-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
76 lines (76 loc) · 4.67 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Kusal Kithul-Godage</title>
<meta name="author" content="Kusal Kithul-Godage"/>
<meta name="description" content="Kusal Kithul-Godage's Personal Website"/>
<meta name="keywords" content="Kusal,Kithul,Godage,social,web,personal,projects,portfolio,contact"/>
<link rel="stylesheet" href="assets/reset.css"/>
<link rel="stylesheet" href="style.css"/>
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="icon" type="image/png" href="assets/favicon.png">
<script src="script.js" type="module"></script>
<noscript>
<link rel="stylesheet" href="noscript.css"/>
</noscript>
</head>
<body>
<div id="wrapper">
<div id="card">
<div id="front">
<header id="profile">
<img id="headshot" src="assets/profile.jpg" alt="Head shot of Kusal Kithul-Godage"/>
<h1 id="name">Kusal Kithul-Godage</h1>
<p id="tagline">Software Engineer</p>
</header>
<section>
<ul id="social-links">
<li>
<a href="https://www.linkedin.com/in/kusal-kithul-godage" target="_blank">
<svg aria-label="LinkedIn" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
<path d="M100.28 448H7.4V148.9h92.88zM53.79 108.1C24.09 108.1 0 83.5 0 53.8a53.79 53.79 0 0 1 107.58 0c0 29.7-24.1 54.3-53.79 54.3zM447.9 448h-92.68V302.4c0-34.7-.7-79.2-48.29-79.2-48.29 0-55.69 37.7-55.69 76.7V448h-92.78V148.9h89.08v40.8h1.3c12.4-23.5 42.69-48.3 87.88-48.3 94 0 111.28 61.9 111.28 142.3V448z"/>
</svg>
</a>
</li>
<li>
<a href="https://github.com/kusalk" target="_blank">
<svg aria-label="GitHub" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 512">
<path d="M186.1 328.7c0 20.9-10.9 55.1-36.7 55.1s-36.7-34.2-36.7-55.1 10.9-55.1 36.7-55.1 36.7 34.2 36.7 55.1zM480 278.2c0 31.9-3.2 65.7-17.5 95-37.9 76.6-142.1 74.8-216.7 74.8-75.8 0-186.2 2.7-225.6-74.8-14.6-29-20.2-63.1-20.2-95 0-41.9 13.9-81.5 41.5-113.6-5.2-15.8-7.7-32.4-7.7-48.8 0-21.5 4.9-32.3 14.6-51.8 45.3 0 74.3 9 108.8 36 29-6.9 58.8-10 88.7-10 27 0 54.2 2.9 80.4 9.2 34-26.7 63-35.2 107.8-35.2 9.8 19.5 14.6 30.3 14.6 51.8 0 16.4-2.6 32.7-7.7 48.2 27.5 32.4 39 72.3 39 114.2zm-64.3 50.5c0-43.9-26.7-82.6-73.5-82.6-18.9 0-37 3.4-56 6-14.9 2.3-29.8 3.2-45.1 3.2-15.2 0-30.1-.9-45.1-3.2-18.7-2.6-37-6-56-6-46.8 0-73.5 38.7-73.5 82.6 0 87.8 80.4 101.3 150.4 101.3h48.2c70.3 0 150.6-13.4 150.6-101.3zm-82.6-55.1c-25.8 0-36.7 34.2-36.7 55.1s10.9 55.1 36.7 55.1 36.7-34.2 36.7-55.1-10.9-55.1-36.7-55.1z"/>
</svg>
</a>
</li>
<li>
<a href="mailto:[email protected]" target="_blank">
<svg aria-label="Email" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48H48zM0 176V384c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V176L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z"/>
</svg>
</a>
</li>
</ul>
</section>
<button class="flip">
<svg aria-label="flip/rotate" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path id="rotate"
d="M48.5 224H40c-13.3 0-24-10.7-24-24V72c0-9.7 5.8-18.5 14.8-22.2s19.3-1.7 26.2 5.2L98.6 96.6c87.6-86.5 228.7-86.2 315.8 1c87.5 87.5 87.5 229.3 0 316.8s-229.3 87.5-316.8 0c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0c62.5 62.5 163.8 62.5 226.3 0s62.5-163.8 0-226.3c-62.2-62.2-162.7-62.5-225.3-1L185 183c6.9 6.9 8.9 17.2 5.2 26.2s-12.5 14.8-22.2 14.8H48.5z"/>
</svg>
</button>
</div>
<div id="back">
<section id="projects">
<div class="heading">
<h1>Projects</h1>
</div>
<p>Coming soon...</p>
</section>
<button class="flip">
<svg aria-label="flip/rotate" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<use href="#rotate"/>
</svg>
</button>
</div>
</div>
</div>
</body>
</html>