Use path aliasing and improve accesibility

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "gallery.badmanners.xyz",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "gallery.badmanners.xyz",
-      "version": "1.8.0",
+      "version": "1.8.1",
       "hasInstallScript": true,
       "dependencies": {
         "@astrojs/check": "^0.9.3",

package.json

@@ -1,7 +1,7 @@
 {
   "name": "gallery.badmanners.xyz",
   "type": "module",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "scripts": {
     "postinstall": "astro sync",
     "dev": "astro dev",

src/components/Authors.astro

@@ -1,5 +1,5 @@
 ---
-import { t, type Lang } from "../i18n";
+import { t, type Lang } from "@i18n";
 
 type Props = {
   lang: Lang;

src/components/Commissioners.astro

@@ -1,5 +1,5 @@
 ---
-import { t, type Lang } from "../i18n";
+import { t, type Lang } from "@i18n";
 
 type Props = {
   lang: Lang;

src/components/CopyrightedCharacters.astro

@@ -1,9 +1,9 @@
 ---
-import type { CopyrightedCharacters } from "../content/config";
-import { t, type Lang } from "../i18n";
+import type { CopyrightedCharacters } from "@content/config";
+import { t, type Lang } from "@i18n";
 import UserComponent from "./UserComponent.astro";
 import CopyrightedCharactersItem from "./CopyrightedCharactersItem.astro";
-import { formatCopyrightedCharacters } from "../utils/format_copyrighted_characters";
+import { formatCopyrightedCharacters } from "@utils/format_copyrighted_characters";
 
 type Props = {
   copyrightedCharacters?: CopyrightedCharacters;

src/components/ExternalPosts.astro

@@ -1,6 +1,6 @@
 ---
-import type { Posts } from "../content/config";
-import { t, type Lang } from "../i18n";
+import type { Posts } from "@content/config";
+import { t, type Lang } from "@i18n";
 import { IconEkasPortal, IconFurAffinity, IconInkbunny, IconSoFurry, IconWeasyl } from "./icons/brands";
 
 type Props = {
@@ -30,6 +30,7 @@ const isVisible = eka || furaffinity || inkbunny || sofurry || weasyl;
                 aria-label={t(lang, "published_content/syndication_eka")}
               >
                 <IconEkasPortal class="mx-auto" width="2rem" height="2rem" />
+                <span class="sr-only">{t(lang, "published_content/syndication_eka")}</span>
               </a>
             </li>
           ) : null}
@@ -42,6 +43,7 @@ const isVisible = eka || furaffinity || inkbunny || sofurry || weasyl;
                 aria-label={t(lang, "published_content/syndication_furaffinity")}
               >
                 <IconFurAffinity class="mx-auto" width="2rem" height="2rem" />
+                <span class="sr-only">{t(lang, "published_content/syndication_furaffinity")}</span>
               </a>
             </li>
           ) : null}
@@ -54,6 +56,7 @@ const isVisible = eka || furaffinity || inkbunny || sofurry || weasyl;
                 aria-label={t(lang, "published_content/syndication_inkbunny")}
               >
                 <IconInkbunny class="mx-auto" width="2rem" height="2rem" />
+                <span class="sr-only">{t(lang, "published_content/syndication_inkbunny")}</span>
               </a>
             </li>
           ) : null}
@@ -66,6 +69,7 @@ const isVisible = eka || furaffinity || inkbunny || sofurry || weasyl;
                 aria-label={t(lang, "published_content/syndication_sofurry")}
               >
                 <IconSoFurry class="mx-auto" width="2rem" height="2rem" />
+                <span class="sr-only">{t(lang, "published_content/syndication_sofurry")}</span>
               </a>
             </li>
           ) : null}
@@ -78,6 +82,7 @@ const isVisible = eka || furaffinity || inkbunny || sofurry || weasyl;
                 aria-label={t(lang, "published_content/syndication_weasyl")}
               >
                 <IconWeasyl class="mx-auto" width="2rem" height="2rem" />
+                <span class="sr-only">{t(lang, "published_content/syndication_weasyl")}</span>
               </a>
             </li>
           ) : null}

src/components/MastodonComments.astro

@@ -1,5 +1,5 @@
 ---
