stuff

package.json

@@ -13,9 +13,10 @@
   },
   "devDependencies": {
     "@poppanator/sveltekit-svg": "^5.0.0-svelte5.5",
-    "@sveltejs/adapter-auto": "^3.0.0",
-    "@sveltejs/adapter-cloudflare": "^4.7.2",
-    "@sveltejs/kit": "^2.0.0",
+    "@sveltejs/adapter-auto": "^3.3.1",
+    "@sveltejs/adapter-cloudflare": "^4.9.0",
+    "@sveltejs/enhanced-img": "^0.4.4",
+    "@sveltejs/kit": "^2.16.1",
     "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6",
     "eslint": "^8.28.0",
     "eslint-config-prettier": "^9.1.0",

src/hooks.server.ts

@@ -6,16 +6,16 @@ const PRELOADED_FONTS = [TextFontURL];
 
 export const handle: Handle = async ({ event, resolve }) => {
   const response = await resolve(event);
-  
+
   // To be silly, send 2 gigabytes of <div>
-  if (response.status === 404 && event.url.pathname.includes("wp-")) {
+  if (response.status === 404 && event.url.pathname.includes('wp-')) {
     return new Response(Bomb, {
       status: 200,
       headers: {
         'Content-Encoding': 'zstd',
         'Content-Type': 'text/html'
       }
-    })
+    });
   }
 
   // Disable JS preloading. This took hours to find.
@@ -29,35 +29,23 @@ export const handle: Handle = async ({ event, resolve }) => {
   for (const asset of PRELOADED_FONTS) {
     link.push(`<${asset}>; rel="preload"; as="font"; crossorigin="anonymous"`);
   }
-  
+
   link.push(`</api/background.svg>; rel="preload"; as="image";`);
-  
+
   response.headers.set('link', link.join(','));
   response.headers.set(
     'Accept-CH',
     'Width, Viewport-Width, Sec-CH-Width, Sec-CH-Viewport-Width, Sec-CH-Viewport-Height, Sec-CH-UA-Mobile'
   );
-  response.headers.set(
-    'Referer',
-    'no-referrer'
-  )
+  response.headers.set('Referer', 'no-referrer');
   response.headers.set(
     'Strict-Transport-Security',
     // STS for 1 decade on all subdomains
     'max-age=315360000; includeSubDomains; preload'
-  )
-  response.headers.set(
-    'X-Content-Type-Options',
-    'nosniff'
-  )
-  response.headers.set(
-    'X-Frame-Options',
-    'DENY'
-  )
-  response.headers.set(
-    'Cross-Origin-Resource-Policy',
-    'same-origin'
-  )
+  );
+  response.headers.set('X-Content-Type-Options', 'nosniff');
+  response.headers.set('X-Frame-Options', 'DENY');
+  response.headers.set('Cross-Origin-Resource-Policy', 'same-origin');
 
   return response;
 };

src/lib/components/EmailLanding.svelte

@@ -1,14 +1,14 @@
 <script>
   import Page from '$lib/components/Page.svelte';
   import { onMount } from 'svelte';
-  
+
   let { title, noscriptBody, scriptBody, buttonText } = $props();
-  
+
   let form = $state();
-  
+
   onMount(() => {
     form.submit();
-  })
+  });
 </script>
 
 <Page {title}>

src/lib/components/Page.svelte

@@ -6,15 +6,15 @@
   <title>{title} | Revolution</title>
 </svelte:head>
 
-<main class:inverted={inverted}>
+<main class:inverted>
   <div class="content">
     {@render children?.()}
   </div>
 </main>
 
 <style lang="scss">
   @use 'src/lib/style';
-  
+
   .content {
     margin: auto;
     padding: 4em 2em;
@@ -24,12 +24,13 @@
     flex-direction: column;
     gap: 0.5em;
   }
-  
+
   .inverted {
-    filter: #{"grayscale(50%) invert()"};
+    filter: #{'grayscale(50%) invert()'};
   }
-  
-  main :global(button), main :global(.style-button) {
+
+  main :global(button),
+  main :global(.style-button) {
     display: block;
     text-decoration: none;
     font-weight: bold;

src/lib/emails/email.ts

@@ -36,7 +36,7 @@ export async function sendEmail<T extends Record<string, any>>(
   host: URL
 ) {
   const { html, plain } = renderEmail(component, props, host);
-  
+
   if (dev) {
     console.log(`Sent email to ${recipient}: ${plain}`);
     return;

src/lib/style.scss

@@ -46,7 +46,7 @@ $size_lg: 64rem;
       box-shadow 100ms,
       transform 100ms,
       filter 100ms;
-      
+
     @media (prefers-reduced-motion) {
       transition: none;
     }

src/routes/+layout.svelte

@@ -135,7 +135,7 @@
       @media (min-width: style.$size_md) {
         --transform: translate(calc(50% - 8em), calc(50% - 2em));
       }
-      
+
       @media (prefers-reduced-motion) {
         animation: none;
         transform: var(--transform);
@@ -153,10 +153,10 @@
 
       @include style.brick-texture();
     }
-    
+
     :global(.bricks) {
       display: none;
-      
+
       @media (min-width: style.$size_sm) {
         pointer-events: none;
         display: block;
@@ -188,7 +188,7 @@
         width: 3em;
         height: 3em;
         align-self: center;
-        
+
         stroke: rgb(var(--fg));
       }