badmanners/gallery.badmanners.xyz
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add Mastodon comments and remove date-fns dependency

Browse source
This commit is contained in:
Bad Manners 2024-03-27 11:54:18 -03:00
parent 00fa1fb164
commit 3e8bcbcf43
19 changed files with 393 additions and 142 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/layouts/BaseLayout.astro
View file

@ -3,6 +3,11 @@ import "../styles/base.css";
import "../styles/fonts.css";
import DarkModeScript from "../components/DarkModeScript.astro";
import AgeRestrictedModal from "../components/AgeRestrictedModal.astro";
type Props = {
pageTitle?: string;
};
const { pageTitle } = Astro.props;
---

30
src/layouts/GameLayout.astro
View file

@ -2,13 +2,12 @@
import { getImage } from "astro:assets";
import { type CollectionEntry, getEntry, getEntries } from "astro:content";
import { Markdown } from "@astropub/md";
import { format as formatDate } from "date-fns";
import { enUS as enUSLocale } from "date-fns/locale/en-US";
import { slug } from "github-slugger";
import BaseLayout from "./BaseLayout.astro";
import Authors from "../components/Authors.astro";
import CopyrightedCharacters from "../components/CopyrightedCharacters.astro";
import Prose from "../components/Prose.astro";
import MastodonComments from "../components/MastodonComments.astro";
type Props = CollectionEntry<"games">["data"];
@ -118,7 +117,7 @@ const thumbnail =
) : null
}
<hr class="mx-auto my-10 w-[80%] max-w-xl border-stone-400 dark:border-stone-600" />
<article id="story" class="pr-1 font-serif">
<article id="game" class="pr-1 font-serif">
<Prose>
<slot />
</Prose>
@ -137,9 +136,15 @@ const thumbnail =
id="publish-date"
class="mt-2 px-2 text-center font-serif font-light text-stone-600 dark:text-stone-200"
aria-label="Publish date"
aria-description={formatDate(props.pubDate, "MMMM do, yyyy", { locale: enUSLocale })}
aria-description={props.pubDate.toLocaleDateString("en-US", {
month: "long",
day: "numeric",
year: "numeric",
})}
>
{formatDate(props.pubDate, "yyyy-MM-dd")}
{props.lang === "tok"
? `tenpo suno ${props.pubDate.toISOString().slice(undefined, 10)}`
: props.pubDate.toISOString().slice(undefined, 10)}
</p>
)
}
@ -175,10 +180,21 @@ const thumbnail =
}
</ul>
</section>
<MastodonComments
instance={props.mastodonPost?.instance}
user={props.mastodonPost?.user}
postId={props.mastodonPost?.postId}
/>
</main>
<div class="pt-6 text-center text-xs text-black dark:text-white">
<span>&copy; {formatDate(props.pubDate, "yyyy")} | </span>
<a class="hover:underline focus:underline" href="/licenses.txt" target="_blank">Licenses</a>
<span
>&copy; {
props.lang === "tok" ? `tenpo pi sike suno ${props.pubDate.getFullYear()}` : props.pubDate.getFullYear()
} |
</span>
<a class="hover:underline focus:underline" href="/licenses.txt" target="_blank"
>{props.lang === "eng" ? "Licenses" : props.lang === "tok" ? "lipu lawa" : null}</a
>
</div>
</div>
</BaseLayout>

22
src/layouts/StoryLayout.astro
View file

@ -2,14 +2,13 @@
import { getImage } from "astro:assets";
import { type CollectionEntry, getEntry, getEntries, getCollection } from "astro:content";
import { Markdown } from "@astropub/md";
import { format as formatDate } from "date-fns";
import { enUS as enUSLocale } from "date-fns/locale/en-US";
import { slug } from "github-slugger";
import BaseLayout from "./BaseLayout.astro";
import Authors from "../components/Authors.astro";
import UserComponent from "../components/UserComponent.astro";
import CopyrightedCharacters from "../components/CopyrightedCharacters.astro";
import Prose from "../components/Prose.astro";
import MastodonComments from "../components/MastodonComments.astro";
type Props = CollectionEntry<"stories">["data"];
@ -226,11 +225,15 @@ const thumbnail =
id="publish-date"
class="mt-2 px-2 text-center font-serif font-light text-stone-600 dark:text-stone-200"
aria-label="Publish date"
aria-description={formatDate(props.pubDate, "MMMM do, yyyy", { locale: enUSLocale })}
aria-description={props.pubDate.toLocaleDateString("en-US", {
month: "long",
day: "numeric",
year: "numeric",
})}
>
{props.lang === "tok"
? `tenpo suno ${formatDate(props.pubDate, "yyyy-MM-dd")}`
: formatDate(props.pubDate, "yyyy-MM-dd")}
? `tenpo suno ${props.pubDate.toISOString().slice(undefined, 10)}`
: props.pubDate.toISOString().slice(undefined, 10)}
</p>
)
}
@ -322,13 +325,16 @@ const thumbnail =
}
</ul>
</section>
<MastodonComments
instance={props.mastodonPost?.instance}
user={props.mastodonPost?.user}
postId={props.mastodonPost?.postId}
/>
</main>
<div class="pt-6 text-center text-xs text-black dark:text-white">
<span
>&copy; {
props.lang === "tok"
? `tenpo pi sike suno ${formatDate(props.pubDate, "yyyy")}`
: formatDate(props.pubDate, "yyyy")
props.lang === "tok" ? `tenpo pi sike suno ${props.pubDate.getFullYear()}` : props.pubDate.getFullYear()
} |
</span>
<a class="hover:underline focus:underline" href="/licenses.txt" target="_blank"