chore: deno fmt

components/Image.tsx

@@ -64,8 +64,9 @@ const Image = (
         style={props.style}
         srcset={responsiveAttributes.srcset}
         sizes={responsiveAttributes.sizes}
-        src={`/api/images?image=${asset(props.src)}${props.width ? `&width=${props.width}` : ""
+        src={`/api/images?image=${asset(props.src)}${
-          }${props.height ? `&height=${props.height}` : ""}`}
+          props.width ? `&width=${props.width}` : ""
+        }${props.height ? `&height=${props.height}` : ""}`}
         width={props.width}
         height={props.height}
         class={props.class}

components/PageHero.tsx

@@ -20,8 +20,9 @@ function Wrapper(
 ) {
   return (
     <div
-      class={`flex justify-between flex-col relative w-full ${image ? "min-h-[400px]" : "min-h-[200px]"
+      class={`flex justify-between flex-col relative w-full ${
-        } rounded-3xl overflow-hidden`}
+        image ? "min-h-[400px]" : "min-h-[200px]"
+      } rounded-3xl overflow-hidden`}
     >
       <HeroContext.Provider value={{ image }}>
         {image &&
@@ -51,8 +52,9 @@ function Title(
   return (
     <OuterTag
       href={link}
-      class={`${ctx.image ? "noisy-gradient" : ""
+      class={`${
-        } after:opacity-90 flex gap-4 items-center ${ctx.image ? "pt-12" : ""}`}
+        ctx.image ? "noisy-gradient" : ""
+      } after:opacity-90 flex gap-4 items-center ${ctx.image ? "pt-12" : ""}`}
     >
       <h2
         class="flex gap-2 items-center text-4xl font-bold z-10"
@@ -81,8 +83,9 @@ function EditLink({ href }: { href: string }) {
   const ctx = useContext(HeroContext);
   return (
     <a
-      class={`px-4 py-2 ${ctx.image ? "bg-gray-300 text-gray-800" : "text-gray-200"
+      class={`px-4 py-2 ${
-        } rounded-lg flex gap-1 items-center`}
+        ctx.image ? "bg-gray-300 text-gray-800" : "text-gray-200"
+      } rounded-lg flex gap-1 items-center`}
       href={href}
     >
       <IconEdit class="w-5 h-5" />

compose.yml

@@ -4,10 +4,10 @@ services:
       context: .
       dockerfile: Dockerfile
     volumes:
-      - .:/app  # Mount the local directory to /app in the container
+      - .:/app # Mount the local directory to /app in the container
-    working_dir: /app  # Set the working directory inside the container to /app
+    working_dir: /app # Set the working directory inside the container to /app
-    command: run --env-file -A --watch=static/,routes/ dev.ts  # Custom start command
+    command: run --env-file -A --watch=static/,routes/ dev.ts # Custom start command
     ports:
-      - "8000:8000"  # Expose the container port
+      - "8000:8000" # Expose the container port
     environment:
-      - DATA_DIR=/app/data  # Set the environment variable inside the container
+      - DATA_DIR=/app/data # Set the environment variable inside the container

islands/IngredientsList.tsx

@@ -62,15 +62,15 @@ export const IngredientsList: FunctionalComponent<
 > = (
   { ingredients, amount, portion },
 ) => {
-    return (
+  return (
-      <table class="w-full border-collapse table-auto">
+    <table class="w-full border-collapse table-auto">
-        <tbody>
+      <tbody>
-          {ingredients.map((item) => {
+        {ingredients.map((item) => {
-            return (
+          return (
-              <Ingredient ingredient={item} amount={amount} portion={portion} />
+            <Ingredient ingredient={item} amount={amount} portion={portion} />
-            );
+          );
-          })}
+        })}
-        </tbody>
+      </tbody>
-      </table>
+    </table>
-    );
+  );
-  };
+};

islands/KMenu/types.ts

@@ -6,7 +6,7 @@ type IconKey = keyof typeof icons;
 export type MenuState = {
   activeMenu: Signal<string>;
   activeState: Signal<"input" | "error" | "normal" | "loading">;
-  loadingText:Signal<string>;
+  loadingText: Signal<string>;
   commandInput: Signal<string>;
   visible: Signal<boolean>;
   menus: Record<string, Menu>;

islands/Search.tsx

@@ -191,16 +191,16 @@ const Search = (
       {data.value?.length && !isLoading.value
         ? <SearchResultList showEmoji={!type} result={data.value} />
         : isLoading.value
-          ? <div />
+        ? <div />
-          : (
+        : (
-            <div
+          <div
-              class="flex items-center gap-2 p-2 my-4 mx-3"
+            class="flex items-center gap-2 p-2 my-4 mx-3"
-              style={{ color: "#818181" }}
+            style={{ color: "#818181" }}
-            >
+          >
-              <Emoji class="w-8 h-8" name="Ghost.png" />
+            <Emoji class="w-8 h-8" name="Ghost.png" />
-              No Results
+            No Results
-            </div>
+          </div>
-          )}
+        )}
     </div>
   );
 };

lib/hooks/useDebouncedCallback.ts

@@ -283,4 +283,3 @@ export default function useDebouncedCallback<
 
   return debounced;
 }
-

lib/hooks/useThrottledCallback.ts

@@ -52,4 +52,3 @@ const useThrottledCallback = (
 };
 
 export default useThrottledCallback;
-

lib/marka/index.ts

@@ -12,7 +12,7 @@ async function addImageToResource<T extends GenericResource>(
   if (imageUrl) {
     try {
       const absoluteImageUrl = (imageUrl.startsWith("https://") ||
-        imageUrl.startsWith("http://"))
+          imageUrl.startsWith("http://"))
         ? imageUrl
         : `${url}/${imageUrl}`;
       const image = await getImage(absoluteImageUrl);

lib/openai.ts

@@ -35,7 +35,8 @@ export async function summarize(content: string) {
       {
         role: "user",
         content:
-          `Please summarize the article in one sentence as short as possible: ${content.slice(0, 2000)
+          `Please summarize the article in one sentence as short as possible: ${
+            content.slice(0, 2000)
           }`,
       },
     ],
@@ -102,7 +103,8 @@ export async function createGenres(
       {
         role: "system",
         content:
-          `you create some keywords that can be used in a recommendation system. The keywords are based on a ${type} description or title. If you do not know the title, take into account the description aswell. Create a range of keywords from very specific ones that describe the general vibe. ${title ? `The name of the ${type} is ${title}` : ""
+          `you create some keywords that can be used in a recommendation system. The keywords are based on a ${type} description or title. If you do not know the title, take into account the description aswell. Create a range of keywords from very specific ones that describe the general vibe. ${
+            title ? `The name of the ${type} is ${title}` : ""
           }. Return a list of around 20 keywords seperated by commas`,
       },
       {
@@ -166,7 +168,8 @@ export const getMovieRecommendations = async (
 
 ${keywords} 
 
-The movies should be similar to but not include ${exclude.join(", ")
+The movies should be similar to but not include ${
+            exclude.join(", ")
           } or remakes of that.
 
 respond with a plain unordered list each item starting with the year the movie was released and then the title of the movie seperated by a -`,

lib/taskManager.ts

@@ -48,8 +48,9 @@ export async function endTask(chatId: string): Promise<string | null> {
         finalNote += "**[Voice message could not be transcribed]**\n\n";
       }
     } else if (entry.type === "photo") {
-      const photoUrl = `${task.noteName.replace(/\.md$/, "")
+      const photoUrl = `${
-        }/photo-${photoIndex++}.jpg`;
+        task.noteName.replace(/\.md$/, "")
+      }/photo-${photoIndex++}.jpg`;
 
       finalNote += `**Photo**:\n ${photoUrl}\n\n`;
       photoTasks.push({

routes/admin/log/index.tsx

@@ -42,7 +42,7 @@ function LogLine(
         <span class="bg-gray-600 py-1 px-2 text-xs rounded-xl text-white">
           {log.date.getHours().toString().padStart(2, "0")}:{log.date
             .getMinutes().toString().padStart(2, "0")}:{log.date.getSeconds()
-              .toString().padStart(2, "0")} {formatDate(log.date)}
+            .toString().padStart(2, "0")} {formatDate(log.date)}
         </span>
         <span class="bg-gray-600 py-1 px-2 text-xs rounded-xl text-white">
           {log.scope}

routes/api/images/index.ts

@@ -62,10 +62,11 @@ function parseParams(reqUrl: URL): ImageParams | string {
 // Helper function to generate ETag
 async function generateETag(content: ArrayBuffer): Promise<string> {
   const hashBuffer = await crypto.subtle.digest("SHA-256", content);
-  return `"${Array.from(new Uint8Array(hashBuffer))
+  return `"${
+    Array.from(new Uint8Array(hashBuffer))
       .map((b) => b.toString(16).padStart(2, "0"))
       .join("")
-    }"`;
+  }"`;
 }
 
 async function GET(req: Request, _ctx: FreshContext): Promise<Response> {

routes/api/recipes/create/index.ts

@@ -70,8 +70,9 @@ async function processCreateRecipeFromUrl(
 
   if (newRecipe?.image && newRecipe.image.length > 5) {
     const extension = fileExtension(new URL(newRecipe.image).pathname);
-    const finalPath = `resources/recipes/images/${safeFileName(id)
+    const finalPath = `resources/recipes/images/${
-      }_cover.${extension}`;
+      safeFileName(id)
+    }_cover.${extension}`;
     streamResponse.enqueue("downloading image");
     try {
       streamResponse.enqueue("downloading image");

routes/api/recommendation/all.ts

@@ -42,7 +42,8 @@ async function processUpdateRecommendations(
     }
     done++;
     streamResponse.enqueue(
-      `${Math.floor((done / total) * 100)}% [${done + 1
+      `${Math.floor((done / total) * 100)}% [${
+        done + 1
       }/${total}] ${movie.name}`,
     );
   })).catch((err) => {

routes/api/series/enhance/[name].ts

@@ -46,7 +46,7 @@ const POST = async (
   }
   const posterPath = seriesDetails.poster_path;
   const director = seriesCredits &&
-    seriesCredits.crew?.filter?.((person) => person.job === "Director")[0] ||
+      seriesCredits.crew?.filter?.((person) => person.job === "Director")[0] ||
     seriesDetails?.created_by?.[0];
   if (director && director.name && !series.meta?.author) {
     series.author = series.author || {};

routes/articles/[name].tsx

@@ -12,15 +12,16 @@ import { MetaTags } from "@components/MetaTags.tsx";
 import { fetchResource } from "@lib/marka/index.ts";
 import { ArticleResource } from "@lib/marka/schema.ts";
 
-export const handler: Handlers<{ article: ArticleResource; session: unknown }> = {
+export const handler: Handlers<{ article: ArticleResource; session: unknown }> =
-  async GET(_, ctx) {
+  {
-    const article = await fetchResource(`articles/${ctx.params.name}.md`);
+    async GET(_, ctx) {
-    if (!article) {
+      const article = await fetchResource(`articles/${ctx.params.name}.md`);
-      return ctx.renderNotFound();
+      if (!article) {
-    }
+        return ctx.renderNotFound();
-    return ctx.render({ article, session: ctx.state.session });
+      }
-  },
+      return ctx.render({ article, session: ctx.state.session });
-};
+    },
+  };
 
 export default function Greet(
   props: PageProps<{ article: Article; session: Record<string, string> }>,

routes/index.tsx

@@ -22,10 +22,11 @@ export default function Home(props: PageProps) {
               <Card
                 title={`${m.name}`}
                 backgroundSize={80}
-                image={`${m.emoji.endsWith(".png")
+                image={`${
+                  m.emoji.endsWith(".png")
                     ? `/emojis/${encodeURIComponent(m.emoji)}`
                     : "/placeholder.svg"
-                  }`}
+                }`}
                 link={m.link}
               />
             );

routes/movies/[name].tsx

@@ -24,7 +24,7 @@ export default async function Greet(
     return ctx.renderNotFound();
   }
 
-  const { author = "", datePublished = "",reviewBody } = movie.content;
+  const { author = "", datePublished = "", reviewBody } = movie.content;
 
   const content = renderMarkdown(
     removeImage(reviewBody || "", movie.content.image),

routes/movies/index.tsx

@@ -21,7 +21,7 @@ export default async function MovieIndex(
     await searchResource({ ...searchParams, types: ["movie"] });
   const movies = allMovies.sort((a, b) =>
     a?.content?.reviewRating?.ratingValue >
-      b?.content?.reviewRating?.ratingValue
+        b?.content?.reviewRating?.ratingValue
       ? -1
       : 1
   );

static/browserconfig.xml

@@ -1,9 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
 <browserconfig>
-    <msapplication>
+  <msapplication>
-        <tile>
+    <tile>
-            <square150x150logo src="/mstile-150x150.png"/>
+      <square150x150logo src="/mstile-150x150.png" />
-            <TileColor>#da532c</TileColor>
+      <TileColor>#da532c</TileColor>
-        </tile>
+    </tile>
-    </msapplication>
+  </msapplication>
 </browserconfig>

static/logo.svg

@@ -1,6 +1,19 @@
 <svg width="40" height="40" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M34.092 8.845C38.929 20.652 34.092 27 30 30.5c1 3.5-2.986 4.222-4.5 2.5-4.457 1.537-13.512 1.487-20-5C2 24.5 4.73 16.714 14 11.5c8-4.5 16-7 20.092-2.655Z" fill="#FFDB1E"/>
+  <path
-  <path d="M14 11.5c6.848-4.497 15.025-6.38 18.368-3.47C37.5 12.5 21.5 22.612 15.5 25c-6.5 2.587-3 8.5-6.5 8.5-3 0-2.5-4-5.183-7.75C2.232 23.535 6.16 16.648 14 11.5Z" fill="#fff" stroke="#FFDB1E"/>
+    d="M34.092 8.845C38.929 20.652 34.092 27 30 30.5c1 3.5-2.986 4.222-4.5 2.5-4.457 1.537-13.512 1.487-20-5C2 24.5 4.73 16.714 14 11.5c8-4.5 16-7 20.092-2.655Z"
-  <path d="M28.535 8.772c4.645 1.25-.365 5.695-4.303 8.536-3.732 2.692-6.606 4.21-7.923 4.83-.366.173-1.617-2.252-1.617-1 0 .417-.7 2.238-.934 2.326-1.365.512-4.223 1.29-5.835 1.29-3.491 0-1.923-4.754 3.014-9.122.892-.789 1.478-.645 2.283-.645-.537-.773-.534-.917.403-1.546C17.79 10.64 23 8.77 25.212 8.42c.366.014.82.35.82.629.41-.14 2.095-.388 2.503-.278Z" fill="#FFE600"/>
+    fill="#FFDB1E"
-  <path d="M14.297 16.49c.985-.747 1.644-1.01 2.099-2.526.566.121.841-.08 1.29-.701.324.466 1.657.608 2.453.701-.715.451-1.057.852-1.452 2.106-1.464-.611-3.167-.302-4.39.42Z" fill="#fff"/>
+  />
+  <path
+    d="M14 11.5c6.848-4.497 15.025-6.38 18.368-3.47C37.5 12.5 21.5 22.612 15.5 25c-6.5 2.587-3 8.5-6.5 8.5-3 0-2.5-4-5.183-7.75C2.232 23.535 6.16 16.648 14 11.5Z"
+    fill="#fff"
+    stroke="#FFDB1E"
+  />
+  <path
+    d="M28.535 8.772c4.645 1.25-.365 5.695-4.303 8.536-3.732 2.692-6.606 4.21-7.923 4.83-.366.173-1.617-2.252-1.617-1 0 .417-.7 2.238-.934 2.326-1.365.512-4.223 1.29-5.835 1.29-3.491 0-1.923-4.754 3.014-9.122.892-.789 1.478-.645 2.283-.645-.537-.773-.534-.917.403-1.546C17.79 10.64 23 8.77 25.212 8.42c.366.014.82.35.82.629.41-.14 2.095-.388 2.503-.278Z"
+    fill="#FFE600"
+  />
+  <path
+    d="M14.297 16.49c.985-.747 1.644-1.01 2.099-2.526.566.121.841-.08 1.29-.701.324.466 1.657.608 2.453.701-.715.451-1.057.852-1.452 2.106-1.464-.611-3.167-.302-4.39.42Z"
+    fill="#fff"
+  />
 </svg>

static/placeholder.svg

@@ -1,7 +1,35 @@
-<svg width="387" height="387" viewBox="0 0 387 387" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg
-<rect width="387" height="387" fill="#2B2930"/>
+  width="387"
-<circle cx="212.471" cy="154.8" r="15.5559" stroke="#39363F" stroke-width="3.03529"/>
+  height="387"
-<path d="M110.978 249.463L155.261 205.18C161.188 199.253 170.797 199.253 176.724 205.18L221.007 249.463" stroke="#39363F" stroke-width="3.03529"/>
+  viewBox="0 0 387 387"
-<path d="M192.362 220.628L207.81 205.18C213.737 199.253 223.346 199.253 229.273 205.18L273.556 249.463" stroke="#39363F" stroke-width="3.03529"/>
+  fill="none"
-<rect x="86.1265" y="86.1265" width="214.747" height="214.747" rx="13.6588" stroke="#39363F" stroke-width="3.03529"/>
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <rect width="387" height="387" fill="#2B2930" />
+  <circle
+    cx="212.471"
+    cy="154.8"
+    r="15.5559"
+    stroke="#39363F"
+    stroke-width="3.03529"
+  />
+  <path
+    d="M110.978 249.463L155.261 205.18C161.188 199.253 170.797 199.253 176.724 205.18L221.007 249.463"
+    stroke="#39363F"
+    stroke-width="3.03529"
+  />
+  <path
+    d="M192.362 220.628L207.81 205.18C213.737 199.253 223.346 199.253 229.273 205.18L273.556 249.463"
+    stroke="#39363F"
+    stroke-width="3.03529"
+  />
+  <rect
+    x="86.1265"
+    y="86.1265"
+    width="214.747"
+    height="214.747"
+    rx="13.6588"
+    stroke="#39363F"
+    stroke-width="3.03529"
+  />
 </svg>

static/prism-material-dark.css

@@ -1,205 +1,205 @@
 code[class*="language-"],
 pre[class*="language-"] {
-	text-align: left;
+  text-align: left;
-	white-space: pre;
+  white-space: pre;
-	word-spacing: normal;
+  word-spacing: normal;
-	word-break: normal;
+  word-break: normal;
-	word-wrap: normal;
+  word-wrap: normal;
-	color: #eee;
+  color: #eee;
-	background: #2f2f2f;
+  background: #2f2f2f;
-	font-family: Roboto Mono, monospace;
+  font-family: Roboto Mono, monospace;
-	font-size: 1em;
+  font-size: 1em;
-	line-height: 1.5em;
+  line-height: 1.5em;
 
-	-moz-tab-size: 4;
+  -moz-tab-size: 4;
-	-o-tab-size: 4;
+  -o-tab-size: 4;
-	tab-size: 4;
+  tab-size: 4;
 
-	-webkit-hyphens: none;
+  -webkit-hyphens: none;
-	-moz-hyphens: none;
+  -moz-hyphens: none;
-	-ms-hyphens: none;
+  -ms-hyphens: none;
-	hyphens: none;
+  hyphens: none;
 }
 
 code[class*="language-"]::-moz-selection,
 pre[class*="language-"]::-moz-selection,
 code[class*="language-"] ::-moz-selection,
 pre[class*="language-"] ::-moz-selection {
-	background: #363636;
+  background: #363636;
 }
 
 code[class*="language-"]::selection,
 pre[class*="language-"]::selection,
 code[class*="language-"] ::selection,
 pre[class*="language-"] ::selection {
-	background: #363636;
+  background: #363636;
 }
 
 :not(pre) > code[class*="language-"] {
-	white-space: normal;
+  white-space: normal;
-	border-radius: 0.2em;
+  border-radius: 0.2em;
-	padding: 0.1em;
+  padding: 0.1em;
 }
 
 pre[class*="language-"] {
-	overflow: auto;
+  overflow: auto;
-	position: relative;
+  position: relative;
-	margin: 0.5em 0;
+  margin: 0.5em 0;
-	padding: 1.25em 1em;
+  padding: 1.25em 1em;
 }
 
 .language-css > code,
 .language-sass > code,
 .language-scss > code {
-	color: #fd9170;
+  color: #fd9170;
 }
 
 [class*="language-"] .namespace {
-	opacity: 0.7;
+  opacity: 0.7;
 }
 
 .token.atrule {
-	color: #c792ea;
+  color: #c792ea;
 }
 
 .token.attr-name {
-	color: #ffcb6b;
+  color: #ffcb6b;
 }
 
 .token.attr-value {
-	color: #a5e844;
+  color: #a5e844;
 }
 
 .token.attribute {
-	color: #a5e844;
+  color: #a5e844;
 }
 
 .token.boolean {
-	color: #c792ea;
+  color: #c792ea;
 }
 
 .token.builtin {
-	color: #ffcb6b;
+  color: #ffcb6b;
 }
 
 .token.cdata {
-	color: #80cbc4;
+  color: #80cbc4;
 }
 
 .token.char {
-	color: #80cbc4;
+  color: #80cbc4;
 }
 
 .token.class {
-	color: #ffcb6b;
+  color: #ffcb6b;
 }
 
 .token.class-name {
-	color: #f2ff00;
+  color: #f2ff00;
 }
 
 .token.comment {
-	color: #616161;
+  color: #616161;
 }
 
 .token.constant {
-	color: #c792ea;
+  color: #c792ea;
 }
 
 .token.deleted {
-	color: #ff6666;
+  color: #ff6666;
 }
 
 .token.doctype {
-	color: #616161;
+  color: #616161;
 }
 
 .token.entity {
-	color: #ff6666;
+  color: #ff6666;
 }
 
 .token.function {
-	color: #c792ea;
+  color: #c792ea;
 }
 
 .token.hexcode {
-	color: #f2ff00;
+  color: #f2ff00;
 }
 
 .token.id {
-	color: #c792ea;
+  color: #c792ea;
-	font-weight: bold;
+  font-weight: bold;
 }
 
 .token.important {
-	color: #c792ea;
+  color: #c792ea;
-	font-weight: bold;
+  font-weight: bold;
 }
 
 .token.inserted {
-	color: #80cbc4;
+  color: #80cbc4;
 }
 
 .token.keyword {
-	color: #c792ea;
+  color: #c792ea;
 }
 
 .token.number {
-	color: #fd9170;
+  color: #fd9170;
 }
 
 .token.operator {
-	color: #89ddff;
+  color: #89ddff;
 }
 
 .token.prolog {
-	color: #616161;
+  color: #616161;
 }
 
 .token.property {
-	color: #80cbc4;
+  color: #80cbc4;
 }
 
 .token.pseudo-class {
-	color: #a5e844;
+  color: #a5e844;
 }
 
 .token.pseudo-element {
-	color: #a5e844;
+  color: #a5e844;
 }
 
 .token.punctuation {
-	color: #89ddff;
+  color: #89ddff;
 }
 
 .token.regex {
-	color: #f2ff00;
+  color: #f2ff00;
 }
 
 .token.selector {
-	color: #ff6666;
+  color: #ff6666;
 }
 
 .token.string {
-	color: #a5e844;
+  color: #a5e844;
 }
 
 .token.symbol {
-	color: #c792ea;
+  color: #c792ea;
 }
 
 .token.tag {
-	color: #ff6666;
+  color: #ff6666;
 }
 
 .token.unit {
-	color: #fd9170;
+  color: #fd9170;
 }
 
 .token.url {
-	color: #ff6666;
+  color: #ff6666;
 }
 
 .token.variable {
-	color: #ff6666;
+  color: #ff6666;
 }

static/prism-twilight.css

@@ -5,95 +5,99 @@
  */
 code[class*="language-"],
 pre[class*="language-"] {
-	color: white;
+  color: white;
-	background: none;
+  background: none;
-	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
-	font-size: 1em;
+  font-size: 1em;
-	text-align: left;
+  text-align: left;
-	text-shadow: 0 -.1em .2em black;
+  text-shadow: 0 -0.1em 0.2em black;
-	white-space: pre;
+  white-space: pre;
-	word-spacing: normal;
+  word-spacing: normal;
-	word-break: normal;
+  word-break: normal;
-	word-wrap: normal;
+  word-wrap: normal;
-	line-height: 1.5;
+  line-height: 1.5;
 
-	-moz-tab-size: 4;
+  -moz-tab-size: 4;
-	-o-tab-size: 4;
+  -o-tab-size: 4;
-	tab-size: 4;
+  tab-size: 4;
 
-	-webkit-hyphens: none;
+  -webkit-hyphens: none;
-	-moz-hyphens: none;
+  -moz-hyphens: none;
-	-ms-hyphens: none;
+  -ms-hyphens: none;
-	hyphens: none;
+  hyphens: none;
 }
 
 pre[class*="language-"],
 :not(pre) > code[class*="language-"] {
-	background: hsl(0, 0%, 8%); /* #141414 */
+  background: hsl(0, 0%, 8%); /* #141414 */
 }
 
 /* Code blocks */
 pre[class*="language-"] {
-	border-radius: .5em;
+  border-radius: 0.5em;
-	border: .3em solid hsl(0, 0%, 33%); /* #282A2B */
+  border: 0.3em solid hsl(0, 0%, 33%); /* #282A2B */
-	box-shadow: 1px 1px .5em black inset;
+  box-shadow: 1px 1px 0.5em black inset;
-	margin: .5em 0;
+  margin: 0.5em 0;
-	overflow: auto;
+  overflow: auto;
-	padding: 1em;
+  padding: 1em;
 }
 
 pre[class*="language-"]::-moz-selection {
-	/* Firefox */
+  /* Firefox */
-	background: hsl(200, 4%, 16%); /* #282A2B */
+  background: hsl(200, 4%, 16%); /* #282A2B */
 }
 
 pre[class*="language-"]::selection {
-	/* Safari */
+  /* Safari */
-	background: hsl(200, 4%, 16%); /* #282A2B */
+  background: hsl(200, 4%, 16%); /* #282A2B */
 }
 
 /* Text Selection colour */
-pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
+pre[class*="language-"]::-moz-selection,
-code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
+pre[class*="language-"] ::-moz-selection,
-	text-shadow: none;
+code[class*="language-"]::-moz-selection,
-	background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
+code[class*="language-"] ::-moz-selection {
+  text-shadow: none;
+  background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
 }
 
-pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
+pre[class*="language-"]::selection,
-code[class*="language-"]::selection, code[class*="language-"] ::selection {
+pre[class*="language-"] ::selection,
-	text-shadow: none;
+code[class*="language-"]::selection,
-	background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
+code[class*="language-"] ::selection {
+  text-shadow: none;
+  background: hsla(0, 0%, 93%, 0.15); /* #EDEDED */
 }
 
 /* Inline code */
 :not(pre) > code[class*="language-"] {
-	border-radius: .3em;
+  border-radius: 0.3em;
-	border: .13em solid hsl(0, 0%, 33%); /* #545454 */
+  border: 0.13em solid hsl(0, 0%, 33%); /* #545454 */
-	box-shadow: 1px 1px .3em -.1em black inset;
+  box-shadow: 1px 1px 0.3em -0.1em black inset;
-	padding: .15em .2em .05em;
+  padding: 0.15em 0.2em 0.05em;
-	white-space: normal;
+  white-space: normal;
 }
 
 .token.comment,
 .token.prolog,
 .token.doctype,
 .token.cdata {
-	color: hsl(0, 0%, 47%); /* #777777 */
+  color: hsl(0, 0%, 47%); /* #777777 */
 }
 
 .token.punctuation {
-	opacity: .7;
+  opacity: 0.7;
 }
 
 .token.namespace {
-	opacity: .7;
+  opacity: 0.7;
 }
 
 .token.tag,
 .token.boolean,
 .token.number,
 .token.deleted {
-	color: hsl(14, 58%, 55%); /* #CF6A4C */
+  color: hsl(14, 58%, 55%); /* #CF6A4C */
 }
 
 .token.keyword,
@@ -102,7 +106,7 @@ code[class*="language-"]::selection, code[class*="language-"] ::selection {
 .token.constant,
 .token.symbol,
 .token.builtin {
-	color: hsl(53, 89%, 79%); /* #F9EE98 */
+  color: hsl(53, 89%, 79%); /* #F9EE98 */
 }
 
 .token.attr-name,
@@ -116,54 +120,58 @@ code[class*="language-"]::selection, code[class*="language-"] ::selection {
 .style .token.string,
 .token.variable,
 .token.inserted {
-	color: hsl(76, 21%, 52%); /* #8F9D6A */
+  color: hsl(76, 21%, 52%); /* #8F9D6A */
 }
 
 .token.atrule {
-	color: hsl(218, 22%, 55%); /* #7587A6 */
+  color: hsl(218, 22%, 55%); /* #7587A6 */
 }
 
 .token.regex,
 .token.important {
-	color: hsl(42, 75%, 65%); /* #E9C062 */
+  color: hsl(42, 75%, 65%); /* #E9C062 */
 }
 
 .token.important,
 .token.bold {
-	font-weight: bold;
+  font-weight: bold;
 }
 .token.italic {
-	font-style: italic;
+  font-style: italic;
 }
 
 .token.entity {
-	cursor: help;
+  cursor: help;
 }
 
 /* Markup */
 .language-markup .token.tag,
 .language-markup .token.attr-name,
 .language-markup .token.punctuation {
-	color: hsl(33, 33%, 52%); /* #AC885B */
+  color: hsl(33, 33%, 52%); /* #AC885B */
 }
 
 /* Make the tokens sit above the line highlight so the colours don't look faded. */
 .token {
-	position: relative;
+  position: relative;
-	z-index: 1;
+  z-index: 1;
 }
 
 .line-highlight.line-highlight {
-	background: hsla(0, 0%, 33%, 0.25); /* #545454 */
+  background: hsla(0, 0%, 33%, 0.25); /* #545454 */
-	background: linear-gradient(to right, hsla(0, 0%, 33%, .1) 70%, hsla(0, 0%, 33%, 0)); /* #545454 */
+  background: linear-gradient(
-	border-bottom: 1px dashed hsl(0, 0%, 33%); /* #545454 */
+    to right,
-	border-top: 1px dashed hsl(0, 0%, 33%); /* #545454 */
+    hsla(0, 0%, 33%, 0.1) 70%,
-	margin-top: 0.75em; /* Same as .prism’s padding-top */
+    hsla(0, 0%, 33%, 0)
-	z-index: 0;
+  ); /* #545454 */
+  border-bottom: 1px dashed hsl(0, 0%, 33%); /* #545454 */
+  border-top: 1px dashed hsl(0, 0%, 33%); /* #545454 */
+  margin-top: 0.75em; /* Same as .prism’s padding-top */
+  z-index: 0;
 }
 
 .line-highlight.line-highlight:before,
 .line-highlight.line-highlight[data-end]:after {
-	background-color: hsl(215, 15%, 59%); /* #8794A6 */
+  background-color: hsl(215, 15%, 59%); /* #8794A6 */
-	color: hsl(24, 20%, 95%); /* #F5F2F0 */
+  color: hsl(24, 20%, 95%); /* #F5F2F0 */
 }

static/safari-pinned-tab.svg

@@ -1,15 +1,25 @@
 <?xml version="1.0" standalone="no"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
  "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
-<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+<svg
- width="256.000000pt" height="256.000000pt" viewBox="0 0 256.000000 256.000000"
+  version="1.0"
- preserveAspectRatio="xMidYMid meet">
+  xmlns="http://www.w3.org/2000/svg"
-<metadata>
+  width="256.000000pt"
+  height="256.000000pt"
+  viewBox="0 0 256.000000 256.000000"
+  preserveAspectRatio="xMidYMid meet"
+>
+  <metadata
+  >
 Created by potrace 1.14, written by Peter Selinger 2001-2017
 </metadata>
-<g transform="translate(0.000000,256.000000) scale(0.100000,-0.100000)"
+  <g
-fill="#000000" stroke="none">
+    transform="translate(0.000000,256.000000) scale(0.100000,-0.100000)"
-<path d="M1404 2075 c-16 -7 -75 -60 -131 -116 -55 -57 -130 -133 -166 -167
+    fill="#000000"
+    stroke="none"
+  >
+    <path
+      d="M1404 2075 c-16 -7 -75 -60 -131 -116 -55 -57 -130 -133 -166 -167
 l-64 -64 0 122 c0 91 -3 124 -13 130 -19 12 -192 12 -210 0 -11 -7 -15 -34
 -16 -117 -1 -59 -3 -110 -3 -113 -1 -3 -20 -11 -43 -17 -67 -18 -126 -76 -164
 -160 -33 -72 -34 -73 -108 -108 -41 -19 -87 -50 -102 -68 -64 -76 -82 -169
@@ -19,6 +29,7 @@ l-64 -64 0 122 c0 91 -3 124 -13 130 -19 12 -192 12 -210 0 -11 -7 -15 -34
 -59 15 -9 -2 -12 10 -9 45 6 72 -17 145 -62 196 -13 16 -16 60 -16 318 0 164
 3 299 6 299 3 0 18 -13 34 -30 39 -41 75 -52 113 -33 36 18 53 57 40 93 -5 14
 -82 96 -171 183 -89 87 -282 277 -429 423 -146 145 -270 264 -275 265 -4 0
--15 2 -24 4 -8 1 -29 -3 -45 -10z"/>
+-15 2 -24 4 -8 1 -29 -3 -45 -10z"
-</g>
+    />
+  </g>
 </svg>

static/thumbhash.js

@@ -35,7 +35,7 @@ function thumbHashToRGBA(hash) {
       for (let cx = cy ? 0 : 1; cx * ny < nx * (ny - cy); cx++) {
         ac.push(
           (((hash[ac_start + (ac_index >> 1)] >> ((ac_index++ & 1) << 2)) &
-            15) / 7.5 - 1) * scale,
+                15) / 7.5 - 1) * scale,
         );
       }
     }