commit 7194065af541b010dd168ff24d89ea74dc2e83e2
Author: videogame hacker <half-kh-hacker@hackery.site>
Date:   Thu Nov 16 03:32:20 2023 +0000

    Initial commit

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..f85f442
--- /dev/null
+++ b/README.md
@@ -0,0 +1,3 @@
+# bio.char.lt
+
+bio site for putting in my social profiles
diff --git a/assets/noto-color-emoji/NotoColorEmoji-Regular.ttf b/assets/noto-color-emoji/NotoColorEmoji-Regular.ttf
new file mode 100644
index 0000000..bcb3964
Binary files /dev/null and b/assets/noto-color-emoji/NotoColorEmoji-Regular.ttf differ
diff --git a/assets/rouna/rouna-bold-webfont.eot b/assets/rouna/rouna-bold-webfont.eot
new file mode 100644
index 0000000..efd1d21
Binary files /dev/null and b/assets/rouna/rouna-bold-webfont.eot differ
diff --git a/assets/rouna/rouna-bold-webfont.ttf b/assets/rouna/rouna-bold-webfont.ttf
new file mode 100644
index 0000000..c87781a
Binary files /dev/null and b/assets/rouna/rouna-bold-webfont.ttf differ
diff --git a/assets/rouna/rouna-bold-webfont.woff b/assets/rouna/rouna-bold-webfont.woff
new file mode 100644
index 0000000..e65ab1d
Binary files /dev/null and b/assets/rouna/rouna-bold-webfont.woff differ
diff --git a/assets/rouna/rouna-bold-webfont.woff2 b/assets/rouna/rouna-bold-webfont.woff2
new file mode 100644
index 0000000..1f0dba7
Binary files /dev/null and b/assets/rouna/rouna-bold-webfont.woff2 differ
diff --git a/assets/rouna/rouna-medium-webfont.eot b/assets/rouna/rouna-medium-webfont.eot
new file mode 100644
index 0000000..4b06b7a
Binary files /dev/null and b/assets/rouna/rouna-medium-webfont.eot differ
diff --git a/assets/rouna/rouna-medium-webfont.ttf b/assets/rouna/rouna-medium-webfont.ttf
new file mode 100644
index 0000000..457f353
Binary files /dev/null and b/assets/rouna/rouna-medium-webfont.ttf differ
diff --git a/assets/rouna/rouna-medium-webfont.woff b/assets/rouna/rouna-medium-webfont.woff
new file mode 100644
index 0000000..06f0607
Binary files /dev/null and b/assets/rouna/rouna-medium-webfont.woff differ
diff --git a/assets/rouna/rouna-medium-webfont.woff2 b/assets/rouna/rouna-medium-webfont.woff2
new file mode 100644
index 0000000..2917045
Binary files /dev/null and b/assets/rouna/rouna-medium-webfont.woff2 differ
diff --git a/assets/rouna/rouna-regular-webfont.eot b/assets/rouna/rouna-regular-webfont.eot
new file mode 100644
index 0000000..1b84e0a
Binary files /dev/null and b/assets/rouna/rouna-regular-webfont.eot differ
diff --git a/assets/rouna/rouna-regular-webfont.ttf b/assets/rouna/rouna-regular-webfont.ttf
new file mode 100644
index 0000000..b165c51
Binary files /dev/null and b/assets/rouna/rouna-regular-webfont.ttf differ
diff --git a/assets/rouna/rouna-regular-webfont.woff b/assets/rouna/rouna-regular-webfont.woff
new file mode 100644
index 0000000..01906ae
Binary files /dev/null and b/assets/rouna/rouna-regular-webfont.woff differ
diff --git a/assets/rouna/rouna-regular-webfont.woff2 b/assets/rouna/rouna-regular-webfont.woff2
new file mode 100644
index 0000000..acf2eeb
Binary files /dev/null and b/assets/rouna/rouna-regular-webfont.woff2 differ
diff --git a/css/fonts.css b/css/fonts.css
new file mode 100644
index 0000000..8660f30
--- /dev/null
+++ b/css/fonts.css
@@ -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;
+}
diff --git a/css/styles.css b/css/styles.css
new file mode 100644
index 0000000..1b2c49e
--- /dev/null
+++ b/css/styles.css
@@ -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;
+}
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..8245cbc
--- /dev/null
+++ b/index.html
@@ -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>&hellip; and more!</li>
+        </ul>
+
+        <p>
+          i am also the founding director &amp; 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>