Initial commit

.github/workflows/gh-pages.yml

@@ -0,0 +1,53 @@
+
+name: Publish on GitHub Pages
+
+on:
+  push:
+    branches: [ main ]
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    concurrency:
+      group: ${{ github.workflow }}-${{ github.ref }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Checkout Documents
+        uses: actions/checkout@v4
+        with:
+          repository: robstarbuck/documents
+          path: src/documents
+
+      - name: Checkout Content
+        uses: actions/checkout@v4
+        with:
+          repository: robstarbuck/content.robstarbuck.uk
+          path: src/content.robstarbuck.uk
+
+      - name: Setup Deno environment
+        uses: denoland/setup-deno@v1
+        with:
+          deno-version: v1.x
+
+      - name: Build site
+        run: deno task build
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v3
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v2
+        with:
+          path: '_site'
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v1
+

.gitignore

@@ -0,0 +1,3 @@
+_site
+src/documents
+src/content.robstarbuck.uk

README.md

@@ -0,0 +1,2 @@
+
+https://unsplash.com/photos/black-textile-on-black-background-UAbg0py6GYQ

_config.ts

@@ -0,0 +1,98 @@
+import lume from "lume/mod.ts";
+import codeHighlight from "lume/plugins/code_highlight.ts";
+
+const site = lume({
+  src: "./src",
+});
+
+const [date, time] = new Date().toISOString().split(/T|\./);
+
+site.data("buildDate", date);
+site.data("buildTime", time);
+
+site.data("github", "https://github.com/robstarbuck/");
+site.data("logoFill", "#2b2031");
+
+site.copy("code", ".");
+site.copy("styles", ".");
+site.copy("images", ".");
+
+site.use(codeHighlight());
+
+// Site Process
+
+const wrapElement = (el: HTMLElement, wrapper: HTMLElement) => {
+  if (el.parentNode) {
+    el.parentNode.insertBefore(wrapper, el);
+    wrapper.appendChild(el);
+  }
+};
+
+// test for tagName, instanceof is unavailable in this context
+const isIframe = (e: Element): e is HTMLIFrameElement => {
+  return e.tagName === "IFRAME";
+};
+
+const isAnchor = (e: Element): e is HTMLAnchorElement => {
+  return e.tagName === "A";
+};
+
+const isImage = (e: Element): e is HTMLImageElement => {
+  return e.tagName === "IMG";
+};
+
+const isLinkExternal = (link: string) => {
+  return /^http/.test(link);
+};
+
+site.preprocess([".html"], (pages) => {
+  pages.forEach((page) => {
+    const contentRoot = /content.robstarbuck.uk/;
+    if(contentRoot.test(page.src.path)){
+      page.data.url = page.data.url.replace(contentRoot, 'posts');
+      page.data.tags = ["post"];
+      page.data.layout = "post.vto";
+    }
+    if (page.data.title?.toLocaleLowerCase() === "cv") {
+      page.data.layout = "cv.vto";
+      page.data.url = "./cv/";
+      page.data.tags = ["document", "cv"];
+    }
+  });
+  // page.data.filename = page.src.path + page.src.ext;
+});
+
+site.process([".html"], (pages) => {
+  const cv = pages.find((p) => p.data.title === "CV");
+
+  cv?.document?.querySelectorAll("h1").forEach((h1) => {
+    h1.setAttribute("data-id", h1.innerText.replace(/ +/g, "-"));
+  });
+
+  pages.forEach((page) => {
+    const document = page.document;
+    if (document === undefined) {
+      return;
+    }
+    document.querySelectorAll("iframe, a, img").forEach((element) => {
+      if (isIframe(element)) {
+        const div = document.createElement("div");
+        div.classList.add("iframe");
+        wrapElement(element, div);
+      }
+      if (isAnchor(element)) {
+        const href = element.getAttribute("href");
+        if (href && isLinkExternal(href)) {
+          element.setAttribute("target", "_blank");
+        }
+      }
+      if (isImage(element)) {
+        const div = document.createElement("div");
+        div.classList.add("image");
+        wrapElement(element, div);
+      }
+    });
+  });
+});
+
+export default site;

deno.json

@@ -0,0 +1,15 @@
+{
+  "tasks": {
+    "lume": "echo \"import 'lume/cli.ts'\" | deno run --unstable -A -",
+    "build": "deno task lume",
+    "serve": "deno task lume -s"
+  },
+  "compilerOptions": {
+    "types": [
+      "lume/types.ts"
+    ]
+  },
+  "imports": {
+    "lume/": "https://deno.land/x/[email protected]/"
+  }
+}

src/404.page.ts

@@ -0,0 +1,17 @@
+export const layout = "index.vto"
+
+export default function (page: Lume.Data) {
+
+  const posts = page.search.pages("post");
+
+  return `
+    <h1>404</h1>
+    <p>Page Not Found</p>
+    <ul>
+      ${posts.map((post) => {
+        return `<li><a href="${post.url}">${post.title}</a></li>`
+      }).join("")
+    }
+    </ul>
+  `;
+}

src/_components/logo/github.vto

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 1501 406" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill: {{ logoFill }};fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M177.281,41.988L147.014,41.988C146.233,41.988 145.6,42.622 145.6,43.403L145.6,58.201C145.6,58.982 146.233,59.618 147.014,59.618L158.821,59.618L158.821,78.003C158.821,78.003 156.17,78.907 148.84,78.907C140.193,78.907 128.113,75.747 128.113,49.183C128.113,22.614 140.692,19.118 152.501,19.118C162.724,19.118 167.127,20.918 169.93,21.785C170.811,22.055 171.625,21.178 171.625,20.397L175.001,6.099C175.001,5.733 174.877,5.293 174.461,4.994C173.323,4.182 166.38,0.297 148.84,0.297C128.634,0.297 107.908,8.894 107.908,50.219C107.908,91.545 131.638,97.704 151.635,97.704C168.192,97.704 178.236,90.628 178.236,90.628C178.65,90.4 178.695,89.821 178.695,89.556L178.695,43.403C178.695,42.622 178.062,41.988 177.281,41.988Z" style="fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M333.265,5.249C333.265,4.462 332.641,3.826 331.859,3.826L314.817,3.826C314.039,3.826 313.406,4.462 313.406,5.249C313.406,5.253 313.411,38.183 313.411,38.183L286.846,38.183L286.846,5.249C286.846,4.462 286.22,3.826 285.44,3.826L268.399,3.826C267.624,3.826 266.991,4.462 266.991,5.249L266.991,94.427C266.991,95.213 267.624,95.853 268.399,95.853L285.44,95.853C286.22,95.853 286.846,95.213 286.846,94.427L286.846,56.282L313.411,56.282C313.411,56.282 313.364,94.424 313.364,94.427C313.364,95.213 313.996,95.853 314.776,95.853L331.858,95.853C332.639,95.853 333.263,95.213 333.265,94.427L333.265,5.249Z" style="fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M209.44,16.951C209.44,10.815 204.521,5.856 198.451,5.856C192.387,5.856 187.463,10.815 187.463,16.951C187.463,23.081 192.387,28.054 198.451,28.054C204.521,28.054 209.44,23.081 209.44,16.951Z" style="fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M208.222,93.564L208.222,34.45C208.222,33.669 207.591,33.03 206.812,33.03L189.823,33.03C189.044,33.03 188.347,33.833 188.347,34.615L188.347,93.592C188.347,95.325 189.427,95.84 190.824,95.84L206.13,95.84C207.81,95.84 208.222,95.016 208.222,93.564Z" style="fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M398.032,33.164L381.121,33.164C380.346,33.164 379.714,33.803 379.714,34.59L379.714,78.316C379.714,78.316 375.417,81.46 369.319,81.46C363.222,81.46 361.604,78.693 361.604,72.722L361.604,34.59C361.604,33.803 360.974,33.164 360.197,33.164L343.033,33.164C342.259,33.164 341.624,33.803 341.624,34.59L341.624,75.609C341.624,93.344 351.508,97.683 365.105,97.683C376.261,97.683 385.255,91.52 385.255,91.52C385.255,91.52 385.683,94.768 385.877,95.153C386.07,95.537 386.575,95.925 387.121,95.925L398.04,95.877C398.814,95.877 399.449,95.237 399.449,94.453L399.443,34.59C399.443,33.803 398.812,33.164 398.032,33.164Z" style="fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M437.584,81.406C431.718,81.227 427.739,78.565 427.739,78.565L427.739,50.325C427.739,50.325 431.664,47.919 436.48,47.489C442.57,46.943 448.438,48.783 448.438,63.31C448.438,78.63 445.79,81.653 437.584,81.406ZM444.254,31.161C434.649,31.161 428.116,35.446 428.116,35.446L428.116,5.249C428.116,4.462 427.486,3.826 426.71,3.826L409.619,3.826C408.842,3.826 408.211,4.462 408.211,5.249L408.211,94.427C408.211,95.213 408.842,95.853 409.621,95.853L421.479,95.853C422.013,95.853 422.417,95.578 422.716,95.096C423.011,94.617 423.436,90.984 423.436,90.984C423.436,90.984 430.424,97.607 443.653,97.607C459.185,97.607 468.092,89.729 468.092,62.241C468.092,34.753 453.866,31.161 444.254,31.161Z" style="fill-rule:nonzero;"/>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M257.202,33.022L244.418,33.022C244.418,33.022 244.399,16.137 244.399,16.133C244.399,15.494 244.069,15.174 243.33,15.174L225.91,15.174C225.232,15.174 224.869,15.473 224.869,16.123L224.869,33.576C224.869,33.576 216.139,35.683 215.548,35.853C214.961,36.024 214.528,36.566 214.528,37.213L214.528,48.18C214.528,48.968 215.158,49.604 215.937,49.604L224.869,49.604L224.869,75.989C224.869,95.585 238.615,97.51 247.89,97.51C252.129,97.51 257.199,96.149 258.036,95.84C258.542,95.654 258.836,95.13 258.836,94.561L258.851,82.497C258.851,81.71 258.186,81.073 257.437,81.073C256.691,81.073 254.787,81.376 252.825,81.376C246.545,81.376 244.418,78.457 244.418,74.678C244.418,70.901 244.417,49.604 244.417,49.604L257.202,49.604C257.98,49.604 258.612,48.968 258.612,48.18L258.612,34.443C258.612,33.656 257.98,33.022 257.202,33.022Z" style="fill-rule:nonzero;"/>
+    </g>
+</svg>

src/_includes/cv.vto

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>{{ title }}</title>
+  <link rel="preconnect" href="https://rsms.me/">
+  <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
+  <link rel="stylesheet" href="/font.css">
+</head>
+<body>
+  <nav>
+    <a href="/">
+      robstarbuck.uk
+    </a>
+  </nav>
+  <main>
+    <div class="content">
+    {{ content }}
+    </div>
+  </main>
+  <footer>
+    <a href="{{ github }}">
+      {{ comp.logo.github() }}
+      <time datetime="{{ buildDate }} {{ buildTime }}.000">Built {{ buildDate }}</time>
+    </a>
+  </footer>
+</body>
+<link rel="stylesheet" href="/minireset.css"></link>
+<link rel="stylesheet" href="/vertical-rhythm.css"></link>
+<link rel="stylesheet" href="/index.css"></link>
+<link rel="stylesheet" href="/cv.css"></link>
+</html>

src/_includes/index.vto

@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <title></title>
+    <link rel="preconnect" href="https://rsms.me/">
+    <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
+    <link rel="stylesheet" href="/font.css">
+  </head>
+  <body>
+    <nav><a href="/">robstarbuck.uk</a></nav>
+    <main>
+      <div class="content">
+        <h2>Posts</h2>
+        {{ content }}
+      </div>
+    </main>
+  </body>
+  <link rel="stylesheet" href="/minireset.css"></link>
+  <link rel="stylesheet" href="/vertical-rhythm.css"></link>
+  <link rel="stylesheet" href="/index.css"></link>
+  <link rel="stylesheet" href="/highlight-js.css"></link>
+</html>

src/_includes/post.vto

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>{{ title }}</title>
+  <link rel="preconnect" href="https://rsms.me/">
+  <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
+  <link rel="stylesheet" href="/font.css">
+</head>
+<body>
+  <nav>
+    <a href="/">
+      robstarbuck.uk
+    </a>
+  </nav>
+  <main>
+  {{ if url !== "/" }}
+  <h1>{{ title }}</h1>
+  {{ /if }}
+  {{ content }}
+  </main>
+  <footer>
+    <a href="{{ github }}">
+      {{ comp.logo.github() }}
+      <time datetime="{{ buildDate }} {{ buildTime }}.000">Built {{ buildDate }}</time>
+    </a>
+  </footer>
+</body>
+<link rel="stylesheet" href="/minireset.css"></link>
+<link rel="stylesheet" href="/vertical-rhythm.css"></link>
+<link rel="stylesheet" href="/index.css"></link>
+<link rel="stylesheet" href="/highlight-js.css"></link>
+</html>

src/index.page.ts

@@ -0,0 +1,29 @@
+export const layout = "post.vto";
+
+export const title = "Posts";
+
+export const data = {
+  hideTitle: true,
+}
+
+export default function (page: Lume.Data) {
+  const posts = page.search.pages("post");
+
+  const cv = page.search.page("cv");
+
+  const dateParts = cv?.date.toDateString().split(" ");
+  const month = dateParts?.at(1);
+  const year = dateParts?.at(3);
+
+  return `
+    <ul>
+      ${posts
+        .map((post) => {
+          return `<li><a href="${post.url}">${post.title}</a></li>`;
+        })
+        .join("")}
+    </ul>
+    <hr />
+    <a href="${cv?.url}">CV ${month} ${year}</a>
+  `;
+}