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

Use history.replaceState ageVerified query and remove ENABLE_VIEW_TRANSITIONS

Browse source
This commit is contained in:
Bad Manners 2024-08-26 14:49:12 -03:00
parent 92123a305d
commit f57ba9ddc4
19 changed files with 91 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

7
README.md
View file

@ -29,10 +29,9 @@ npm run prettier # Prettier formatting
The following optional environment variable can be set within a `.env` file:
| Name | Type | Description |
| ------------------------- | ------- | ------------------------------------------------------------------------------------------------ |
| `APACHE_CONFIG` | boolean | If set to true, generates an `.htaccess` Apache config file at the root of the output directory. |
| `ENABLE_VIEW_TRANSITIONS` | boolean | If set to true, enables Astro's View Transitions API (i.e. Single-Page App mode). |
| Name | Type | Description |
| --------------- | ------- | ------------------------------------------------------------------------------------------------ |
| `APACHE_CONFIG` | boolean | If set to true, generates an `.htaccess` Apache config file at the root of the output directory. |
### Build and deploy to remote

1
astro.config.mjs
View file

@ -21,7 +21,6 @@ export default defineConfig({
env: {
schema: {
APACHE_CONFIG: envField.boolean({ context: "server", access: "public", default: false }),
ENABLE_VIEW_TRANSITIONS: envField.boolean({ context: "client", access: "public", default: false }),
},
},
},

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "badmanners.xyz",
"version": "2.1.5",
"version": "2.1.6",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "badmanners.xyz",
"version": "2.1.5",
"version": "2.1.6",
"hasInstallScript": true,
"dependencies": {
"@astrojs/check": "^0.9.2",

2
package.json
View file

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

15
public/licenses.toml
View file

@ -3,14 +3,17 @@
[copyright]
title = "badmanners.xyz"
description = "Bad Manners's personal website."
date = "2023–2024"
date = "2023-2024"
author = "Bad Manners <me@badmanners.xyz>"
source = "https://git.badmanners.xyz/badmanners/badmanners.xyz"
license = { name = "MIT", url = "https://opensource.org/license/mit" }
notes = "All rights reserved."
[copyright.additional]
notes = "The briefcase logo and Sam Brendan are copyrighted and tradermarked by me."
[[copyright.additional]]
notes = "The briefcase logo is copyrighted and trademarked by me. All rights reserved."
[[copyright.additional]]
notes = "The character/fursona Sam Brendan is copyrighted and trademarked by me. All rights reserved."
[[attributions]]
description = "Reference sheet of Sam Brendan, a mimic x maned wolf hybrid."
@ -76,7 +79,11 @@ icons = [
"SoFurry",
"SubscribeStar",
]
notes = "All third-party copyrights and trademarks belong to their respective owners."
license = { name = "CC0 1.0 Universal", url = "https://creativecommons.org/publicdomain/zero/1.0/" }
notes = """
Original icons edited for non-commercial use.
All third-party copyrights and trademarks belong to their respective owners, \
and I'm not affiliated with any of them."""
[[attributions]]
title = "Font Awesome"

2
public/robots.txt Normal file
View file

@ -0,0 +1,2 @@
User-agent: *
Disallow: .htaccess

8
src/components/AgeRestrictedModal.astro
View file

@ -55,7 +55,6 @@ import { IconTriangleExclamation } from "./icons";
<AgeRestrictedScriptInline />
<script>
import { ENABLE_VIEW_TRANSITIONS } from "astro:env/client";
type AgeVerified = "true" | undefined;
const ageRestrictedModalSetup = () => {
@ -99,9 +98,6 @@ import { IconTriangleExclamation } from "./icons";
rejectButton.focus();
}
};
if (ENABLE_VIEW_TRANSITIONS) {
document.addEventListener("astro:page-load", ageRestrictedModalSetup);
} else {
ageRestrictedModalSetup();
}
ageRestrictedModalSetup();
</script>

2
src/components/AgeRestrictedScriptInline.astro
View file

@ -1,4 +1,4 @@
---
---
<script is:inline>function a(){let b=document,c="#modal-age-restricted",d="true",e=b.querySelector("body > "+c),f="ageVerified",g="searchParams",h=localStorage;new URL(b.location)[g].get(f)===d&&(h[f]=d);e&&(h[f]===d?b.querySelectorAll("a[href][data-age-restricted]").forEach(x=>{let y=new URL(x.href);y[g].set(f,d);x.href=y.href}):((b.body.style.overflow="hidden"),b.querySelectorAll("body > :not("+c+")").forEach(x=>x.setAttribute("inert",d)),(e.style.display="block")))};document.addEventListener("astro:after-swap",a);a()</script>
<script is:inline>(function (){let b=document,c="#modal-age-restricted",d="true",e=b.querySelector("body > "+c),f="ageVerified",g="searchParams",h=localStorage,i=new URL(b.location),j=history;i[g].get(f)===d&&(h[f]=d,j&&(i[g].delete(f),j.replaceState({},"",i)));e&&(h[f]===d?b.querySelectorAll("a[href][data-age-restricted]").forEach(x=>{let y=new URL(x.href);y[g].set(f,d);x.href=y.href}):((b.body.style.overflow="hidden"),b.querySelectorAll("body > :not("+c+")").forEach(x=>x.setAttribute("inert",d)),(e.style.display="block")))})()</script>

8
src/components/DarkModeScript.astro
View file

@ -5,7 +5,6 @@ import DarkModeScriptInline from "./DarkModeScriptInline.astro";
<DarkModeScriptInline />
<script>
import { ENABLE_VIEW_TRANSITIONS } from "astro:env/client";
type ColorScheme = "auto" | "dark" | "light" | undefined;
const colorSchemeSetup = () => {
@ -31,9 +30,6 @@ import DarkModeScriptInline from "./DarkModeScriptInline.astro";
button.setAttribute("aria-hidden", "false");
});
};
if (ENABLE_VIEW_TRANSITIONS) {
document.addEventListener("astro:page-load", colorSchemeSetup);
} else {
colorSchemeSetup();
}
colorSchemeSetup();
</script>

