This commit is contained in:
Mira Kristipati 2024-02-07 10:44:26 -05:00
parent 253697ad15
commit 2f79146363
12 changed files with 1051 additions and 928 deletions

View file

@ -1,5 +1,8 @@
import { defineConfig } from "astro/config"; import { defineConfig } from "astro/config";
import mdx from "@astrojs/mdx"; import mdx from "@astrojs/mdx";
import nodejs from '@astrojs/node';
import { remarkReadingTime } from './remark-reading-time.mjs';
import { modifiedTime } from './remark-modified-time.mjs';
export default defineConfig({ export default defineConfig({
markdown: { markdown: {
@ -7,7 +10,12 @@ export default defineConfig({
shikiConfig: { shikiConfig: {
theme: "css-variables", theme: "css-variables",
}, },
remarkPlugins: [remarkReadingTime, modifiedTime],
}, },
adapter: nodejs({
mode: 'standalone'
}),
output: 'hybrid',
vite: { vite: {
build: { build: {
rollupOptions: { rollupOptions: {

View file

@ -21,14 +21,20 @@
}, },
"dependencies": { "dependencies": {
"@astrojs/check": "^0.2.0", "@astrojs/check": "^0.2.0",
"@astrojs/mdx": "^0.18.4", "@astrojs/markdown-remark": "^3.2.0",
"@astrojs/mdx": "^1.1.0",
"@astrojs/node": "^6.0.1",
"@astrojs/rss": "^3.0.0",
"accessible-astro-components": "^1.6.6", "accessible-astro-components": "^1.6.6",
"astro": "^2.10.15", "astro": "^3.2.0",
"astro-icon": "^0.8.1", "astro-icon": "^0.8.1",
"dayjs": "^1.11.10",
"highlight.js": "^11.8.0", "highlight.js": "^11.8.0",
"htmx.org": "^1.9.6", "htmx.org": "^1.9.6",
"mdast-util-to-string": "^4.0.0",
"npm-watch": "^0.11.0", "npm-watch": "^0.11.0",
"rollup": "^3.29.3", "reading-time": "^1.5.0",
"rollup": "^3.29.4",
"sass": "^1.68.0", "sass": "^1.68.0",
"typescript": "^5.2.2" "typescript": "^5.2.2"
} }

1365
pnpm-lock.yaml generated

File diff suppressed because it is too large Load diff

9
remark-modified-time.mjs Normal file
View file

@ -0,0 +1,9 @@
import { statSync } from "fs";
export function modifiedTime() {
return function (tree, file) {
const filepath = file.history[0];
const result = statSync(filepath);
file.data.astro.frontmatter.lastModified = result.mtime.toISOString();
};
}

12
remark-reading-time.mjs Normal file
View file

@ -0,0 +1,12 @@
import getReadingTime from 'reading-time';
import { toString } from 'mdast-util-to-string';
export function remarkReadingTime() {
return function (tree, { data }) {
const textOnPage = toString(tree);
const readingTime = getReadingTime(textOnPage);
// readingTime.text will give us minutes read as a friendly string,
// i.e. "3 min read"
data.astro.frontmatter.minutesRead = readingTime.text;
};
}

7
src/buttons/buttons.ts Normal file
View file

@ -0,0 +1,7 @@
const buttons = [
{
name: "88x31",
link: "https://cyber.dabamos.de/88x31/index.html",
image: "88x31.gif",
},
];

View file

@ -1,4 +1,5 @@
--- ---
import { buttons } from '@buttons/buttons'
const today = new Date(); const today = new Date();
let themeObj = await import("../../public/themes.json"); let themeObj = await import("../../public/themes.json");
let themes = new Map( let themes = new Map(
@ -51,7 +52,8 @@ themes.delete("default");
>CC BY-NC-SA 4.0</a >CC BY-NC-SA 4.0</a
> >
</div> </div>
<div class="buttons">
</div>
<!-- Theme Switcher box --> <!-- Theme Switcher box -->
<form style="display:inline-flex"> <form style="display:inline-flex">
<div class="form-group" style="display:inline-flex"> <div class="form-group" style="display:inline-flex">

View file

@ -0,0 +1,16 @@
---
export interface Props {
className: string;
href: string;
icon: string;
alt: string;
text: string;
}
const { className, href, icon, alt, text } = Astro.props;
---
<a class=`button ${className}` href={href} target="_blank" rel="noopener">
<img class="icon" src={icon} alt={alt} />
{text}
</a>
<br />

View file

@ -2,10 +2,20 @@
import BaseHead from "../components/BaseHead.astro"; import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro"; import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro"; import Footer from "../components/Footer.astro";
import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
const { minutesRead } = Astro.props.frontmatter
const { const {
frontmatter: { title, description, pubDate, image, author }, frontmatter: { title, description, pubDate, image, author },
} = Astro.props; } = Astro.props;
dayjs.extend(utc);
const lastModified = dayjs()
.utc(Astro.props.frontmatter.lastModified)
.format("YYYY-MM-DD HH:mm:ss UTC");
--- ---
<html lang="en"> <html lang="en">
@ -18,11 +28,12 @@ const {
<article> <article>
<div class="article-head"> <div class="article-head">
<h1 class="title">{title}</h1> <h1 class="title">{title}</h1>
<em>Written by: {author}</em> <em>Written by: {author}</em><br />
{minutesRead} <br />
Published on: <time>{lastModified}</time> <br />
{image && <img width={720} height={360} src={image} alt="" />}
</div> </div>
<div class="article-body"> <div class="article-body">
{image && <img width={720} height={360} src={image} alt="" />}
Published on: {pubDate && <time>{pubDate}</time>}
<hr /> <hr />
<slot /> <slot />
</div> </div>

View file

@ -1,53 +0,0 @@
---
import BaseHead from "../components/BaseHead.astro";
import Footer from "../components/Footer.astro";
const {
frontmatter: { title, description, pubDate, image, author },
} = Astro.props;
---
<html lang="en">
<head>
<BaseHead title={title} description={description} />
<style>
.title {
font-size: 2em;
margin: 0.25em 0 0;
}
hr {
border-top: 1px solid #ddd;
margin: 1rem 0;
}
</style>
</head>
<body>
<main>
<article>
<div class="article-head">
<h1 class="title">{title}</h1>
<em>Written by: {author}</em>
</div>
<div class="article-body">
{image && <img width={720} height={360} src={image} alt="" />}
Published on: {pubDate && <time>{pubDate}</time>}
<hr />
<slot />
</div>
</article>
</main>
<div class="footer-container">
<Footer />
</div>
<style>
html {
min-height: 100vh;
height: 100%;
}
time {
display: inline-block;
margin-top: 10px;
}
</style>
</body>
</html>

View file

@ -8,6 +8,8 @@ import "../styles/links/brands-custom.css";
import "../styles/terminal-css/main.css"; import "../styles/terminal-css/main.css";
import "../styles/links/global.css"; import "../styles/links/global.css";
import Footer from "../components/Footer.astro"; import Footer from "../components/Footer.astro";
import Social from "../components/Social.astro";
let description = let description =
"I don't know who you are or how you found this, but while you're here, feel free to add me everywhere"; "I don't know who you are or how you found this, but while you're here, feel free to add me everywhere";
--- ---
@ -46,14 +48,14 @@ document.getElementById(theme)?.setAttribute("selected", "true");
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
/> />
<!-- TODO: Favicon <!-- -->
-->
<link rel="icon" type="image/svg" href="/favicon.svg" /> <link rel="icon" type="image/svg" href="/favicon.svg" />
<!-- Dynamic text Size -->
<script> <script>
window.onload = () => { window.onload = () => {
Array.from(document.getElementsByClassName("button")).map((el) => { Array.from(document.getElementsByClassName("button")).map((el) => {
let magic = 400; let magic = 375;
if ( if (
el.innerText.length * el.innerText.length *
(Number(window.getComputedStyle(el).fontSize.slice(0, -2)) + (Number(window.getComputedStyle(el).fontSize.slice(0, -2)) +
@ -67,6 +69,19 @@ document.getElementById(theme)?.setAttribute("selected", "true");
}); });
}; };
</script> </script>
<style>
.button,
button {
height: 3rem;
width: 18rem;
font-size: 1.25rem;
font-weight: normal;
line-height: 3rem;
}
.button {
font-weight: normal;
}
</style>
</head> </head>
<body> <body>
@ -85,7 +100,10 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<!-- Title --> <!-- Title -->
<h1 class="logo"> <h1 class="logo">
ArgentumCation<br /><br /><sub>she/they</sub><br /><br /><br /> <a href="/" style="color: var(--primary-color);background: none">ArgentumCation</a>
<br /><br />
<sub>she/they</sub>
<br /><br /><br />
</h1> </h1>
<!-- Short Bio --> <!-- Short Bio -->
@ -95,136 +113,82 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<div class="grid"> <div class="grid">
<!-- Blog --> <!-- Blog -->
<a <Social
class="button button-microblog" className="button-microblog"
href="/" href="/"
target="_blank" icon="/links/images/icons/blog.svg"
rel="noopener" alt="Blog Logo"
> text="Blog"
<img />
class="icon"
src="/links/images/icons/blog.svg"
alt="Blog Logo"
/>Blog</a
>
<br />
<!-- GitHub --> <!-- GitHub -->
<a <Social
class="button button-github" className="button-github"
href="https://github.com/ArgentumCation" href="https://github.com/ArgentumCation"
target="_blank" icon="/links/images/icons/github.svg"
rel="noopener" alt="GitHub Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/github.svg"
alt="GitHub Logo"
/>ArgentumCation</a
>
<br />
<!-- Gitea --> <!-- Gitea -->
<a <Social
class="button button-gitea" className="button-gitea"
href="https://gitea.argentumcation.com/mira" href="https://gitea.argentumcation.com/mira"
target="_blank" icon="/links/images/icons/gitea.svg"
rel="noopener" alt="Gitea Logo"
> text="mira"
<img />
class="icon"
src="/links/images/icons/gitea.svg"
alt="Gitea Logo"
/>mira</a
>
<br />
<!-- Matrix --> <!-- Matrix -->
<a <Social
class="button button-matrix" className="button-matrix"
href="https://matrix.to/#/@argentumcation:cybre.space" href="https://matrix.to/#/@argentumcation:cybre.space"
target="_blank" icon="/links/images/icons/matrix.svg"
rel="noopener" alt="Matrix Logo"
> text="argentumcation:cybre.space"
<img />
class="icon"
src="/links/images/icons/matrix.svg"
alt="Matrix Logo"
/>@argentumcation:cybre.space</a
>
<br />
<!-- Twitter --> <!-- Twitter -->
<a <Social
class="button button-twit" className="button-twit"
href="https://twitter.com/ArgentumCation" href="https://twitter.com/ArgentumCation"
target="_blank" icon="/links/images/icons/twitter.svg"
rel="noopener" alt="Twitter Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/twitter.svg"
alt="Twitter Logo"
/>@ArgentumCation</a
>
<br />
<!-- Instagram --> <!-- Instagram -->
<a <Social
class="button button-instagram" className="button-instagram"
href="https://www.instagram.com/argentumcation/" href="https://www.instagram.com/argentumcation/"
target="_blank" icon="/links/images/icons/instagram.svg"
rel="noopener" alt="Instagram Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/instagram.svg"
alt="Instagram Logo"
/>@ArgentumCation</a
>
<br />
<!-- YouTube --> <!-- YouTube -->
<a <Social
class="button button-yt" className="button-yt"
href="https://www.youtube.com/@ArgentumCation" href="https://www.youtube.com/@ArgentumCation"
target="_blank" icon="/links/images/icons/youtube.svg"
rel="noopener" alt="YouTube Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/youtube.svg"
alt="YouTube Logo"
/>ArgentumCation</a
>
<br />
<!-- Discord --> <!-- Discord -->
<a <Social
class="button button-discord" className="button-discord"
href="http://discord.com/users/215902078747410433" href="http://discord.com/users/215902078747410433"
target="_blank" icon="/links/images/icons/discord.svg"
rel="noopener" alt="Discord Logo"
> text="argentumcation"
<img />
class="icon"
src="/links/images/icons/discord.svg"
alt="Discord Logo"
/>argentumcation</a
>
<br />
<!-- Twitch --> <!-- Twitch -->
<a <Social
class="button button-twitch" className="button-twitch"
href="https://www.twitch.tv/argentumcation" href="https://www.twitch.tv/argentumcation"
target="_blank" icon="/links/images/icons/twitch.svg"
rel="noopener" alt="Twitch Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/twitch.svg"
alt="Twitch Logo"
/>ArgentumCation</a
>
<br />
<!-- Spotify --> <!-- Spotify -->
<!-- <a class="button button-spotify" href="#" target="_blank" rel="noopener"> <!-- <a class="button button-spotify" href="#" target="_blank" rel="noopener">
@ -247,79 +211,49 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<br> --> <br> -->
<!-- Reddit --> <!-- Reddit -->
<a <Social
class="button button-reddit" className="button-reddit"
href="https://reddit.com/u/ArgentumCation" href="https://reddit.com/u/ArgentumCation"
target="_blank" icon="/links/images/icons/reddit.svg"
rel="noopener" alt="Reddit Logo"
> text="u/ArgentumCation"
<img />
class="icon"
src="/links/images/icons/reddit.svg"
alt="Reddit Logo"
/>/u/ArgentumCation</a
>
<br />
<!-- Mastodon --> <!-- Mastodon -->
<a <Social
class="button button-mastodon" className="button-mastodon"
href="https://tech.lgbt/@argentumcation" href="https://tech.lgbt/@argentumcation"
target="_blank" icon="/links/images/icons/mastodon.svg"
rel="me noopener" alt="Mastodon Logo"
> text="ArgentumCation@tech.lgbt"
<img />
class="icon"
src="/links/images/icons/mastodon.svg"
alt="Mastodon Logo"
/>@ArgentumCation@tech.lgbt</a
>
<br />
<!-- TikTok --> <!-- TikTok -->
<a <Social
class="button button-tiktok" className="button-tiktok"
href="tiktok.com/@argentumcation" href="tiktok.com/@argentumcation"
target="_blank" icon="/links/images/icons/tiktok.svg"
rel="noopener" alt="TikTok Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/tiktok.svg"
alt="TikTok Logo"
/>@ArgentumCation</a
>
<br />
<!-- Email --> <!-- Email -->
<a <Social
class="button button-default" className="button-default"
href="mailto:argentumcation(at)argentumcation.com" href="mailto:argentumcation(at)argentumcation.com"
target="_blank" icon="/links/images/icons/email.svg"
rel="noopener" alt="Email Icon"
> text="argentumcation@argentumcation.com"
<img />
class="icon"
src="/links/images/icons/email.svg"
alt="Email Icon"
/>argentumcation<i class="fa-light fa-at"></i>argentumcation.com</a
>
<br />
<!-- SoundCloud --> <!-- SoundCloud -->
<a <Social
class="button button-soundcloud" className="button-soundcloud"
href="https://soundcloud.com/argentumcation" href="https://soundcloud.com/argentumcation"
target="_blank" icon="/links/images/icons/soundcloud.svg"
rel="noopener" alt="SoundCloud Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/soundcloud.svg"
alt="SoundCloud Logo"
/>ArgentumCation</a
>
<br />
<!-- Telegram --> <!-- Telegram -->
<!-- <a class="button button-telegram" href="#" target="_blank" rel="noopener"> <!-- <a class="button button-telegram" href="#" target="_blank" rel="noopener">
@ -327,34 +261,22 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<br> --> <br> -->
<!-- Tumblr --> <!-- Tumblr -->
<a <Social
class="button button-tumb" className="button-tumb"
href="argentumcation" href="argentumcation"
target="_blank" icon="/links/images/icons/tumblr.svg"
rel="noopener" alt="Tumblr Logo"
> text="argentumcation.tumblr.com"
<img />
class="icon"
src="/links/images/icons/tumblr.svg"
alt="Tumblr Logo"
/>argentumcation.tumblr.com</a
>
<br />
<!-- Steam --> <!-- Steam -->
<a <Social
class="button button-steam" className="button-steam"
href="https://steamcommunity.com/id/argentumcation" href="https://steamcommunity.com/id/argentumcation"
target="_blank" icon="/links/images/icons/steam.svg"
rel="noopener" alt="Steam Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/steam.svg"
alt="Steam Logo"
/>ArgentumCation</a
>
<br />
<!-- PayPal--> <!-- PayPal-->
<!-- <a class="button button-paypal" href="#" target="_blank" rel="noopener"> <!-- <a class="button button-paypal" href="#" target="_blank" rel="noopener">
@ -362,19 +284,13 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<br> --> <br> -->
<!-- Bandcamp --> <!-- Bandcamp -->
<a <Social
class="button button-bandcamp" className="button-bandcamp"
href="https://argentumcation.bandcamp.com/" href="https://argentumcation.bandcamp.com/"
target="_blank" icon="/links/images/icons/bandcamp.svg"
rel="noopener" alt="Bandcamp Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons/bandcamp.svg"
alt="Bandcamp Logo"
/>ArgentumCation</a
>
<br />
<!-- Patreon --> <!-- Patreon -->
<!-- <a class="button button-patreon" href="#" target="_blank" rel="noopener"> <!-- <a class="button button-patreon" href="#" target="_blank" rel="noopener">
@ -397,33 +313,21 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<br> --> <br> -->
<!-- Cash App BTC --> <!-- Cash App BTC -->
<a <Social
class="button button-bitcoin" className="button-bitcoin"
href="bitcoin:1NzncEg3C2Q72vbArCMU4wN2yPTnx5GU2h" href="bitcoin:1NzncEg3C2Q72vbArCMU4wN2yPTnx5GU2h"
target="_blank" icon="images/icons/cash-app-btc.svg"
rel="noopener" alt="Cash App Logo"
> text="Bitcoin"
<img />
class="icon"
src="images/icons/cash-app-btc.svg"
alt="Cash App Logo"
/>Bitcoin</a
>
<br />
<a <Social
class="button button-ethereum" className="button-ethereum"
href="ethereum:0xAdb87d93BAFda19ef168891d76c944879E06a7bd" href="ethereum:0xAdb87d93BAFda19ef168891d76c944879E06a7bd"
target="_blank" icon="images/icons/ethereum.svg"
rel="noopener" alt="Cash App Logo"
> text="Ethereum"
<img />
class="icon"
src="images/icons/ethereum.svg"
alt="Cash App Logo"
/>Ethereum</a
>
<br />
<!-- OnlyFans --> <!-- OnlyFans -->
<!-- <a class="button button-onlyfans" href="#" target="_blank" rel="noopener"> <!-- <a class="button button-onlyfans" href="#" target="_blank" rel="noopener">
@ -451,75 +355,45 @@ document.getElementById(theme)?.setAttribute("selected", "true");
<br> --> <br> -->
<!-- Itch.io --> <!-- Itch.io -->
<a <Social
class="button button-itchio" className="button-itchio"
href="https://argentumcation.itch.io/" href="https://argentumcation.itch.io/"
target="_blank" icon="/links/images/icons-extended/itchio.svg"
rel="noopener" alt="Itch.io Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons-extended/itchio.svg"
alt="Itch.io Logo"
/>ArgentumCation</a
>
<br />
<!-- MAL --> <!-- MAL -->
<a <Social
class="button button-myanimelist" className="button-myanimelist"
href="https://myanimelist.net/profile/ArgentumCation" href="https://myanimelist.net/profile/ArgentumCation"
target="_blank" icon="/links/images/icons-extended/myanimelist.svg"
rel="noopener" alt="MAL Logo"
> text="ArgentumCation"
<img />
class="icon"
src="/links/images/icons-extended/myanimelist.svg"
alt="MAL Logo"
/>ArgentumCation</a
>
<br />
<!-- ArgenumCation PGP --> <!-- ArgenumCation PGP -->
<a <Social
class="button button-pgp" className="button-pgp"
href="http://keyserver.ubuntu.com/pks/lookup?op=get&search=0xdd8583a510deb949714ed847430c50ca90f98bbe" href="http://keyserver.ubuntu.com/pks/lookup?op=get&search=0xdd8583a510deb949714ed847430c50ca90f98bbe"
target="_blank" icon="/links/images/icons/gpg.svg"
rel="noopener" alt="GPG Logo"
> text="ArgentumCation PGP Key"
<img />
class="icon"
src="/links/images/icons/gpg.svg"
alt="GPG Logo"
/>ArgentumCation PGP Key</a
>
<br />
<!-- Mira Velturu PGP --> <!-- Mira Velturu PGP -->
<a <Social
class="button button-pgp" className="button-pgp"
href="https://keyserver.ubuntu.com/pks/lookup?op=get&search=0x6a10df52e755e8174cd5c4c18ed045d80561353b" href="https://keyserver.ubuntu.com/pks/lookup?op=get&search=0x6a10df52e755e8174cd5c4c18ed045d80561353b"
target="_blank" icon="/links/images/icons/gpg.svg"
rel="noopener" alt="GPG Logo"
> text="Mira Velturu PGP Key"
<img />
class="icon"
src="/links/images/icons/gpg.svg"
alt="GPG Logo"
/>Mira Velturu PGP Key</a
>
<br />
<!-- BlueSky--> <!-- BlueSky-->
<a <Social
class="button button-bluesky" className="button-bluesky"
href="https://bsky.app/profile/argentumcation.bsky.social" href="https://bsky.app/profile/argentumcation.bsky.social"
target="_blank" icon="/links/images/icons/bluesky.svg"
rel="noopener" alt="Bluesky Logo"
> text="argentumcation.bsky.social"
<img />
class="icon"
src="/links/images/icons/bluesky.svg"
alt="Bluesky Logo"
/>argentumcation.bsky.social</a
>
<br />
<br /> <br />
</div> </div>
<Footer /> <Footer />

View file

@ -0,0 +1,18 @@
import rss from '@astrojs/rss';
export function GET(context) {
return rss({
// `<title>` field in output xml
title: 'Buzzs Blog',
// `<description>` field in output xml
description: 'A humble Astronauts guide to the stars',
// Pull in your project "site" from the endpoint context
// https://docs.astro.build/en/reference/api-reference/#contextsite
site: context.site,
// Array of `<item>`s in output xml
// See "Generating items" section for examples using content collections and glob imports
items: [],
// (optional) inject custom xml
customData: `<language>en-us</language>`,
});
}