initial commit

This commit is contained in:
hippoz 2023-01-02 23:19:14 +02:00
commit 8bda86b24a
Signed by: hippoz
GPG key ID: 56C4E02A85F2FBED
5 changed files with 242 additions and 0 deletions

1
.gitignore vendored Normal file
View file

@ -0,0 +1 @@
*.html

BIN
Manrope[wght].woff2 Normal file

Binary file not shown.

67
build.js Normal file
View file

@ -0,0 +1,67 @@
const fs = require("node:fs/promises");
let meta;
const chooseFortune = () => {
const authors = Object.keys(meta.fortune);
const chosenAuthor = authors[Math.floor(Math.random()*authors.length)];
const fortunes = meta.fortune[chosenAuthor];
const chosenFortune = fortunes[Math.floor(Math.random()*fortunes.length)];
return {
text: chosenFortune,
name: chosenAuthor
};
};
const getPosts = async () => {
const posts = [];
for (let i = 0; i < meta.targets.length; i++) {
const t = meta.targets[i];
const data = JSON.parse(await fs.readFile(`./~${t}/manifest.rolsf.json`));
if (!data.document || data.document !== "xyz.rolsf.manifest.own.1") {
throw new Error(`unsupported own manifest for target: '${t}'`);
}
data.posts.forEach(post => {
post.user = t;
posts.push(post);
});
}
posts.sort((a, b) => b.unix_time - a.unix_time);
return posts;
};
const Post = ({ href="#", user, date, title }) =>
`<a href="${href}" class="post-link">
<span class="user">${user}</span>
<span class="date">${date}</span>
<span class="title">${title}</span>
</a>`;
const Fortune = ({text, name}) =>
`<div class="fortune"><span id="fortune-text">“${text}”</span><span id="fortune-name"> -- ${name}</span></div>`;
const MainPage = async () =>
`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>${meta.brand}</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<main>
<span class="h1">${meta.brand}</span>
${Fortune(chooseFortune())}
${(await getPosts()).map(Post).join("")}
</main>
</body>
</html>`;
const main = async () => {
meta = JSON.parse((await fs.readFile("./meta.json")));
await fs.writeFile("./main.html", await MainPage());
};
main();

35
meta.json Normal file
View file

@ -0,0 +1,35 @@
{
"document": "xyz.rolsf.manifest.meta.1",
"brand": "rolsf",
"targets": [],
"fortune": {
"hippoz": [
"and i somehow lost my pants, which caused me to be naked and run home, which may or may not have been caused by pulseaudio",
"🩲ronliv",
"forgot to mention i literally woke up laughing and continued laughing long after waking up",
"YOUR COMPUTER. IT NEVER TURNS OFF.",
"we can tie this into the idea of biocentrism",
"it spends 500ms in busy javascript computing some lovecraftian DOM tree",
"react literally has preemptive multitasking built in",
"yes!!! i need lib-xdg-gtk-gnome-flatpak-portal-systemd!!!! you dont understand!!!",
"have i been brainwashed by big terminal or something",
"im still debating whether or not it's a troll"
],
"alan": [
"What you view as insane is my sanity."
],
"rot": [
"make a song using samples from linux sound themes",
"the joke is so overdone you might as well just not post it"
],
"tuna": [
"this code is fucked up bruh"
],
"kemal": [
"6ac minecraft.jar",
"if someone gets the joke here, congrats",
"the joke literally went over from your head",
"sadly it's a troll"
]
}
}

139
style.css Normal file
View file

@ -0,0 +1,139 @@
@font-face {
font-family: "Manrope";
src: url("Manrope[wght].woff2") format('woff2');
font-weight: 125 950;
font-stretch: 75% 125%;
font-style: normal;
}
:root {
--bg-1: #dad4c9;
--bg: #eeeeee;
--fg-1: hsl(154, 0%, 40%);
--fg: #1c2420;
--space-unit: 1rem;
--space-xxs: calc(0.25 * var(--space-unit));
--space-xs: calc(0.5 * var(--space-unit));
--space-sm: calc(0.75 * var(--space-unit));
--space-md: calc(1.25 * var(--space-unit));
--space-lg: calc(2 * var(--space-unit));
--space-xl: calc(3.25 * var(--space-unit));
--space-xxl: calc(5.25 * var(--space-unit));
--h1: 3.052rem;
--h2: 2.441rem;
--h3: 1.953rem;
--h4: 1.563rem;
--h5: 1.25rem;
--small: 0.8rem;
}
body, html {
margin: 0;
padding: 0;
font-size: 100%;
background-color: var(--bg);
color: var(--fg);
font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
main {
margin: 30px auto;
width: clamp(200px, 100%, 800px);
}
/* text */
.h1 { font-size: var(--h1); }
.h2 { font-size: var(--h2); }
.h3 { font-size: var(--h3); }
.h4 { font-size: var(--h4); }
.h5 { font-size: var(--h5); }
.small { font-size: var(--small); }
/* card */
.card-accent {
padding: var(--space-md);
margin: var(--space-md);
margin-top: 0;
background-color: var(--bg-1);
border-radius: var(--space-md);
}
/* post */
.post-link {
display: block;
text-decoration: none;
color: currentColor;
margin-bottom: var(--space-lg);
}
.post-link .user {
font-weight: 500;
}
.post-link .date {
font-weight: normal;
color: var(--fg-1);
}
.post-link .title {
display: block;
font-size: var(--h4);
line-height: 0.9;
}
.post-link .title::after {
display: inline;
content: " ->";
color: var(--fg-1);
}
/* fortune */
@keyframes fortune-drop {
from {
opacity: 0;
visibility: hidden;
transform: translateY(-12px);
}
to {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
}
.fortune {
animation: fortune-drop 0.3s cubic-bezier(0.46,0.03,0.52,0.96) forwards;
display: block;
margin-bottom: var(--space-lg);
font-size: var(--h5);
}
#fortune-name {
color: var(--fg-1);
}
/* all */
* {
box-sizing: border-box;
}
p {margin-bottom: 1rem;}
h1, h2, h3, h4, h5 {
margin: var(--space-sm) 0 var(--space-xs);
font-family: 'Poppins', sans-serif;
font-weight: 400;
line-height: 1.3;
}
h1 {
margin-top: 0;
font-size: var(--h1);
}