74 lines
3.4 KiB
HTML
74 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width">
|
|
<title>Naman Sood</title>
|
|
<meta name="description" content="Developer and technology enthusiast who's never gonna give you up.">
|
|
<meta name="keywords" content="nsood, nfool, naman sood, nachloride, nsdcars5, namansood, namandoesnotpanic, tendstofortytwo">
|
|
<meta property="og:url" content="https://nsood.in">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="Naman Sood">
|
|
<meta property="og:description" content="Developer and technology enthusiast who's never gonna give you up.">
|
|
<meta property="og:image" content="https://nsood.in/screenshot.php">
|
|
<meta name="twitter:creator" content="@tendstofortytwo">
|
|
<link rel="stylesheet" type="text/css" href="fonts/css/nunito.css">
|
|
<link rel="stylesheet" type="text/css" href="fonts/css/fontawesome.min.css">
|
|
<link rel="stylesheet" type="text/css" href="css/style.css">
|
|
</head>
|
|
<body>
|
|
<section id="home" class="main">
|
|
<!-- empty alt attribute informs screen readers that background graphic is purely decorative and should be ignored -->
|
|
<canvas id="bg" alt=""></canvas>
|
|
<div class="text-container">
|
|
<h1>Hi, I’m Naman.</h1>
|
|
<h3>I’m a<span class="age"> twenty one</span> year-old who's fond of <em>coffee</em>, <em>math</em>, <em>writing</em>, <em>cars</em>, <button class="among">among</button> other things. I also enjoy <em>programming</em> enough to do that for a living. I'm currently studying <em>computer science</em> at the <em>University of Waterloo</em>.</h3>
|
|
<h3>You can click to see my <a href="/resume.pdf">resume</a>, visit my <a href="https://prose.nsood.in">blog</a>, or check out ways to contact me below.</h3>
|
|
<div class="contact-methods">
|
|
<a href="mailto:mail@nsood.in" class="contact-method" aria-label="Email">
|
|
<i class="email"></i>
|
|
<p class="detail">mail@nsood.in</p>
|
|
</a>
|
|
<a href="https://tech.lgbt/@tendstofortytwo" class="contact-method" aria-label="Mastodon" rel="me">
|
|
<i class="fab fa-mastodon"></i>
|
|
<p class="detail">@tendstofortytwo@tech.lgbt</p>
|
|
</a>
|
|
<a href="https://twitter.com/tendstofortytwo" class="contact-method" aria-label="Twitter">
|
|
<i class="fab fa-twitter"></i>
|
|
<p class="detail">@tendstofortytwo</p>
|
|
</a>
|
|
<a href="https://linkedin.com/in/namansood" class="contact-method" aria-label="LinkedIn">
|
|
<i class="fab fa-linkedin-in"></i>
|
|
<p class="detail">Naman Sood</p>
|
|
</a>
|
|
<a href="https://github.com/tendstofortytwo" class="contact-method" aria-label="GitHub">
|
|
<i class="fab fa-github"></i>
|
|
<p class="detail">tendstofortytwo</p>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<dialog class="change-color-dialog">
|
|
<h4>If you could pick any color,<br> what color would you pick?</h4>
|
|
<form method="dialog">
|
|
<div class="radio-buttons"></div>
|
|
<input type="button" value="save" id="color-change-save">
|
|
<input type="submit" value="exit">
|
|
</form>
|
|
</dialog>
|
|
<button class="change-color-button" aria-label="change color">
|
|
<i class="fas fa-paint-brush"></i>
|
|
</button>
|
|
<noscript>
|
|
<style>
|
|
button.change-color-button { display: none; }
|
|
</style>
|
|
</noscript>
|
|
</section>
|
|
|
|
<!-- I guess it doesn't make sense for a purely visual easter egg to be visible to screen readers..? -->
|
|
<div class="clapper" aria-hidden="true">👏👏👏</div>
|
|
|
|
<script src="js/script.js"></script>
|
|
<script src="fonts/attribution.js"></script>
|
|
</body>
|
|
</html>
|