-import type { Lang } from "../i18n";
+import type { Lang } from "@i18n";
 import { IconStar, IconRetweet } from "./icons";
 
 type Props = {

src/components/NoteTooltip.astro

@@ -13,4 +13,5 @@ const { id, title, text } = Astro.props;
     {text}
   </a>
   <sup>{id}</sup>
+  <em class="sr-only">({title})</em>
 </Fragment>

src/components/Requesters.astro

@@ -1,5 +1,5 @@
 ---
-import { t, type Lang } from "../i18n";
+import { t, type Lang } from "@i18n";
 
 type Props = {
   lang: Lang;

src/components/UserComponent.astro

@@ -1,8 +1,8 @@
 ---
 import type { CollectionEntry } from "astro:content";
 import clsx from "clsx";
-import type { Lang } from "../i18n";
-import { getUsernameForLang } from "../utils/get_username_for_lang";
+import type { Lang } from "@i18n";
+import { getUsernameForLang } from "@utils/get_username_for_lang";
 
 type Props = {
   lang: Lang;

src/content/blog/crossing-over-postmortem.mdx

@@ -23,18 +23,18 @@ relatedGames:
 ---
 
 import { Image } from "astro:assets";
-import imageMarcoConceptArt from "../../assets/images/crossing_over/marco_concept_art.jpg";
-import imageMarcoFirstAppearance from "../../assets/images/crossing_over/marco_first_appearance.png";
-import imageBardConceptArt from "../../assets/images/crossing_over/bard_concept_art.jpg";
-import imageBardAppearance from "../../assets/images/crossing_over/bard.png";
-import imageBriefcase from "../../assets/images/crossing_over/briefcase.png";
-import imageBoatWakes from "../../assets/images/crossing_over/boat_wakes.png";
-import imageLooseThoughts from "../../assets/images/crossing_over/loose_thoughts.png";
-import imageArchitectureVn from "../../assets/images/crossing_over/architecture_vn.png";
-import imageTextbox from "../../assets/images/crossing_over/textbox.png";
-import imageScriptWordCount from "../../assets/images/crossing_over/script_word_count.png";
-import imageMarcoSprites from "../../assets/images/crossing_over/marco_sprites.png";
-import imageSceneInFinalGame from "../../assets/images/crossing_over/scene_in_final_game.png";
+import imageMarcoConceptArt from "@assets/images/crossing_over/marco_concept_art.jpg";
+import imageMarcoFirstAppearance from "@assets/images/crossing_over/marco_first_appearance.png";
+import imageBardConceptArt from "@assets/images/crossing_over/bard_concept_art.jpg";
+import imageBardAppearance from "@assets/images/crossing_over/bard.png";
+import imageBriefcase from "@assets/images/crossing_over/briefcase.png";
+import imageBoatWakes from "@assets/images/crossing_over/boat_wakes.png";
+import imageLooseThoughts from "@assets/images/crossing_over/loose_thoughts.png";
+import imageArchitectureVn from "@assets/images/crossing_over/architecture_vn.png";
+import imageTextbox from "@assets/images/crossing_over/textbox.png";
+import imageScriptWordCount from "@assets/images/crossing_over/script_word_count.png";
+import imageMarcoSprites from "@assets/images/crossing_over/marco_sprites.png";
+import imageSceneInFinalGame from "@assets/images/crossing_over/scene_in_final_game.png";
 
 A.K.A. that time I made a game in a month.
 
@@ -103,7 +103,7 @@ Speaking of, I did work on some concept art! Including the two characters, the b
 <figure>
   <Image
     src={imageMarcoConceptArt}
-    alt="Photograph of a page, with several drawings of an anthropomorphic jackal named Marco, wearing a large coat, a mask, and ankle cuffs. There's also a drawing of a boat in the corner."
+    alt="Photograph of a page, with several drawings of an anthropomorphic jackal named Marco, wearing a large coat, a mask, and ankle cuffs. There's also a drawing of a boat named Akhirah in the corner."
   />
   <figcaption class="text-center">
     Concept art of Marco and Akhirah. Feel free to judge my awful drawing skills...
@@ -123,7 +123,7 @@ Marco's design was mostly inspired by that of [Anubis](https://en.wikipedia.org/
 <figure>
   <Image
     src={imageBardConceptArt}
-    alt="Photograph of a page, with several drawings of a blobby and oval character named Bard. There are also a few framed drawings of different angles of scenes taking place on a boat."
+    alt="Photograph of a page, with several drawings of a blobby and oval character named Bard. There are also a few framed drawings of different angles of scenes taking place on Akhirah, in a river inside a cave."
   />
   <figcaption class="text-center">
     Concept art of Bard and some screens. I don't think his original look is physically possible...
@@ -135,7 +135,7 @@ For Bard's design, I had a couple of inspirations – the main one being the vis
 <figure>
   <Image
     src={imageBardAppearance}
-    alt="A cyan orb, surrounded on the top by an inside-out dark blue oval, and on the bottom by cyan ribbon-like strands."
+    alt="A glowing cyan orb, surrounded on the top by an inside-out dark blue oval, and on the bottom by cyan ribbon-like strands."
   />
   <figcaption class="text-center">Bard's final look.</figcaption>
 </figure>
@@ -151,7 +151,7 @@ There. Still haven't forgotten how to make some text bigger than other text.
 I guess I'll start by talking about something Blender-related that isn't exactly modeling: shading. It simply means selecting the materials for all the different elements – colors, textures, etc. Like I've said back in Part 1, I wanted a pixel art/cellshaded artstyle. And to commit to it even further, I looked for palettes to use for said shading. Limiting the choices helped with making things have a unified identity, as well as stick out from the background and other objects. The surfaces are all made of a similar base material, which creates cells based on the light level and then applies a dithering effect between them (i.e. some pixels of each color blend into each other, between two different cells, as old games with limited palettes did to make smooth transitions). They also had different colors under the two sets of lights: one being "white" for the default look, and the other being "blue" from Bard's glow. This helps with the illusion of the soul actually having its own light. On top of that, I also added an outline to most materials, based off the dark color of the material. This kind of breaks the convention for pixel art, since I'm relying on how Blender generates the alpha for those outlines, but it certainly makes objects much more readable. For each outline, I had to handpick values for the thickness and color – sometimes having to deviate from the palette to do so.
 
 <figure>
-  <Image src={imageBriefcase} alt="A briefcase filled with gold bars." />
+  <Image src={imageBriefcase} alt="A leather briefcase filled with gold bars." />
   <figcaption class="text-center">
     A gold-filled briefcase, one of the many items that you fish in Crossing Over. Notice the dark yellow outline around
     the gold bars, and the dark brown one around the light brown bits.
@@ -165,7 +165,7 @@ Speaking of, the "wake" effect that you see sometimes while Akhirah is moving (i
 <figure>
   <Image
     src={imageBoatWakes}
-    alt="Marco sitting down against the railing at the back of his boat, without a mask and keeping his hands underneath a hovering Bard. Behind him are wakes being made by the boat moving over the water."
+    alt="Marco sitting down against the railing at the back of his boat, without a mask and keeping his hands underneath a hovering Bard. Behind him are wakes, being made by the boat moving over the water."
   />
   <figcaption class="text-center">
     A late-game shot, displaying multiple light sources and wakes behind the boat.

src/content/blog/taken-in-breakdown.mdx

@@ -1,5 +1,5 @@
 ---
-title: "Taken In: Story Breakdown!"
+title: "Taken In: Story breakdown!"
 pubDate: 2024-01-23
 isAgeRestricted: true
 authors: bad-manners
@@ -24,16 +24,21 @@ relatedStories:
   - taken-in
 ---
 
-import NoteTooltip from "../../components/NoteTooltip.astro";
+import NoteTooltip from "@components/NoteTooltip.astro";
 export let count = 0;
+export function resetCount() {
+  count = 0;
+}
 export function getCount() {
   count += 1;
   return count;
 }
 
+{resetCount()}
+
 Going over the story and breaking it down was a fun process, all in all. But this was originally a text document, which I had to completely manually refit into this post you're reading (oof...!). Still, for the sake of posteriority, I think it was worth the effort.
 
-If you're up for this non-linear read, then I hope you enjoy this sneak-peek into my thoughts! Just hover or long-press over the links with dotted underlines, and it should show the relevant annotations. Now, without further ado, let me reintroduce...
+If you're up for this non-linear read, then I hope you enjoy this sneak-peek into my thoughts! Just hover or long-press over the <span class="text-link underline decoration-dotted" title="Just like that!" data-tooltip>links with dotted underlines</span>, and it should show the relevant annotations. Now, without further ado, let me reintroduce...
 
 <h2>
   <NoteTooltip

src/i18n/index.ts

@@ -1,5 +1,5 @@
-import { type GamePlatform, type Lang, DEFAULT_LANG } from "../content/config";
-export { type Lang, DEFAULT_LANG } from "../content/config";
+import { type GamePlatform, type Lang, DEFAULT_LANG } from "@content/config";
+export { type Lang, DEFAULT_LANG } from "@content/config";
 
 const UI_STRINGS = {
   // Utility functions

src/layouts/BaseLayout.astro

@@ -1,8 +1,8 @@
 ---
 import "../styles/base.css";
 import "../styles/fonts.css";
-import DarkModeScript from "../components/DarkModeScript.astro";
-import AgeRestrictedModal from "../components/AgeRestrictedModal.astro";
+import DarkModeScript from "@components/DarkModeScript.astro";
+import AgeRestrictedModal from "@components/AgeRestrictedModal.astro";
 
 type Props = {
   pageTitle: string;

src/layouts/BlogPostLayout.astro

@@ -1,10 +1,10 @@
 ---
 import { type CollectionEntry, getEntry, getEntries } from "astro:content";
 import PublishedContentLayout from "./PublishedContentLayout.astro";
-import { t } from "../i18n";
-import Authors from "../components/Authors.astro";
-import UserComponent from "../components/UserComponent.astro";
-import Prose from "../components/Prose.astro";
+import { t } from "@i18n";
+import Authors from "@components/Authors.astro";
+import UserComponent from "@components/UserComponent.astro";
+import Prose from "@components/Prose.astro";
 import { Markdown } from "@astropub/md";
 
 type Props = CollectionEntry<"blog">["data"];

src/layouts/GalleryLayout.astro

@@ -1,8 +1,8 @@
 ---
 import { getImage } from "astro:assets";
-import BaseLayout from "./BaseLayout.astro";
-import logoBM from "../assets/images/logo_bm.png";
-import { t } from "../i18n";
+import BaseLayout from "@layouts/BaseLayout.astro";
+import logoBM from "@assets/images/logo_bm.png";
+import { t } from "@i18n";
 import {
   IconBlog,
   IconBook,
@@ -14,7 +14,7 @@ import {
   IconSquareRSS,
   IconSun,
   IconTags,
-} from "../components/icons";
+} from "@components/icons";
 
 type Props = {
   pageTitle: string;

src/layouts/GameLayout.astro

@@ -1,10 +1,10 @@
 ---
 import { type CollectionEntry, getEntry, getEntries } from "astro:content";
 import PublishedContentLayout from "./PublishedContentLayout.astro";
-import { t } from "../i18n";
-import Authors from "../components/Authors.astro";
-import Prose from "../components/Prose.astro";
-import UserComponent from "../components/UserComponent.astro";
+import { t } from "@i18n";
+import Authors from "@components/Authors.astro";
+import Prose from "@components/Prose.astro";
+import UserComponent from "@components/UserComponent.astro";
 
 type Props = CollectionEntry<"games">["data"];
 

src/layouts/PublishedContentLayout.astro

@@ -4,13 +4,13 @@ import { getImage } from "astro:assets";
 import { type CollectionEntry, getEntry, getCollection } from "astro:content";
 import { Markdown } from "@astropub/md";
 import { slug } from "github-slugger";
-import { DEFAULT_LANG, t, type Lang } from "../i18n";
-import BaseLayout from "./BaseLayout.astro";
-import CopyrightedCharacters from "../components/CopyrightedCharacters.astro";
-import Prose from "../components/Prose.astro";
-import MastodonComments from "../components/MastodonComments.astro";
-import type { CopyrightedCharacters as CopyrightedCharactersType, Posts } from "../content/config";
-import { qualifyLocalURLsInMarkdown } from "../utils/qualify_local_urls_in_markdown";
+import { DEFAULT_LANG, t, type Lang } from "@i18n";
+import BaseLayout from "@layouts/BaseLayout.astro";
+import CopyrightedCharacters from "@components/CopyrightedCharacters.astro";
+import Prose from "@components/Prose.astro";
+import MastodonComments from "@components/MastodonComments.astro";
+import type { CopyrightedCharacters as CopyrightedCharactersType, Posts } from "@content/config";
+import { qualifyLocalURLsInMarkdown } from "@utils/qualify_local_urls_in_markdown";
 import {
   IconSun,
   IconMoon,
@@ -19,9 +19,9 @@ import {
   IconChevronLeft,
   IconChevronRight,
   IconArrowUp,
-} from "../components/icons";
-import ExternalPosts from "../components/ExternalPosts.astro";
-import { markdownToPlaintext } from "../utils/markdown_to_plaintext";
+} from "@components/icons";
+import ExternalPosts from "@components/ExternalPosts.astro";
+import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
 
 interface RelatedContent {
   link: string;

src/layouts/StoryLayout.astro

@@ -1,12 +1,12 @@
 ---
 import { type CollectionEntry, getEntry, getEntries } from "astro:content";
-import PublishedContentLayout from "./PublishedContentLayout.astro";
-import { t } from "../i18n";
-import Authors from "../components/Authors.astro";
-import Commissioners from "../components/Commissioners.astro";
-import Requesters from "../components/Requesters.astro";
-import UserComponent from "../components/UserComponent.astro";
-import Prose from "../components/Prose.astro";
+import PublishedContentLayout from "@layouts/PublishedContentLayout.astro";
+import { t } from "@i18n";
+import Authors from "@components/Authors.astro";
+import Commissioners from "@components/Commissioners.astro";
+import Requesters from "@components/Requesters.astro";
+import UserComponent from "@components/UserComponent.astro";
+import Prose from "@components/Prose.astro";
 
 type Props = CollectionEntry<"stories">["data"];
 

src/pages/404.astro

@@ -1,5 +1,5 @@
 ---
-import GalleryLayout from "../layouts/GalleryLayout.astro";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
 ---
 
 <GalleryLayout pageTitle="404">

src/pages/api/export-story/[...slug].ts

@@ -1,14 +1,14 @@
 import type { APIRoute, GetStaticPaths } from "astro";
 import { getCollection, type CollectionEntry, getEntries } from "astro:content";
-import type { PostWebsite } from "../../../content/config";
-import { t } from "../../../i18n";
-import { formatCopyrightedCharacters } from "../../../utils/format_copyrighted_characters";
-import { markdownToBbcode } from "../../../utils/markdown_to_bbcode";
-import { getUsernameForLang } from "../../../utils/get_username_for_lang";
-import { isAnonymousUser } from "../../../utils/is_anonymous_user";
-import { qualifyLocalURLsInMarkdown } from "../../../utils/qualify_local_urls_in_markdown";
-import { getWebsiteLinkForUser } from "../../../utils/get_website_link_for_user";
-import { toPlainMarkdown } from "../../../utils/to_plain_markdown";
+import type { PostWebsite } from "@content/config";
+import { t } from "@i18n";
+import { formatCopyrightedCharacters } from "@utils/format_copyrighted_characters";
+import { markdownToBbcode } from "@utils/markdown_to_bbcode";
+import { getUsernameForLang } from "@utils/get_username_for_lang";
+import { isAnonymousUser } from "@utils/is_anonymous_user";
+import { qualifyLocalURLsInMarkdown } from "@utils/qualify_local_urls_in_markdown";
+import { getWebsiteLinkForUser } from "@utils/get_website_link_for_user";
+import { toPlainMarkdown } from "@utils/to_plain_markdown";
 
 interface ExportWebsiteInfo {
   website: PostWebsite;

src/pages/blog.astro

@@ -1,9 +1,9 @@
 ---
 import { Image } from "astro:assets";
 import { getCollection, getEntries, type CollectionEntry } from "astro:content";
-import GalleryLayout from "../layouts/GalleryLayout.astro";
-import UserComponent from "../components/UserComponent.astro";
-import { markdownToPlaintext } from "../utils/markdown_to_plaintext";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import UserComponent from "@components/UserComponent.astro";
+import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
 
 type PostWithPubDate = CollectionEntry<"blog"> & { data: { pubDate: Date } };
 

src/pages/blog/[...slug].astro

@@ -2,7 +2,7 @@
 import type { GetStaticPaths } from "astro";
 import { type CollectionEntry, getCollection } from "astro:content";
 import { PUBLISH_DRAFTS } from "astro:env/server";
-import BlogPostLayout from "../../layouts/BlogPostLayout.astro";
+import BlogPostLayout from "@layouts/BlogPostLayout.astro";
 
 type Props = CollectionEntry<"blog">;
 

src/pages/feed.xml.ts

@@ -3,10 +3,10 @@ import type { APIRoute } from "astro";
 import { getCollection, getEntries, type CollectionEntry, type CollectionKey } from "astro:content";
 import { markdown } from "@astropub/md";
 import sanitizeHtml from "sanitize-html";
-import { t, type Lang } from "../i18n";
-import { markdownToPlaintext } from "../utils/markdown_to_plaintext";
-import { getUsernameForLang } from "../utils/get_username_for_lang";
-import { qualifyLocalURLsInMarkdown } from "../utils/qualify_local_urls_in_markdown";
+import { t, type Lang } from "@i18n";
+import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
+import { getUsernameForLang } from "@utils/get_username_for_lang";
+import { qualifyLocalURLsInMarkdown } from "@utils/qualify_local_urls_in_markdown";
 
 type FeedItem = RSSFeedItem &
   Required<Pick<RSSFeedItem, "title" | "pubDate" | "link" | "description" | "categories" | "content">>;

src/pages/games.astro

@@ -1,9 +1,9 @@
 ---
 import { Image } from "astro:assets";
 import { getCollection, getEntries, type CollectionEntry } from "astro:content";
-import GalleryLayout from "../layouts/GalleryLayout.astro";
-import { t } from "../i18n";
-import UserComponent from "../components/UserComponent.astro";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import { t } from "@i18n";
+import UserComponent from "@components/UserComponent.astro";
 
 type GameWithPubDate = CollectionEntry<"games"> & { data: { pubDate: Date } };
 

src/pages/games/[...slug].astro

@@ -1,7 +1,7 @@
 ---
 import type { GetStaticPaths } from "astro";
 import { type CollectionEntry, getCollection } from "astro:content";
-import GameLayout from "../../layouts/GameLayout.astro";
+import GameLayout from "@layouts/GameLayout.astro";
 import { PUBLISH_DRAFTS } from "astro:env/server";
 
 type Props = CollectionEntry<"games">;

src/pages/index.astro

@@ -2,10 +2,10 @@
 import type { ImageMetadata } from "astro";
 import { type CollectionEntry, type CollectionKey, getCollection, getEntries } from "astro:content";
 import { Image } from "astro:assets";
-import GalleryLayout from "../layouts/GalleryLayout.astro";
-import { t, type Lang } from "../i18n";
-import UserComponent from "../components/UserComponent.astro";
-import { markdownToPlaintext } from "../utils/markdown_to_plaintext";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import { t, type Lang } from "@i18n";
+import UserComponent from "@components/UserComponent.astro";
+import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
 
 const MAX_ITEMS = 10;
 

src/pages/search.astro

@@ -1,6 +1,6 @@
 ---
 import SearchComponent from "astro-pagefind/components/Search";
-import GalleryLayout from "../layouts/GalleryLayout.astro";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
 ---
 
 <script>

src/pages/stories/[...slug].astro

@@ -2,7 +2,7 @@
 import type { GetStaticPaths } from "astro";
 import { type CollectionEntry, getCollection } from "astro:content";
 import getReadingTime from "reading-time";
-import StoryLayout from "../../layouts/StoryLayout.astro";
+import StoryLayout from "@layouts/StoryLayout.astro";
 import { PUBLISH_DRAFTS } from "astro:env/server";
 
 type Props = CollectionEntry<"stories">;

src/pages/stories/[page].astro

@@ -2,9 +2,9 @@
 import type { GetStaticPaths, Page } from "astro";
 import { Image } from "astro:assets";
 import { getCollection, getEntries, type CollectionEntry } from "astro:content";
-import GalleryLayout from "../../layouts/GalleryLayout.astro";
-import { t } from "../../i18n";
-import UserComponent from "../../components/UserComponent.astro";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import { t } from "@i18n";
+import UserComponent from "@components/UserComponent.astro";
 
 type StoryWithPubDate = CollectionEntry<"stories"> & { data: { pubDate: Date } };
 

src/pages/stories/the-lost-of-the-marshes.astro

@@ -1,8 +1,8 @@
 ---
 import { getCollection, getEntry, type CollectionEntry } from "astro:content";
 import { Image } from "astro:assets";
-import GalleryLayout from "../../layouts/GalleryLayout.astro";
-import mapImage from "../../assets/images/tlotm_map.jpg";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import mapImage from "@assets/images/tlotm_map.jpg";
 
 type StoryWithPubDate = CollectionEntry<"stories"> & { data: { pubDate: Date } };
 

src/pages/tags.astro

@@ -1,8 +1,8 @@
 ---
 import { getCollection } from "astro:content";
 import { slug } from "github-slugger";
-import GalleryLayout from "../layouts/GalleryLayout.astro";
-import { markdownToPlaintext } from "../utils/markdown_to_plaintext";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
 
 interface Tag {
   id: string;

src/pages/tags/[badSlug].astro

@@ -1,7 +1,7 @@
 ---
 import type { GetStaticPaths } from "astro";
 import { slug } from "github-slugger";
-import GalleryLayout from "../../layouts/GalleryLayout.astro";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
 
 type Props = {
   badTag: string;

src/pages/tags/[slug].astro

@@ -4,12 +4,12 @@ import { Image } from "astro:assets";
 import { type CollectionEntry, type CollectionKey, getCollection, getEntries } from "astro:content";
 import { Markdown } from "@astropub/md";
 import { slug } from "github-slugger";
-import GalleryLayout from "../../layouts/GalleryLayout.astro";
-import Prose from "../../components/Prose.astro";
-import { t, DEFAULT_LANG } from "../../i18n";
-import { qualifyLocalURLsInMarkdown } from "../../utils/qualify_local_urls_in_markdown";
-import UserComponent from "../../components/UserComponent.astro";
-import { markdownToPlaintext } from "../../utils/markdown_to_plaintext";
+import GalleryLayout from "@layouts/GalleryLayout.astro";
+import { t, DEFAULT_LANG } from "@i18n";
+import { qualifyLocalURLsInMarkdown } from "@utils/qualify_local_urls_in_markdown";
+import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
+import Prose from "@components/Prose.astro";
+import UserComponent from "@components/UserComponent.astro";
 
 type EntryWithPubDate<C extends CollectionKey> = CollectionEntry<C> & { data: { pubDate: Date } };
 

src/utils/format_copyrighted_characters.ts

@@ -1,5 +1,5 @@
 import { getEntry, type CollectionEntry } from "astro:content";
-import type { CopyrightedCharacters } from "../content/config";
+import type { CopyrightedCharacters } from "@content/config";
 
 export async function formatCopyrightedCharacters(copyrightedCharacters: CopyrightedCharacters) {
   return await Promise.all(

src/utils/get_username_for_lang.ts

@@ -1,5 +1,5 @@
 import type { CollectionEntry } from "astro:content";
-import { DEFAULT_LANG, type Lang } from "../i18n";
+import { DEFAULT_LANG, type Lang } from "@i18n";
 
 export function getUsernameForLang(user: CollectionEntry<"users">, lang: Lang): string {
   const { name } = user.data;

src/utils/get_website_link_for_user.ts

@@ -1,5 +1,5 @@
 import type { CollectionEntry } from "astro:content";
-import { DEFAULT_LANG, type UserWebsite } from "../content/config";
+import { DEFAULT_LANG, type UserWebsite } from "@content/config";
 import { getUsernameForLang } from "./get_username_for_lang";
 
 type WebsiteUserData<W extends UserWebsite> = NonNullable<CollectionEntry<"users">["data"]["links"][W]>;

src/utils/is_anonymous_user.ts

@@ -1,5 +1,5 @@
 import type { CollectionEntry } from "astro:content";
-import { ANONYMOUS_USER_ID } from "../content/config";
+import { ANONYMOUS_USER_ID } from "@content/config";
 
 const ID: CollectionEntry<"users">["id"] = ANONYMOUS_USER_ID;
 

src/utils/qualify_local_urls_in_markdown.ts

@@ -1,5 +1,5 @@
 import { getCollection, getEntry } from "astro:content";
-import type { Lang, PostWebsite, UserWebsite } from "../content/config";
+import type { Lang, PostWebsite, UserWebsite } from "@content/config";
 import { getWebsiteLinkForUser } from "./get_website_link_for_user";
 import { getUsernameForLang } from "./get_username_for_lang";
 

tsconfig.json

@@ -1,4 +1,16 @@
 {
   "extends": "astro/tsconfigs/strict",
-  "exclude": ["dist"]
+  "exclude": ["dist"],
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@assets/*": ["src/assets/*"],
+      "@components/*": ["src/components/*"],
+      "@content/*": ["src/content/*"],
+      "@data/*": ["src/data/*"],
+      "@i18n": ["src/i18n"],
+      "@layouts/*": ["src/layouts/*"],
+      "@utils/*": ["src/utils/*"]
+    }
+  }
 }