2
src/components/DarkModeScriptInline.astro
View file

@ -1,4 +1,4 @@
---
---
<script is:inline>function a(){var b="dark",c="auto",d="colorScheme",e=document.body.classList,f=localStorage,g=f[d];g&&g!==c?g===b&&e.add(b):(f[d]=c,matchMedia("(prefers-color-scheme: dark)").matches&&e.add(b))};document.addEventListener("astro:after-swap",a);a()</script>
<script is:inline>(function (){var b="dark",c="auto",d="colorScheme",e=document.body.classList,f=localStorage,g=f[d];g&&g!==c?g===b&&e.add(b):(f[d]=c,matchMedia("(prefers-color-scheme: dark)").matches&&e.add(b))})()</script>

17
src/layouts/BaseLayout.astro
View file

@ -1,6 +1,4 @@
---
import { ViewTransitions } from "astro:transitions";
import { ENABLE_VIEW_TRANSITIONS } from "astro:env/client";
import "../styles/base.css";
import "../styles/fonts.css";
import DarkModeScript from "../components/DarkModeScript.astro";
@ -29,23 +27,10 @@ const title = pageTitle ? `${pageTitle} | Bad Manners` : "Bad Manners";
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="generator" content={Astro.generator} />
<title>{title}</title>
<link
rel="alternate"
type="application/rss+xml"
href={new URL("/feed.xml", Astro.site)}
title="Commission status"
/>
<link
rel="alternate"
type="application/rss+xml"
href="https://gallery.badmanners.xyz/feed.xml"
title="Gallery feed"
/>
<meta property="og:title" content={title} />
<slot name="head-description" />
<meta property="og:url" content={Astro.url} />
<meta content="/logo.webp" property="og:image" />
{ENABLE_VIEW_TRANSITIONS ? <ViewTransitions /> : null}
<slot name="head" />
</head>
<body>
<div class="flex min-h-screen flex-col">

2
src/pages/404.astro
View file

@ -3,7 +3,7 @@ import BaseLayout from "../layouts/BaseLayout.astro";
---
<BaseLayout pageTitle="Not found">
<meta slot="head-description" property="og:description" content="Not found." />
<meta slot="head" property="og:description" content="Not found." />
<article aria-labelledby="title-not-found">
<h1 id="title-not-found" class="text-2xl sm:text-3xl">404 &ndash; Not found</h1>
<section>

10
src/pages/about.astro
View file

@ -6,7 +6,7 @@ import { ImageSamStickerJuicebox } from "../assets/images";
---
<BaseLayout pageTitle="About me">
<meta slot="head-description" property="og:description" content="About Bad Manners." />
<meta slot="head" property="og:description" content="About Bad Manners." />
<article class="h-card" aria-labelledby="title-about-me">
<h1 id="title-about-me" class="text-2xl sm:text-3xl">About me</h1>
<section>
@ -64,7 +64,6 @@ import { ImageSamStickerJuicebox } from "../assets/images";
</BaseLayout>
<script>
import { ENABLE_VIEW_TRANSITIONS } from "astro:env/client";
import tippy from "tippy.js";
import "tippy.js/dist/tippy.css";
@ -73,9 +72,6 @@ import { ImageSamStickerJuicebox } from "../assets/images";
theme: "bm",
});
};
if (ENABLE_VIEW_TRANSITIONS) {
document.addEventListener("astro:page-load", initTooltips);
} else {
initTooltips();
}
initTooltips();
</script>

