added lightyears font to feed
This commit is contained in:
@@ -13,7 +13,7 @@
|
||||
{#snippet pageButtons(currentIndex: number)}
|
||||
<div class="page-button-container blurred-background">
|
||||
{#if currentIndex == 1}
|
||||
<p class="page-button page-button-left">|</p>
|
||||
<p class="page-button page-button-left">x</p>
|
||||
{:else}
|
||||
<a class="page-button page-button-left page-button-clickable" href="?p={currentIndex - 1}"><</a>
|
||||
{/if}
|
||||
@@ -23,7 +23,7 @@
|
||||
{/each}
|
||||
|
||||
{#if currentIndex == data.maxPages}
|
||||
<p class="page-button page-button-right">|</p>
|
||||
<p class="page-button page-button-right">x</p>
|
||||
{:else}
|
||||
<a class="page-button page-button-right page-button-clickable" href="?p={currentIndex + 1}">></a>
|
||||
{/if}
|
||||
@@ -51,8 +51,11 @@
|
||||
|
||||
<TableOfContents />
|
||||
|
||||
{#each data.contents as post}
|
||||
<svelte:component this={post} />
|
||||
{#each data.feedEntries as entry}
|
||||
<h2>{entry.title}</h2>
|
||||
<p class="subtitle">{entry.subtitle}</p>
|
||||
<p class="subtitle">{entry.date}</p>
|
||||
<svelte:component this={entry.content} />
|
||||
{/each}
|
||||
|
||||
</Content>
|
||||
@@ -101,7 +104,7 @@
|
||||
background-color: var(--color-background-highlight-alt);
|
||||
}
|
||||
|
||||
/* .subtitle {
|
||||
.subtitle {
|
||||
font-family: var(--font-mono);
|
||||
margin: 0;
|
||||
font-size: 1rem;
|
||||
@@ -117,5 +120,5 @@
|
||||
|
||||
.subtitle::after {
|
||||
content: " -->";
|
||||
} */
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
import { entries } from './feed';
|
||||
|
||||
interface FeedEntry {
|
||||
content: any;
|
||||
title: string;
|
||||
subtitle: string;
|
||||
date: string;
|
||||
}
|
||||
|
||||
let entriesPerPage = 8;
|
||||
|
||||
export async function load({ params, url }) {
|
||||
@@ -11,7 +18,7 @@ export async function load({ params, url }) {
|
||||
|
||||
// TODO check if index exceeds maximum permitted and redirect (to max page?)
|
||||
|
||||
let contents = [];
|
||||
let feedEntries: FeedEntry[] = [];
|
||||
let start = (pageIndex - 1) * entriesPerPage;
|
||||
|
||||
for (let i = start; i < start + entriesPerPage; i += 1) {
|
||||
@@ -22,8 +29,14 @@ export async function load({ params, url }) {
|
||||
// Vite complains if I don't do this even though it's stupid
|
||||
const path = entries[i].split("/");
|
||||
const page = await import(`./${path[0]}/${path[1]}.md`);
|
||||
const md = page.metadata;
|
||||
|
||||
contents.push(page.default);
|
||||
feedEntries.push({
|
||||
content: page.default,
|
||||
title: md.title,
|
||||
subtitle: md.subtitle,
|
||||
date: md.date,
|
||||
});
|
||||
}
|
||||
|
||||
let currentPage = pageIndex;
|
||||
@@ -32,6 +45,6 @@ export async function load({ params, url }) {
|
||||
return {
|
||||
currentPage,
|
||||
maxPages,
|
||||
contents,
|
||||
feedEntries,
|
||||
};
|
||||
}
|
||||
@@ -1,12 +1,13 @@
|
||||
---
|
||||
title: My First Month Drawing
|
||||
subtitle: self-imposed drawing challenge
|
||||
date: February – March 2026
|
||||
---
|
||||
|
||||
<script lang="ts">
|
||||
import ImageGallery from "$lib/lists/image-gallery.svelte";
|
||||
</script>
|
||||
|
||||
## My First Month Drawing
|
||||
|
||||
<p class="subtitle">self-imposed drawing challenge</p>
|
||||
<p class="subtitle">February – March 2026</p>
|
||||
|
||||
Back in January, I was thinking to myself that I'd really like to learn to draw. It would have some practical benefits like potentially being able to draw concept art for my game, but ultimately I just liked the idea of drawing as a hobby. I doodled a few small things before deciding that I should challenge myself to draw something every single day for an entire month (4 weeks); [I documented the entire thing here](/blog/2026/0205), but spoiler alert: I think I succeeded in learning to draw and I am now able to sketch like I was never able to before!
|
||||
|
||||
Here are some of my favourite drawings from around that time, in chronological order:
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
---
|
||||
title: 3DS USB-C mod
|
||||
subtitle: DIY charging port mod
|
||||
date: October 2024
|
||||
---
|
||||
|
||||
<script lang="ts">
|
||||
import SubtitledImage from "$lib/components/subtitled-image.svelte";
|
||||
import ImageGallery from "$lib/lists/image-gallery.svelte";
|
||||
</script>
|
||||
|
||||
## 3DS USB-C mod
|
||||
|
||||
<p class="subtitle">DIY charging port mod</p>
|
||||
<p class="subtitle">October 2024</p>
|
||||
|
||||
<SubtitledImage
|
||||
image="electronics/3ds-usb-c/showcase.mp4"
|
||||
subtitle="it charges via USB-C! also do you like my A Hat in Time theme?"
|
||||
|
||||
@@ -1,12 +1,14 @@
|
||||
---
|
||||
title: deej0461
|
||||
subtitle: PC companion audio source controller
|
||||
date: August 2024
|
||||
---
|
||||
|
||||
<script lang="ts">
|
||||
import SubtitledImage from "$lib/components/subtitled-image.svelte";
|
||||
import ImageGallery from "$lib/lists/image-gallery.svelte";
|
||||
</script>
|
||||
|
||||
## deej0461
|
||||
<p class="subtitle">PC companion audio source controller</p>
|
||||
<p class="subtitle">August 2024</p>
|
||||
|
||||
<SubtitledImage
|
||||
image="electronics/deej0461/finished.webp"
|
||||
altText="A golden 3D printed shell with a slider on its left, two LEDs recessed, and four black buttons on its right. The buttons have symbols of speakers, monitors, and headphones printed on them. Three screws at the top are visible. A USB-C cable is plugged into the back of it."
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
export let entries: string[] = [
|
||||
// 2026
|
||||
"misc/lightyears-font",
|
||||
"drawings/firstmonth",
|
||||
// 2024
|
||||
"electronics/3ds-usb-c",
|
||||
|
||||
13
src/routes/feed/misc/lightyears-font.md
Normal file
13
src/routes/feed/misc/lightyears-font.md
Normal file
@@ -0,0 +1,13 @@
|
||||
---
|
||||
title: LIGHTYEARS font
|
||||
subtitle: Stylised font
|
||||
date: March 2026
|
||||
---
|
||||
|
||||
<p class="lightyears-text">The world looks so different now. The world looks so different now. The world looks so different now.</p>
|
||||
|
||||
One of my favourite music artists, [Jaron](https://youtu.be/GXvqQ5-P82I), released his album LIGHTYEARS a little over a year ago. For his visuals, he uses a variety of symbols in place of Latin letters, and there's a converter on [his website](https://jaronsteele.com/) too. Only problem is that my browser can't seem to display most of the characters because the characters aren't included in most fonts. That's why I made a font! It allows you to type Latin characters from `A-Z` as well as numbers `0-9` and `!?` in the LIGHTYEARS style. Like this:
|
||||
|
||||
<p class="lightyears-text">trans rights!</p>
|
||||
|
||||
[Download the font here](https://files.natconf.dev/public/lightyears.woff2). It's in the web-optimised `woff2` format and has most characters stripped to minimise its file size – it's less than 20 kilobytes in size! Uppercase and lowercase letters are the same. People can 'decrypt' text by copy-pasting it somewhere else!
|
||||
Reference in New Issue
Block a user