assets/css/fonts/merriweather.css

@@ -1,35 +0,0 @@
-@font-face {
-  font-family: "Merriweather";
-  src:
-    url("/assets/fonts/Merriweather-Regular.woff2") format("woff2"),
-    url("/assets/fonts/Merriweather-Regular.woff") format("woff");
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Merriweather";
-  src:
-    url("/assets/fonts/Merriweather-Italic.woff2") format("woff2"),
-    url("/assets/fonts/Merriweather-Italic.woff") format("woff");
-  font-weight: normal;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: "Merriweather";
-  src:
-    url("/assets/fonts/Merriweather-Bold.woff2") format("woff2"),
-    url("/assets/fonts/Merriweather-Bold.woff") format("woff");
-  font-weight: bold;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Merriweather";
-  src:
-    url("/assets/fonts/Merriweather-BoldItalic.woff2") format("woff2"),
-    url("/assets/fonts/Merriweather-BoldItalic.woff") format("woff");
-  font-weight: bold;
-  font-style: italic;
-}

assets/css/layout.css

@@ -1,89 +0,0 @@
-@import url("/assets/css/fonts/merriweather.css");
-
-body {
-  font-size: 18px;
-  font-family: "Merriweather", serif;
-}
-
-img {
-  max-width: 100%;
-}
-
-img.avatar {
-  height: 48px;
-  width: 48px;
-  border-radius: 50%;
-}
-
-.profile-page img.avatar {
-  height: 128px;
-  width: 128px;
-}
-
-h1 {
-  margin: 2em 0 0 0;
-}
-
-h2, h3, h4 {
-  margin-top: 2em;
-  margin-bottom: 2rem;
-  line-height: 1.6em;
-}
-
-p, pre, ul, ol, blockquote {
-  line-height: 1.6em;
-  margin-bottom: 1.6em;
-}
-
-a.anchor {
-  display: none;
-}
-
-code {
-  font-size: 1rem;
-  padding: 0.1em 0.3em;
-}
-
-pre code {
-  display: block;
-  padding: 0.6rem 1rem;
-}
-
-main {
-  display: block;
-  max-width: 728px;
-  margin: 12rem auto;
-}
-
-main header {
-  display: block;
-  margin-bottom: 3rem;
-}
-
-main header h1 {
-  margin-bottom: 1.6rem;
-}
-
-p.meta {
-  display: flex;
-  column-gap: 1rem;
-}
-
-p.meta .content {
-  display: flex;
-  flex-direction: column;
-  font-size: 0.875rem;
-  line-height: 1.6rem;
-}
-
-p.meta .name a {
-  text-decoration: none;
-}
-
-.article-list .item {
-  margin-bottom: 3rem;
-}
-
-.article-list .item h3 {
-  margin-bottom: 1rem;
-}

assets/css/themes/default-light.css

@@ -1,34 +0,0 @@
-body {
-  background-color: #f5f2eb;
-  color: #3b3a38;
-}
-
-h1, h2, h3, h4 {
-  color: #191818;
-}
-
-a {
-  color: #023b77;
-}
-
-a:visited {
-  color: #3b0277;
-}
-
-code {
-  background-color: #e8e3da;
-  color: #027739;
-}
-
-pre code {
-  background-color: #333;
-  color: #ccc;
-}
-
-p.meta .date {
-  color: #888;
-}
-
-p.meta .name a {
-  color: #3b3a38;
-}

config.ts

@@ -11,7 +11,7 @@ const config = {
     bindDN: Deno.env.get("LDAP_BIND_DN"),
     password: Deno.env.get("LDAP_PASSWORD"),
     searchDN: Deno.env.get("LDAP_SEARCH_DN"),
-  },
+  }
 };
 
 export default config;

html.ts

