Migrate some scripts to Alpine and add 18+ icon

This commit is contained in:
Bad Manners 2024-09-25 13:38:04 -03:00
parent dcbf094a0e
commit 328e84ccc7
No known key found for this signature in database
GPG key ID: 8C88292CCB075609
20 changed files with 220 additions and 174 deletions

View file

@ -4,7 +4,7 @@ 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 { IconSquareRSS } from "@components/icons";
import { IconNoOneUnder18, IconSquareRSS } from "@components/icons";
type PostWithPubDate = CollectionEntry<"blog"> & { data: { pubDate: Date } };
@ -55,6 +55,11 @@ const posts = await Promise.all(
{post.data.title}
</span>
<br />
{post.data.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<time
class="dt-published italic"
datetime={post.data.pubDate.toISOString().slice(0, 10)}

View file

@ -4,7 +4,7 @@ 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 { IconSquareRSS } from "@components/icons";
import { IconNoOneUnder18, IconSquareRSS } from "@components/icons";
type GameWithPubDate = CollectionEntry<"games"> & { data: { pubDate: Date } };
@ -55,6 +55,11 @@ const games = await Promise.all(
{game.data.title}
</span>
<br />
{game.data.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<time
class="dt-published italic"
datetime={game.data.pubDate.toISOString().slice(0, 10)}

View file

@ -6,12 +6,13 @@ 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 { IconSquareRSS } from "@components/icons";
import { IconNoOneUnder18, IconSquareRSS } from "@components/icons";
const MAX_ITEMS = 10;
interface LatestItemsEntry {
type: string;
isAgeRestricted: boolean;
thumbnail?: ImageMetadata;
href: string;
title: string;
@ -49,6 +50,7 @@ const latestItems: LatestItemsEntry[] = await Promise.all(
fn: async () =>
({
type: "Story",
isAgeRestricted: story.data.isAgeRestricted,
thumbnail: story.data.thumbnail,
href: `/stories/${story.slug}`,
title: story.data.title,
@ -63,6 +65,7 @@ const latestItems: LatestItemsEntry[] = await Promise.all(
fn: async () =>
({
type: "Game",
isAgeRestricted: game.data.isAgeRestricted,
thumbnail: game.data.thumbnail,
href: `/games/${game.slug}`,
title: game.data.title,
@ -77,6 +80,7 @@ const latestItems: LatestItemsEntry[] = await Promise.all(
fn: async () =>
({
type: "Blog post",
isAgeRestricted: post.data.isAgeRestricted,
thumbnail: post.data.thumbnail,
href: `/blog/${post.slug}`,
title: post.data.title,
@ -140,6 +144,11 @@ const latestItems: LatestItemsEntry[] = await Promise.all(
</span>
<br />
<span class="italic">
{entry.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<span class="p-category" aria-label="Category">
{entry.type}
</span>{" "}

View file

@ -5,7 +5,7 @@ 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 { IconSquareRSS } from "@components/icons";
import { IconNoOneUnder18, IconSquareRSS } from "@components/icons";
type StoryWithPubDate = CollectionEntry<"stories"> & { data: { pubDate: Date } };
@ -111,6 +111,11 @@ const totalPages = Math.ceil(page.total / page.size);
{story.data.title}
</span>
<br />
{story.data.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<time
class="dt-published italic"
datetime={story.data.pubDate.toISOString().slice(0, 10)}

View file

@ -10,6 +10,7 @@ import { qualifyLocalURLsInMarkdown } from "@utils/qualify_local_urls_in_markdow
import { markdownToPlaintext } from "@utils/markdown_to_plaintext";
import Prose from "@components/Prose.astro";
import UserComponent from "@components/UserComponent.astro";
import { IconNoOneUnder18 } from "@components/icons";
type EntryWithPubDate<C extends CollectionKey> = CollectionEntry<C> & { data: { pubDate: Date } };
@ -179,6 +180,11 @@ const totalWorksWithTag = t(
{story.data.title}
</span>
<br />
{story.data.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<time
class="dt-published italic"
datetime={story.data.pubDate.toISOString().slice(0, 10)}
@ -242,6 +248,11 @@ const totalWorksWithTag = t(
{game.data.title}
</span>
<br />
{game.data.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<time
class="dt-published italic"
datetime={game.data.pubDate.toISOString().slice(0, 10)}
@ -301,6 +312,11 @@ const totalWorksWithTag = t(
{post.data.title}
</span>
<br />
{post.data.isAgeRestricted ? (
<span class="inline-block align-middle" aria-label="Age restricted">
<IconNoOneUnder18 width="1.25rem" height="1.25rem" />
</span>
) : null}
<time
class="dt-published italic"
datetime={post.data.pubDate.toISOString().slice(0, 10)}