14
src/pages/api/healthcheck.ts Normal file
View file

@ -0,0 +1,14 @@
import type { APIRoute } from "astro";
export type HealthcheckResponse = {
isAlive: true;
};
export const GET: APIRoute = () => {
if (import.meta.env.PROD) {
return new Response(null, { status: 404 });
}
return new Response(JSON.stringify({ isAlive: !false } satisfies HealthcheckResponse), {
headers: { "Content-Type": "application/json; charset=utf-8" },
});
};

4
src/pages/feed.xml.ts
View file

@ -8,14 +8,14 @@ export const GET: APIRoute = ({ site }) => {
title: "Bad Manners",
description: "Bad Manners status updates",
site: site!,
items: TOS_FEED.map(({ status, updatedAt }, i) => ({
items: TOS_FEED.map(({ status, updatedAt }) => ({
title: {
CLOSED: "Story commissions are closed.",
OPEN: "Story commissions are open!",
SEMI_OPEN: "Story commissions are semi-open, and I may accept them less frequently.",
PRIVATE: "Story commissions are private; they are only open to select commissioners.",
}[status],
link: i === 0 ? "https://badmanners.xyz/terms_of_service" : undefined,
link: "https://badmanners.xyz/terms_of_service",
pubDate: subMinutes(dateSet(updatedAt, { hours: 12, minutes: 0, seconds: 0 }), updatedAt.getTimezoneOffset()),
})),
});

28
src/pages/index.astro
View file

@ -35,11 +35,21 @@ import {
---
<BaseLayout>
<meta
slot="head-description"
property="og:description"
content="Safe vore enthusiast, mimic hybrid furry, and occasional writer."
/>
<Fragment slot="head">
<meta property="og:description" content="Safe vore enthusiast, mimic hybrid furry, and occasional writer." />
<link
rel="alternate"
type="application/rss+xml"
href={new URL("/feed.xml", Astro.site)}
title="Commission status"
/>
<link
rel="alternate"
type="application/rss+xml"
href="https://gallery.badmanners.xyz/feed.xml"
title="Gallery feed"
/>
</Fragment>
<article class="h-card" aria-label="Homepage of Bad Manners">
<h1 id="title-home" class="pb-4 text-3xl tracking-tight sm:text-5xl">
Hi, I'm <span class="p-name font-medium">Bad Manners</span>!
@ -618,7 +628,6 @@ import {
</BaseLayout>
<script>
import { ENABLE_VIEW_TRANSITIONS } from "astro:env/client";
import tippy, { hideAll } from "tippy.js";
import "tippy.js/dist/tippy.css";
@ -689,9 +698,6 @@ import {
element.addEventListener("click", onClickElement);
});
};
if (ENABLE_VIEW_TRANSITIONS) {
document.addEventListener("astro:page-load", initIndexIcons);
} else {
initIndexIcons();
}
initIndexIcons();
</script>

2
src/pages/sam_brendan.astro
View file

@ -6,7 +6,7 @@ import { ImageSamAllStickers, ImageSamRefsheet } from "../assets/images";
---
<BaseLayout pageTitle="Sam Brendan">
<meta slot="head-description" property="og:description" content="Mimic x maned wolf hybrid." />
<meta slot="head" property="og:description" content="Mimic x maned wolf hybrid." />
<article class="h-card" aria-labelledby="title-sam-brendan">
<h1 id="title-sam-brendan" class="p-name text-2xl sm:text-3xl">Sam Brendan</h1>
<section>

13
src/pages/terms_of_service.astro
View file

@ -6,7 +6,10 @@ import { TOS_COMMISSION_STATUS, TOS_UPDATED_AT } from "../data/tos";
---
<BaseLayout pageTitle="Terms of Service">
<meta slot="head-description" property="og:description" content="My Terms of Service for story commissions." />
<Fragment slot="head">
<meta property="og:description" content="My Terms of Service for story commissions." />
<link rel="alternate" type="application/rss+xml" href={new URL("/feed.xml", Astro.site)} title="RSS feed" />
</Fragment>
<article aria-labelledby="title-tos">
<h1 id="title-tos" class="mb-4 text-2xl sm:mb-5 sm:text-3xl">Terms of Service for story commissions</h1>
<section aria-label="Commission status">
@ -28,23 +31,23 @@ import { TOS_COMMISSION_STATUS, TOS_UPDATED_AT } from "../data/tos";
</a>
</div>
{
TOS_COMMISSION_STATUS == "CLOSED" ? (
TOS_COMMISSION_STATUS === "CLOSED" ? (
<p id="status" class="mb-4 text-2xl font-medium uppercase sm:mb-8 sm:px-5 md:px-6">
Commissions are
<span class="text-red-600 dark:text-red-500">closed</span>.
</p>
) : TOS_COMMISSION_STATUS == "OPEN" ? (
) : TOS_COMMISSION_STATUS === "OPEN" ? (
<p id="status" class="mb-4 text-2xl font-medium uppercase sm:mb-8 sm:px-5 md:px-6">
Commissions are <span class="text-bm-500 dark:text-bm-400">open</span>.
</p>
) : TOS_COMMISSION_STATUS == "SEMI_OPEN" ? (
) : TOS_COMMISSION_STATUS === "SEMI_OPEN" ? (
<p id="status" class="mb-4 text-2xl font-medium sm:mb-8 sm:px-5 md:px-6">
<span class="uppercase">
Commissions are <span class="text-orange-600 dark:text-orange-500">semi-open</span>
</span>
. I'll be more picky about which commissions to take.
</p>
) : TOS_COMMISSION_STATUS == "PRIVATE" ? (
) : TOS_COMMISSION_STATUS === "PRIVATE" ? (
<p id="status" class="mb-4 text-2xl font-medium sm:mb-8 sm:px-5 md:px-6">
<span class="uppercase">
Commissions are <span class="text-red-600 dark:text-red-500">private</span>

24
src/pages/work.astro
View file

@ -15,7 +15,21 @@ import { SUBSCRIBESTAR_ENABLED } from "../data/subscribestar";
---
<BaseLayout pageTitle="My work">
<meta slot="head-description" property="og:description" content="The things I've made." />
<Fragment slot="head">
<meta property="og:description" content="The things I've made." />
<link
rel="alternate"
type="application/rss+xml"
href={new URL("/feed.xml", Astro.site)}
title="Commission status"
/>
<link
rel="alternate"
type="application/rss+xml"
href="https://gallery.badmanners.xyz/feed.xml"
title="Gallery feed"
/>
</Fragment>
<article aria-labelledby="title-my-work" class="sm:px-5 md:px-6">
<h1 id="title-my-work" class="text-2xl sm:text-3xl">My work</h1>
<section>
@ -122,7 +136,7 @@ import { SUBSCRIBESTAR_ENABLED } from "../data/subscribestar";
<section id="commissions" aria-labelledby="title-story-commissions">
<h2 id="title-story-commissions" class="my-4 text-lg sm:my-6 sm:text-2xl">Story commissions</h2>
{
TOS_COMMISSION_STATUS == "CLOSED" ? (
TOS_COMMISSION_STATUS === "CLOSED" ? (
<p class="mb-6 mt-2 sm:mt-3 sm:px-5">
My story commissions are currently closed, but regardless, feel free to{" "}
<a href="/terms_of_service" class="text-link transition-colors motion-reduce:transition-none">
@ -130,7 +144,7 @@ import { SUBSCRIBESTAR_ENABLED } from "../data/subscribestar";
</a>{" "}
if interested.
</p>
) : TOS_COMMISSION_STATUS == "OPEN" ? (
) : TOS_COMMISSION_STATUS === "OPEN" ? (
<p class="mb-6 mt-2 sm:mt-3 sm:px-5">
My story commissions are currently open! Feel free to{" "}
<a class="text-link transition-colors motion-reduce:transition-none" href="/terms_of_service">
@ -138,7 +152,7 @@ import { SUBSCRIBESTAR_ENABLED } from "../data/subscribestar";
</a>{" "}
if interested.
</p>
) : TOS_COMMISSION_STATUS == "SEMI_OPEN" ? (
) : TOS_COMMISSION_STATUS === "SEMI_OPEN" ? (
<p class="mb-6 mt-2 sm:mt-3 sm:px-5">
My story commissions are currently semi-open, meaning that I may take some commissions, but might reject or
postpone them more easily. Feel free to{" "}
@ -147,7 +161,7 @@ import { SUBSCRIBESTAR_ENABLED } from "../data/subscribestar";
</a>{" "}
if interested.
</p>
) : TOS_COMMISSION_STATUS == "PRIVATE" ? (
) : TOS_COMMISSION_STATUS === "PRIVATE" ? (
<p class="mb-6 mt-2 sm:mt-3 sm:px-5">
My story commissions are currently private, meaning that I'm not offering slots publicly, but I may still
work on commissions for specific clients. Regardless of whether this applies to you or not, feel free to{" "}