feat: add initial index

This commit is contained in:
Anna 2022-08-29 05:46:23 -04:00
parent 23f09e4da9
commit 76ae43efd3
3 changed files with 73 additions and 2 deletions

11
css/index.css Normal file
View File

@ -0,0 +1,11 @@
main > article:first-child {
margin-top: 0;
}
main > article:last-child {
margin-bottom: 0;
}
article > header > hgroup {
margin-bottom: 0;
}

View File

@ -1,11 +1,53 @@
<!doctype html>
<html lang="en">
<html lang="en" data-theme="dark">
<head>
<meta charset="utf-8"/>
<title>Anna</title>
<link rel="stylesheet" href="/css/pico.min.css"/>
<link rel="stylesheet" href="/css/index.css"/>
<script defer src="/js/index.js"></script>
</head>
<body>
<h1>Hi</h1>
<main class="container">
<article>
<header>
<hgroup>
<h2>Hi, I'm Anna!</h2>
<h3>I make stuff on the internet.</h3>
</hgroup>
</header>
<div class="grid">
<div>
<p>
I like Rust, C#, and Python.
</p>
<ul>
<li>she/her</li>
<li>programmer</li>
<li>gay</li>
</ul>
</div>
<ul>
<li><a href="https://git.anna.lgbt/ascclemens">gitea</a></li>
<li><a href="https://git.sr.ht/~jkcclemens">sourcehut</a></li>
<li><a href="https://github.com/ascclemens">github</a></li>
<li><a href="javascript:void(0)" id="email-button">click to see email</a></li>
</ul>
</div>
</article>
</main>
<dialog id="modal">
<article>
<a id="email-close" aria-label="close" class="close"></a>
<p>
My email is <span id="email-text"></span>.
</p>
</article>
</dialog>
</body>
</html>

18
js/index.js Normal file
View File

@ -0,0 +1,18 @@
(function() {
function y(s) {
return s.replace(/[a-zA-Z]/g,(c)=>String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26));
}
document.getElementById('email-button').addEventListener('click', () => {
let email = 'si' + atob('dGVAYW4=') + 'na' + atob(y('L2kyoJIhpl5c')) + 'o';
let emailLink = document.createElement('a');
emailLink.setAttribute('href', `mailto:${email}`);
emailLink.innerText = email;
document.getElementById('email-text').replaceWith(emailLink);
document.getElementById('modal').setAttribute('open', '');
});
document.getElementById('email-close').addEventListener('click', () => {
document.getElementById('modal').removeAttribute('open');
});
})();