Initial commit
commit
7194065af5
|
|
@ -0,0 +1,3 @@
|
||||||
|
# bio.char.lt
|
||||||
|
|
||||||
|
bio site for putting in my social profiles
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,39 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Rouna';
|
||||||
|
src: url('/assets/rouna/rouna-bold-webfont.eot');
|
||||||
|
src: url('/assets/rouna/rouna-bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('/assets/rouna/rouna-bold-webfont.woff2') format('woff2'),
|
||||||
|
url('/assets/rouna/rouna-bold-webfont.woff') format('woff'),
|
||||||
|
url('/assets/rouna/rouna-bold-webfont.ttf') format('truetype');
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Rouna';
|
||||||
|
src: url('/assets/rouna/rouna-medium-webfont.eot');
|
||||||
|
src: url('/assets/rouna/rouna-medium-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('/assets/rouna/rouna-medium-webfont.woff2') format('woff2'),
|
||||||
|
url('/assets/rouna/rouna-medium-webfont.woff') format('woff'),
|
||||||
|
url('/assets/rouna/rouna-medium-webfont.ttf') format('truetype');
|
||||||
|
font-weight: 500;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Rouna';
|
||||||
|
src: url('/assets/rouna/rouna-regular-webfont.eot');
|
||||||
|
src: url('/assets/rouna/rouna-regular-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('/assets/rouna/rouna-regular-webfont.woff2') format('woff2'),
|
||||||
|
url('/assets/rouna/rouna-regular-webfont.woff') format('woff'),
|
||||||
|
url('/assets/rouna/rouna-regular-webfont.ttf') format('truetype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Noto Color Emoji';
|
||||||
|
src: url('/assets/noto-color-emoji/NotoColorEmoji-Regular.ttf') format('truetype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,111 @@
|
||||||
|
:root {
|
||||||
|
--bg-col: #121212;
|
||||||
|
--fg-col: #ffffff;
|
||||||
|
--accent-col: rgb(255, 167, 248);
|
||||||
|
--accent-col-2: rgb(255, 93, 241);
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
color-scheme: dark;
|
||||||
|
|
||||||
|
font-family: "Rouna", 'Noto Color Emoji', sans-serif;
|
||||||
|
font-size: 14pt;
|
||||||
|
|
||||||
|
background-color: var(--bg-col);
|
||||||
|
color: var(--fg-col);
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
max-width: 36em;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
h2,
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
margin: 1em 0;
|
||||||
|
padding: 1em 1.618em;
|
||||||
|
border-radius: 1em;
|
||||||
|
border: 2px solid var(--fg-col);
|
||||||
|
box-sizing: content-box;
|
||||||
|
}
|
||||||
|
main > :first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
main > :last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
padding-bottom: 0.5em;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
border-bottom: 1px dashed #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
|
|
||||||
|
font-size: 12pt;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
margin-top: 1em;
|
||||||
|
padding-top: 0.5em;
|
||||||
|
|
||||||
|
border-top: 1px dashed #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
section {
|
||||||
|
margin: 0.5em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0.5em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul, ol {
|
||||||
|
margin: 1em;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--accent-col);
|
||||||
|
text-decoration: none;
|
||||||
|
border-bottom: 1px solid var(--accent-col);
|
||||||
|
|
||||||
|
transition: 0.2s;
|
||||||
|
transition-property: color border-color;
|
||||||
|
}
|
||||||
|
a:hover,
|
||||||
|
a:focus,
|
||||||
|
a:active {
|
||||||
|
color: var(--accent-col-2);
|
||||||
|
border-color: var(--accent-col-2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.inline-list {
|
||||||
|
list-style: none;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.inline-list li {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0;
|
||||||
|
padding-inline-end: 0.5ch;
|
||||||
|
}
|
||||||
|
.inline-list li + li {
|
||||||
|
border-inline-start: 2px solid white;
|
||||||
|
padding-inline-start: 0.5ch;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,103 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" prefix="og: http://ogp.me/ns#">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width" />
|
||||||
|
|
||||||
|
<title>charlotte ✨</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="/css/fonts.css" />
|
||||||
|
<link rel="stylesheet" href="/css/styles.css" />
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<main>
|
||||||
|
<header>
|
||||||
|
<h1>charlotte ✨</h1>
|
||||||
|
<p>
|
||||||
|
multi-specialist interdisciplinary technician. polyglot. silly rabbit
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section id="intro">
|
||||||
|
<p>
|
||||||
|
hi, i'm charlotte! i do multimedia projects with computers. that
|
||||||
|
includes:
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>software</li>
|
||||||
|
<li>electronic music</li>
|
||||||
|
<li>generative animations</li>
|
||||||
|
<li>visual effects</li>
|
||||||
|
<li>… and more!</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
i am also the founding director & chief everything officer at
|
||||||
|
<a href="https://lavender.software/">lavender software ltd</a>, where
|
||||||
|
we make software that is purple.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="pronouns">
|
||||||
|
<h2>my pronouns are:</h2>
|
||||||
|
|
||||||
|
<ul class="inline-list">
|
||||||
|
<li>
|
||||||
|
<a href="https://pronouns.within.lgbt/bun">bun/buns</a>
|
||||||
|
</li>
|
||||||
|
<li><a href="https://pronouns.within.lgbt/she">she/her</a></li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="software">
|
||||||
|
<h2>find my software:</h2>
|
||||||
|
|
||||||
|
<ul class="inline-list">
|
||||||
|
<li>
|
||||||
|
<a rel="me" href="https://github.com/char">github</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a rel="me" href="https://git.lavender.software/charlotte">
|
||||||
|
git.lavender.software
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="socials">
|
||||||
|
<h2>find me on the web:</h2>
|
||||||
|
|
||||||
|
<ul class="inline-list">
|
||||||
|
<li><a rel="me" href="https://twitter.com/bhop_art">twitter</a></li>
|
||||||
|
<li>
|
||||||
|
<a rel="me" href="https://soundcloud.com/char-lt">soundcloud</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a rel="me" href="https://trans.enby.town/charlotte">fediverse</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a rel="me" href="https://pet.bun.how">bluesky</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="blogs">
|
||||||
|
<h2>i write on these blogs:</h2>
|
||||||
|
|
||||||
|
<ul class="inline-list">
|
||||||
|
<li><a href="https://char.lt">char.lt</a></li>
|
||||||
|
<li><a href="https://hackery.site">hackery.site</a></li>
|
||||||
|
<li><a href="https://nullpt.rs">nullpt.rs</a></li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>charlotte som</p>
|
||||||
|
<p aria-hidden="true">🏳️⚧️ ΘΔ 🏴</p>
|
||||||
|
<p><a href="https://www.anticopyright.com">anti-copyright</a></p>
|
||||||
|
</footer>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue