Robots, Trusted Types, and various other bits...

2026-02-06 21:07:57 -03:00
parent a52938f6cf
commit 9db2592cf4
13 changed files with 65 additions and 12 deletions
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -13,7 +13,7 @@ This repo is a **one-page static** Linktree-style site for mifi.dev. It is **not
 - **Critical CSS** via post-build script (`scripts/critical-css.mjs`); full build with critical CSS is `pnpm run build:full` (run `pnpm run critical-css:install` once to install Chromium)
 - **CSP-safe scripts:** Post-build `scripts/externalize-inline-script.mjs` moves SvelteKit’s inline bootstrap script to `_app/immutable/bootstrap.[hash].js` so CSP can use `script-src 'self'` without `unsafe-inline`
 - **Content:** JSON in `src/lib/data/` (e.g. `links.json`), loaded in `+page.server.ts` at build time
- **CSP:** Set by Traefik middleware; do not add CSP in app code
+- **CSP:** Set by Traefik middleware; do not add CSP in app code. Middleware must not use `require-trusted-types-for 'script'` (Svelte hydration is incompatible).

 ## Conventions

--- a/README.md
+++ b/README.md
@@ -155,3 +155,5 @@ pyftsubset ~/Downloads/Fraunces/fraunces-variable-opsz-wght.ttf \
 ## CSP

 CSP is set via Traefik middleware, not in app code.
+
+**Trusted Types:** This app is not compatible with `require-trusted-types-for 'script'`. Svelte’s runtime assigns to DOM sinks (e.g. `innerHTML`) during hydration, which that directive blocks. The Traefik middleware used for mifi.dev/mifi.bio must not include `require-trusted-types-for 'script'` (or the site will break with "This assignment requires a TrustedHTML").
--- a/nginx/default.conf
+++ b/nginx/default.conf
@@ -16,6 +16,15 @@ server {
        alias /usr/share/nginx/html/dev/.well-known/dev.com.chrome.devtools.json;
        add_header Cache-Control "public, max-age=86400";
    }
+    location = /robots.txt {
+        alias /usr/share/nginx/html/dev/robots-dev.txt;
+        add_header Cache-Control "public, max-age=86400";
+    }
+    location = /sitemap.xml {
+        alias /usr/share/nginx/html/dev/sitemap-dev.xml;
+        add_header Cache-Control "public, max-age=86400";
+        add_header Content-Type "application/xml; charset=utf-8";
+    }

    include /etc/nginx/snippets/cache-rules.conf;

@@ -41,6 +50,15 @@ server {
        alias /usr/share/nginx/html/bio/.well-known/bio.com.chrome.devtools.json;
        add_header Cache-Control "public, max-age=86400";
    }
+    location = /robots.txt {
+        alias /usr/share/nginx/html/bio/robots-bio.txt;
+        add_header Cache-Control "public, max-age=86400";
+    }
+    location = /sitemap.xml {
+        alias /usr/share/nginx/html/bio/sitemap-bio.xml;
+        add_header Cache-Control "public, max-age=86400";
+        add_header Content-Type "application/xml; charset=utf-8";
+    }

    include /etc/nginx/snippets/cache-rules.conf;

--- a/src/app.html
+++ b/src/app.html
@@ -3,7 +3,7 @@
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
-        <script src="/assets/js/theme-store.js"></script>
+        <script src="/assets/js/bootstrap.js"></script>
        %sveltekit.head%
    </head>
    <body data-sveltekit-preload-data="hover">
--- a/src/lib/components/LinkGroup.svelte
+++ b/src/lib/components/LinkGroup.svelte
@@ -33,7 +33,7 @@

 <style>
    .link-section-heading {
-        color: var(--color-primary);
+        color: var(--color-primary-muted);
        font-family: var(--font-heading, var(--font-sans));
        font-size: 1.125rem;
        font-weight: 500;
--- a/static/assets/js/bootstrap.js
+++ b/static/assets/js/bootstrap.js
@@ -0,0 +1,12 @@
+(function () {
+    // Default Trusted Type policy so Svelte hydration can assign to innerHTML under CSP require-trusted-types-for 'script'.
+    if (typeof window.trustedTypes !== 'undefined' && window.trustedTypes.createPolicy) {
+        try {
+            window.trustedTypes.createPolicy('default', { createHTML: function (input) { return input; } });
+        } catch { /* policy already exists */ }
+    }
+
+    var t = localStorage.getItem('mifi-theme');
+    if (t === 'light' || t === 'dark') document.documentElement.setAttribute('data-theme', t);
+    else document.documentElement.removeAttribute('data-theme');
+})();
--- a/static/assets/js/theme-store.js
+++ b/static/assets/js/theme-store.js
@@ -1,5 +0,0 @@
-(function () {
-    var t = localStorage.getItem('mifi-theme');
-    if (t === 'light' || t === 'dark') document.documentElement.setAttribute('data-theme', t);
-    else document.documentElement.removeAttribute('data-theme');
-})();
--- a/static/assets/tokens-bio.css
+++ b/static/assets/tokens-bio.css
@@ -50,7 +50,7 @@
        --color-border: hsl(220 14% 20%);
        --color-border-subtle: hsl(220 12% 16%);
        --color-primary: hsl(220 55% 62%);
-        --color-primary-muted: hsl(220 45% 55%);
+        --color-primary-muted: hsl(220 45% 62%);
        --color-secondary: hsl(330 50% 65%);
        --color-secondary-muted: hsl(330 42% 58%);
        --color-accent: hsl(220 55% 62%);
@@ -93,7 +93,7 @@
    --color-border: hsl(220 14% 20%);
    --color-border-subtle: hsl(220 12% 16%);
    --color-primary: hsl(220 55% 62%);
-    --color-primary-muted: hsl(220 45% 55%);
+    --color-primary-muted: hsl(220 45% 62%);
    --color-secondary: hsl(330 50% 65%);
    --color-secondary-muted: hsl(330 42% 58%);
    --color-accent: hsl(220 55% 62%);
--- a/static/assets/tokens-dev.css
+++ b/static/assets/tokens-dev.css
@@ -42,7 +42,7 @@
        --color-border: hsl(260 15% 22%);
        --color-border-subtle: hsl(260 12% 18%);
        --color-primary: hsl(262 70% 65%);
-        --color-primary-muted: hsl(262 50% 58%);
+        --color-primary-muted: hsl(262 50% 65%);
        --color-secondary: hsl(220 25% 68%);
        --color-secondary-muted: hsl(220 20% 58%);
        --color-accent: hsl(262 70% 65%);
@@ -85,7 +85,7 @@
    --color-border: hsl(260 15% 22%);
    --color-border-subtle: hsl(260 12% 18%);
    --color-primary: hsl(262 70% 65%);
-    --color-primary-muted: hsl(262 50% 58%);
+    --color-primary-muted: hsl(262 50% 65%);
    --color-secondary: hsl(220 25% 68%);
    --color-secondary-muted: hsl(220 20% 58%);
    --color-accent: hsl(262 70% 65%);
--- a/static/robots-bio.txt
+++ b/static/robots-bio.txt
@@ -0,0 +1,4 @@
+User-agent: *
+Allow: /
+
+Sitemap: https://mifi.bio/sitemap.xml
--- a/static/robots-dev.txt
+++ b/static/robots-dev.txt
@@ -0,0 +1,4 @@
+User-agent: *
+Allow: /
+
+Sitemap: https://mifi.dev/sitemap.xml
--- a/static/sitemap-bio.xml
+++ b/static/sitemap-bio.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+    <url>
+        <loc>https://mifi.bio/</loc>
+        <lastmod>2026-02-06</lastmod>
+        <changefreq>weekly</changefreq>
+        <priority>1.0</priority>
+    </url>
+</urlset>
--- a/static/sitemap-dev.xml
+++ b/static/sitemap-dev.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+    <url>
+        <loc>https://mifi.dev/</loc>
+        <lastmod>2026-02-06</lastmod>
+        <changefreq>weekly</changefreq>
+        <priority>1.0</priority>
+    </url>
+</urlset>