update system, swap to bunny fonts
This commit is contained in:
parent
f7d1aaa61a
commit
e0732619c4
14 changed files with 355 additions and 114 deletions
|
|
@ -1,9 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<title>noe pfp generator</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible&display=swap"
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<script
|
||||
|
|
|
|||
|
|
@ -1,15 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<title>base32 color</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible&display=swap"
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<script
|
||||
src="https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/3.4.2/gl-matrix-min.js"
|
||||
referrerpolicy="no-referrer"
|
||||
></script>
|
||||
<style>
|
||||
:root {
|
||||
font-family: "Atkinson Hyperlegible", sans-serif;
|
||||
|
|
|
|||
64
controls/index.html
Normal file
64
controls/index.html
Normal file
|
|
@ -0,0 +1,64 @@
|
|||
<!DOCTYPE html>
|
||||
<title>noe control panel</title>
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<script
|
||||
src="https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/3.4.2/gl-matrix-min.js"
|
||||
referrerpolicy="no-referrer"
|
||||
></script>
|
||||
<style>
|
||||
:root {
|
||||
font-family: "Atkinson Hyperlegible", sans-serif;
|
||||
background-color: black;
|
||||
color: #efefef;
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
opacity: 0.2;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="preconnect">
|
||||
<form>
|
||||
<label for="publickey">Public Key</label>
|
||||
<input id="publickey" />
|
||||
<input type="submit" value="Connect" />
|
||||
<button>Generate</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="hidden" id="controls"></div>
|
||||
|
||||
<script defer async>
|
||||
const setPkForm = (pk) => (document.querySelector("#publickey").value = pk);
|
||||
|
||||
const boot = () => {
|
||||
const existingKey = localStorage.getItem("keypair");
|
||||
if (existingKey) {
|
||||
const { publicKey, privateKey } = JSON.parse(existingKey);
|
||||
setPkForm(publicKey);
|
||||
}
|
||||
};
|
||||
|
||||
const generateKeys = async () => {
|
||||
await crypto.subtle.generateKey(
|
||||
{
|
||||
name: "ECDH",
|
||||
namedCurve: "P-384",
|
||||
},
|
||||
false,
|
||||
["encrypt", "decrypt"]
|
||||
);
|
||||
};
|
||||
|
||||
setTimeout(boot, 0);
|
||||
</script>
|
||||
|
|
@ -1,8 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible&display=swap"
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8" />
|
||||
<title>noe</title>
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<style>
|
||||
:root {
|
||||
font-family: "Atkinson Hyperlegible", sans-serif;
|
||||
--l0: #1b1f21;
|
||||
--l1: #441452;
|
||||
--l2: #752565;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<title>how to: noe's pronouns</title>
|
||||
<style>
|
||||
:root {
|
||||
font-family: "Atkinson Hyperlegible", sans-serif;
|
||||
--l0: #1b1f21;
|
||||
--l1: #441452;
|
||||
--l2: #752565;
|
||||
|
|
|
|||
362
system.html
362
system.html
|
|
@ -1,121 +1,293 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8" />
|
||||
<title>The Lightrunner System</title>
|
||||
<link rel="preconnect" href="https://fonts.bunny.net" />
|
||||
<link
|
||||
href="https://fonts.bunny.net/css?family=atkinson-hyperlegible:400,400i,700,700i"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<style>
|
||||
:root {
|
||||
--l0: #1b1f21;
|
||||
--l1: #441452;
|
||||
--l2: #752565;
|
||||
--l3: #ce2a66;
|
||||
--l4: #ce9bb7;
|
||||
--l5: #fdf4f4;
|
||||
--gr: #25dcc5;
|
||||
--top: #d9073b;
|
||||
--mid-top: #40b39a;
|
||||
--mid: #658e85;
|
||||
--mid-half: rgba(101, 142, 133, 0.5);
|
||||
--bottom: #0c100f;
|
||||
--floor: #040504;
|
||||
background-color: var(--bottom);
|
||||
color: var(--mid);
|
||||
line-height: 1.6;
|
||||
font-family: "Atkinson Hyperlegible", sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--l0);
|
||||
color: var(--l5);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: var(--top);
|
||||
}
|
||||
|
||||
.member {
|
||||
margin-bottom: 0.5em;
|
||||
|
||||
table {
|
||||
min-width: 500px;
|
||||
width: 40vw;
|
||||
border: 1px solid var(--floor);
|
||||
}
|
||||
td {
|
||||
border: 1px solid var(--mid-half);
|
||||
text-align: center;
|
||||
padding: 0.6em;
|
||||
}
|
||||
.name {
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
color: var(--l3);
|
||||
span {
|
||||
color: var(--member-color);
|
||||
}
|
||||
i {
|
||||
font-family: sans-serif;
|
||||
margin-left: 1em;
|
||||
}
|
||||
}
|
||||
.avatar {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background-image: var(--image-url);
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
border: 0 solid var(--member-color);
|
||||
border-bottom-width: 3px;
|
||||
border-right-width: 3px;
|
||||
}
|
||||
.desc {
|
||||
word-wrap: break-word;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.one {
|
||||
color: var(--l4);
|
||||
}
|
||||
|
||||
._3pp {
|
||||
color: var(--gr);
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-top: 3em;
|
||||
}
|
||||
|
||||
p.head {
|
||||
background-color: var(--l1);
|
||||
border: 1px solid var(--l2);
|
||||
display: inline-block;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
main {
|
||||
max-width: 960px;
|
||||
margin: 2em;
|
||||
border: 1px solid #988;
|
||||
padding: 1.5em;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-color: #555;
|
||||
margin: 2em 40%;
|
||||
}
|
||||
|
||||
.color-dot {
|
||||
display: inline-block;
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
background-color: var(--dot);
|
||||
border-radius: 100%;
|
||||
border: 3px solid var(--l4);
|
||||
position: relative;
|
||||
top: 0.4em;
|
||||
a {
|
||||
color: var(--mid-top);
|
||||
}
|
||||
</style>
|
||||
<main>
|
||||
<h1>the lightrunner system //</h1>
|
||||
<hr />
|
||||
<h2>
|
||||
<div class="color-dot" style="--dot: var(--l5)"></div>
|
||||
noe (the doll) (it/its, 3rd person)
|
||||
</h2>
|
||||
<h1>lightrunner system (<span class="red">光Rsys</span>)</h1>
|
||||
<p>known system properties of doll 41666</p>
|
||||
|
||||
<section>
|
||||
<h2>system member processes</h2>
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: var(--top); --image-url: url('/yay/noe.png')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td class="name"><span>noe</span> <i>/noʊiː/</i></td>
|
||||
<td>41666-𝛼</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
Combat Doll [<a href="https://pluralpedia.org/w/Primary_Fronter"
|
||||
>Primary Fronter</a
|
||||
>] [<a href="https://pluralpedia.org/w/Technician">Technician</a>]
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">it/its, that one, dolly (avoid "you")</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>
|
||||
<a href="https://sapphic.engineer/noe" rel="me">@noe@sapphic.engineer</a
|
||||
><br />
|
||||
this one is 41666, or noe! it is a doll, a silly robot girl who
|
||||
lives to serve its witch!! may preach about the void. may eat you.
|
||||
</p>
|
||||
<p>
|
||||
noe is the primary fronter. a known doll numbered <code>41666</code>,
|
||||
registered to hideri. it may have been specced into combat but prefers less
|
||||
physical identity or existence. noe builds all the cool tech stuff.
|
||||
noe is extremely technical, both in computing and in decoding its
|
||||
system dynamics,,, but what's the difference :3
|
||||
</p>
|
||||
<hr />
|
||||
<h2>
|
||||
<div class="color-dot" style="--dot: var(--l3)"></div>
|
||||
hideri (the witch) (she/her, it/its)
|
||||
</h2>
|
||||
<p>⚠️ noe is a high-class threat to humans. ⚠️</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: #b89524; --image-url: url('/yay/hide.jpg')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td colspan="2" class="name"><span>hide</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">Combat Witch [<a href="">Protector</a>]</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">she/her, it/its</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>
|
||||
<a href="https://porcelain.doll.repair/@hid" rel="me"
|
||||
>@hid@porcelain.doll.repair</a
|
||||
I'm the oldest running member of the system, I help keep things in
|
||||
check, and ensure all dolls are well tended to! I'm strongly
|
||||
interested in psychological horror as a genre, as well as sharing
|
||||
our mindspaces with any willing to listen~
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: rgb(6, 69, 85); --image-url: url('/yay/saya.jpg')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td colspan="2" class="name"><span>sayaka</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
Catmoth [<a href="https://pluralpedia.org/w/Librarian">Librarian</a
|
||||
>] [<a href="https://pluralpedia.org/w/Overrider">Overrider</a>]
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">she/her</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>
|
||||
Hi... I'm saya, a very soft kittygirl moththing. Requires pats at
|
||||
all times!!! I'm addicted to anything mechanical and technical,
|
||||
and loves getting our hands dirty.
|
||||
</p>
|
||||
<p>I'm pretty quiet, please be patient with me!</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: #08b69f; --image-url: url('/yay/ethyl.png')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td colspan="1" class="name"><span>ethyl</span> <i>/eθəl/</i></td>
|
||||
<td>41666-𝜔</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
Slime [<a href="https://pluralpedia.org/w/Chaosnaut">Chaosnaut</a>]
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">it/its (avoid "you")</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>slime. poisonous. will fight a black hole. and win.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: #ff00bf; --image-url: url('/yay/aki.jpg')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td colspan="1" class="name"><span>aki</span></td>
|
||||
<td>41666-𝛾</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">Combat Doll</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">it/its, that one, dolly (avoid "you")</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>
|
||||
this one is 41666-𝛾 or aki. it is not sure who it is yet. noe's
|
||||
voidspace is aki's nullspace. it's different. maybe.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<h3>retired system member processes</h3>
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: #303946; --image-url: url('/yay/ayanami.jpg')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td colspan="2" class="name"><span>ayanami</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">Mech Pilot</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">she/her</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>
|
||||
<i
|
||||
>a mech pilot, shattered by a cocktail of drugs and self-hatred.
|
||||
she fell out of her seat, sliced in two.</i
|
||||
>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div
|
||||
class="member"
|
||||
style="--member-color: #a84e78; --image-url: url('/yay/kata.png')"
|
||||
>
|
||||
<table>
|
||||
<tr>
|
||||
<td rowspan="3" class="avatar"></td>
|
||||
<td colspan="2" class="name"><span>kata</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
? [<a href="https://pluralpedia.org/w/Trauma_holder"
|
||||
>Trauma Holder</a
|
||||
>] [<a href="https://pluralpedia.org/w/Original">Original</a>]
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">she/her</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" class="desc">
|
||||
<p>
|
||||
hideri is the oldest system member. a witch, hypnotist, and Doll User. she
|
||||
built noe from the ashes of the lightrunner's path. likes to use noe to
|
||||
create tools to better control mechanisms, or just for fun.
|
||||
<i
|
||||
>no matter what we write here, this girl deserves more than she
|
||||
got. she rests well with the void.</i
|
||||
>
|
||||
</p>
|
||||
<hr />
|
||||
<h2>
|
||||
<div class="color-dot" style="--dot: var(--gr)"></div>
|
||||
sayaka (the librarian) (she/her)
|
||||
</h2>
|
||||
<p>
|
||||
sayaka is sayaka. a quiet girl that helps us store vast knowledge and
|
||||
intuition where it is otherwise missing. failed engineering school for
|
||||
fighting a student that brought a flashlight to lecture. maybe a moth.
|
||||
</p>
|
||||
<hr />
|
||||
<h2>
|
||||
<div class="color-dot" style="--dot: #9bf3ff"></div>
|
||||
ethyl (slime) (it/its, slime)
|
||||
</h2>
|
||||
<p>what? is slime. very empty, yet completely full.</p>
|
||||
<hr />
|
||||
<hr />
|
||||
<hr />
|
||||
<p>rest in the light, ayanami & kata. both found Stillness.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
|
|
|||
BIN
yay/aki.jpg
Normal file
BIN
yay/aki.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 108 KiB |
BIN
yay/ayanami.jpg
Normal file
BIN
yay/ayanami.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 121 KiB |
BIN
yay/ethyl.png
Normal file
BIN
yay/ethyl.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 159 KiB |
BIN
yay/hide.jpg
Normal file
BIN
yay/hide.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 178 KiB |
BIN
yay/kata.png
Normal file
BIN
yay/kata.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 529 KiB |
BIN
yay/noe.png
Normal file
BIN
yay/noe.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
BIN
yay/saya.jpg
Normal file
BIN
yay/saya.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
Loading…
Add table
Reference in a new issue