@@ -12,8 +12,121 @@ export function htmlLayout(title: string, body: string, profile: Profile) {
       <meta http-equiv="X-UA-Compatible" content="ie=edge">
       <title>${title}</title>
       <link rel="alternate" type="application/atom+xml" href="/@${profile.username}/articles.atom" title="Articles by ${profile.name}" />
-      <link rel="stylesheet" type="text/css" href="/assets/css/layout.css" />
-      <link rel="stylesheet" type="text/css" href="/assets/css/themes/default-light.css" />
+      <link rel="preconnect" href="https://fonts.googleapis.com">
+      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+      <link href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;0,900;1,400;1,700&display=swap" rel="stylesheet">
+      <style>
+        body {
+          background-color: #f5f2eb;
+          color: #3b3a38;
+          font-size: 18px;
+          font-family: "Merriweather", serif;
+        }
+
+        img {
+          max-width: 100%;
+        }
+
+        img.avatar {
+          height: 48px;
+          width: 48px;
+          border-radius: 50%;
+        }
+
+        .profile-page img.avatar {
+          height: 128px;
+          width: 128px;
+        }
+
+        a.anchor {
+          display: none;
+        }
+
+        h1 {
+          margin: 2em 0 0 0;
+        }
+
+        h2, h3, h4 {
+          margin-top: 2em;
+          margin-bottom: 2rem;
+          line-height: 1.6em;
+        }
+
+        h1, h2, h3, h4 {
+          color: #191818;
+        }
+
+        p, pre, ul, ol, blockquote {
+          line-height: 1.6em;
+          margin-bottom: 1.6em;
+        }
+
+        a {
+          color: #023b77
+        }
+
+        a:visited {
+          color: #3b0277
+        }
+
+        code {
+          font-size: 1rem;
+          background-color: #e8e3da;
+          color: #027739;
+          padding: 0.1em 0.3em;
+        }
+
+        pre code {
+          display: block;
+          padding: 0.6rem 1rem;
+          background-color: #333;
+          color: #ccc;
+        }
+
+        main {
+          display: block;
+          max-width: 728px;
+          margin: 12rem auto;
+        }
+
+        main header {
+          display: block;
+          margin-bottom: 3rem;
+        }
+
+        main header h1 {
+          margin-bottom: 1.6rem;
+        }
+
+        p.meta {
+          display: flex;
+          column-gap: 1rem;
+        }
+
+        p.meta .content {
+          display: flex;
+          flex-direction: column;
+          font-size: 0.875rem;
+          line-height: 1.6rem;
+        }
+
+        p.meta .date {
+          color: #888;
+        }
+
+        p.meta .name a {
+          color: #3b3a38;
+          text-decoration: none;
+        }
+
+        .article-list .item {
+          margin-bottom: 3rem;
+        }
+
+        .article-list .item h3 {
+          margin-bottom: 1rem;
+        }
+      </style>
     </head>
     <body>
       ${body}

server.ts

@@ -1,5 +1,5 @@
-import { Application, Router, send } from "@oak/oak";
-import config from "./config.ts";
+import { Application, Router } from "@oak/oak";
+import { log } from "./log.ts";
 import naddrHandler from "./handlers/naddr.ts";
 import nprofileHandler from "./handlers/nprofile.ts";
 import npubHandler from "./handlers/npub.ts";
@@ -24,6 +24,11 @@ router.get("/:path", async (ctx: ctx) => {
     ctx.response.status = 404;
     ctx.response.body = "Not Found";
   }
+
+  log(
+    `${ctx.request.method} ${ctx.request.url} - ${ctx.response.status}`,
+    "gray",
+  );
 });
 
 router.get("/:user/:kind.atom", async (ctx: ctx) => {
@@ -35,6 +40,11 @@ router.get("/:user/:kind.atom", async (ctx: ctx) => {
     ctx.response.status = 404;
     ctx.response.body = "Not Found";
   }
+
+  log(
+    `${ctx.request.method} ${ctx.request.url} - ${ctx.response.status}`,
+    "gray",
+  );
 });
 
 router.get("/:user/:identifier", async (ctx: ctx) => {
@@ -46,19 +56,11 @@ router.get("/:user/:identifier", async (ctx: ctx) => {
     ctx.response.status = 404;
     ctx.response.body = "Not Found";
   }
-});
 
-router.get("/assets/:path*", async (ctx) => {
-  try {
-    const filePath = ctx.params.path;
-
-    await send(ctx, filePath, {
-      root: `${Deno.cwd()}/assets`,
-    });
-  } catch (_e) {
-    ctx.response.status = 404;
-    ctx.response.body = "Not Found";
-  }
+  log(
+    `${ctx.request.method} ${ctx.request.url} - ${ctx.response.status}`,
+    "gray",
+  );
 });
 
 const app = new Application();