HTML rendering support for the Website service (#5)

This PR contains the work done to replace the use of static _HTML_ files with type-safe HTML rendered server-side via **Elementary** through **Hummingbird**. To provide further details about the work done: * Added the **Elementary** dependencies. * Added the `IndexPage` and `ErrorPage` pages, ported from the old HTML boilerplate; removed the static files. * Added the `RootController` controller serving GET / using the `IndexPage` page, wired into the router. * Reworked the `NotFoundMiddleware` middleare to render `ErrorPage` page directly; non-notFound errors still propagate. * the `FileMiddleware` middleware no longer searches for any static `index.html` file. * Simplified the `StaticFile` enumeration, dropped unused constants and now-unnecessary throws. Reviewed-on: rock-n-code/loud-amsterdam#5 Co-authored-by: Javier Cicchelli <javier@rock-n-code.com> Co-committed-by: Javier Cicchelli <javier@rock-n-code.com>
2026-06-28 05:07:19 +00:00
parent f5f14eb97c
commit a621ada0bf
17 changed files with 460 additions and 244 deletions
@@ -0,0 +1,79 @@
+import Elementary
+
+/// The HTML page rendered for a not-found response.
+struct ErrorPage: HTMLDocument, Sendable {
+
+    // MARK: Document
+
+    /// The page's content.
+    var body: some HTML {
+        h1 { "Page Not Found" }
+        p { "Sorry, but the page you were trying to view does not exist." }
+    }
+
+    /// The metadata and inline styles placed in the document head.
+    var head: some HTML {
+        meta(.charset(.utf8))
+        meta(
+            .name(.viewport),
+            .content("width=device-width, initial-scale=1")
+        )
+        style { Self.styles }
+    }
+
+    /// The document language.
+    var lang: String { "en" }
+
+    /// The document title.
+    var title: String { "Page Not Found" }
+
+}
+
+// MARK: - Constants
+
+private extension ErrorPage {
+    /// The inline CSS applied to the page.
+    static let styles = """
+        * {
+          line-height: 1.2;
+          margin: 0;
+        }
+
+        html {
+          color: #888;
+          display: table;
+          font-family: sans-serif;
+          height: 100%;
+          text-align: center;
+          width: 100%;
+        }
+
+        body {
+          display: table-cell;
+          vertical-align: middle;
+          margin: 2em auto;
+        }
+
+        h1 {
+          color: #555;
+          font-size: 2em;
+          font-weight: 400;
+        }
+
+        p {
+          margin: 0 auto;
+          width: 280px;
+        }
+
+        @media only screen and (max-width: 280px) {
+          body, p {
+            width: 95%;
+          }
+
+          h1 {
+            font-size: 1.5em;
+            margin: 0 0 0.3em;
+          }
+        }
+        """
+}