Credit Texgriddy and Fredoka; rename the color scheme to Slate #12

Merged
branderson merged 1 commits from credit-texgriddy into main 2026-10-15 16:24:18 -07:00
4 changed files with 15 additions and 4 deletions
+5
View File
@@ -192,6 +192,11 @@ and development. Useful starting points:
- [Ruffle](https://ruffle.rs/), for running Flash in modern browsers.
- [Selkies](https://github.com/selkies-project/selkies), which streams the
games.
- [Texgriddy](https://github.com/Weestuarty/texgriddy-es-de) by Weestuarty, an
ES-DE theme that inspired the site's look. The look was recreated from scratch
in CSS; none of Texgriddy's files, images or fonts are used.
- [Fredoka](https://fontsource.org/fonts/fredoka) (SIL Open Font License), the
display font.
## Legal
+7 -1
View File
@@ -30,9 +30,15 @@ tokens are applied to `<body>` while the portal is mounted, which takes
precedence over the app theme on `<html>` and also reaches dialogs and menus
rendered into the body.
One scheme ships, **Chilled** (slate background, sage boxes). Adding a scheme
One scheme ships, **Slate** (slate background, sage boxes). Adding a scheme
means adding an entry to `PORTAL_SCHEMES`; no component changes are needed.
The portal's look is inspired by
[Texgriddy](https://github.com/Weestuarty/texgriddy-es-de), an ES-DE theme by
Weestuarty: the framed page, glossy tiles with a metallic ring, outlined info
boxes, capsule buttons and the slate and sage palette. It was recreated from
scratch in CSS; none of Texgriddy's files, images or fonts are used.
Display text uses Fredoka (OFL, bundled via `@fontsource-variable/fredoka`);
body text uses Verdana.
@@ -25,7 +25,7 @@ export function PortalLayout() {
const searchRef = useRef<HTMLInputElement>(null);
const [rolling, setRolling] = useState(false);
useEffect(() => applyPortalScheme('chilled'), []);
useEffect(() => applyPortalScheme('slate'), []);
useMatureSync();
const playRandom = async () => {
+2 -2
View File
@@ -8,8 +8,8 @@ export interface PortalScheme {
}
export const PORTAL_SCHEMES = {
chilled: {
label: 'Chilled',
slate: {
label: 'Slate',
tokens: {
'--p-bg': '#4c6878',
'--p-bg-mix': '#2f4553',