chore(wpcarro/website): Templatize website

Preferring billandhiscomputer.com in lieu of wpcarro.dev. wpcarro is a bit of a
tough username for others to remember and for me to say out-loud (it usually
involves me spelling it and explaining to others why Carroll is missing
2x-Ls). I think it's time for a change.

During the transition, I don't want to deal with stale links to
https://wpcarro.dev, so I'm templatizing more of my website and blog so that
these values can be replaced.

Expect more forthcoming changes.

Change-Id: Ic2f5519e6b0d76fcb8b737bf50009e8388f1b178
Reviewed-on: https://cl.tvl.fyi/c/depot/+/4754
Tested-by: BuildkiteCI
Reviewed-by: wpcarro <wpcarro@gmail.com>
Autosubmit: wpcarro <wpcarro@gmail.com>
This commit is contained in:
William Carroll 2021-12-30 15:34:44 -04:00 committed by clbot
parent 44f20ea810
commit ca6be786a1
5 changed files with 44 additions and 31 deletions

View file

@ -5,17 +5,17 @@ with depot.nix.yants;
let
inherit (builtins) hasAttr filter readFile;
inherit (depot.web.blog) post includePost renderPost;
inherit (depot.users) wpcarro;
inherit (depot.users.wpcarro.website) domain renderTemplate withBrand;
config = {
name = "wpcarro's blog";
baseUrl = "https://wpcarro.dev/blog";
name = "bill and his blog";
baseUrl = "https://${domain}/blog";
footer = "";
};
posts = filter includePost (list post (import ./posts.nix));
rendered = pkgs.runCommandNoCC "wpcarros-blog-posts" {} ''
rendered = pkgs.runCommandNoCC "blog-posts" {} ''
mkdir -p $out
${lib.concatStringsSep "\n" (map (post:
@ -27,19 +27,17 @@ let
date --date='@${toString date}' '+%B %e, %Y' > $out
'');
postsHtml = readFile (pkgs.substituteAll {
src = ./fragments/posts.html;
postsHtml = renderTemplate ./fragments/posts.html {
postsHtml = lib.concatStringsSep "\n" (map toPostHtml posts);
});
};
toPostHtml = post: readFile (pkgs.substituteAll {
src = ./fragments/post.html;
toPostHtml = post: readFile (renderTemplate ./fragments/post.html {
postUrl = "${config.baseUrl}/posts/${post.key}.html";
postTitle = post.title;
postDate = formatDate post.date;
});
in pkgs.runCommandNoCC "wpcarros-blog" {} ''
in pkgs.runCommandNoCC "blog" {} ''
mkdir -p $out
cp ${wpcarro.website.render postsHtml} $out/index.html
cp ${withBrand (readFile postsHtml)} $out/index.html
cp -r ${rendered} $out/posts
''

View file

@ -1,7 +1,7 @@
<div class="max-w-sm md:max-w-prose mx-auto">
<section class="pt-8 pb-14">
<p class="font-bold pb-3 text-xl">
Personal blog by <a class="font-bold text-blue-600 hover:underline" href="https://wpcarro.dev">wpcarro</a>.
Personal blog by <a class="font-bold text-blue-600 hover:underline" href="@homepage@">Bill</a>.
</p>
<p class="text-gray-500">&gt; Half-baked musings lossily encoded.</p>
<p class="text-gray-500">&gt; - misc reviewer</p>

View file

@ -4,18 +4,33 @@ let
inherit (builtins) readFile;
inherit (depot.users) wpcarro;
render = contentHtml: pkgs.substituteAll {
domain = "billandhiscomputer.com";
globalVars = {
inherit domain;
homepage = "https://${domain}/";
blog = "https://${domain}/blog";
habits = "https://${domain}/habits";
github = "https://github.com/wpcarro";
linkedin = "https://linkedin.com/in/williampatrickcarroll";
depotWork = "https://cs.tvl.fyi/depot/-/blob/users/wpcarro";
};
renderTemplate = src: vars: pkgs.substituteAll (globalVars // vars // {
inherit src;
});
withBrand = contentHtml: renderTemplate ./fragments/template.html {
inherit contentHtml;
src = ./fragments/template.html;
};
in {
inherit render;
inherit domain renderTemplate withBrand;
root = pkgs.runCommandNoCC "wpcarro.dev" {} ''
mkdir -p $out
# /
cp ${render (readFile ./fragments/homepage.html)} $out/index.html
cp ${withBrand (readFile (renderTemplate ./fragments/homepage.html {}))} $out/index.html
# /habits
mkdir -p $out/habits

View file

@ -1,6 +1,6 @@
<section class="leading-7">
<p class="relative text-3xl text-center font-bold pt-6 md:pt-14 pb-10">
Hey! I'm William.<span class="pl-10 relative"><span class="block absolute right-0 top-0 transition-transform hover:rotate-90">👋</span></span>
Hey! I'm Bill.<span class="pl-10 relative"><span class="block absolute right-0 top-0 transition-transform hover:rotate-90">👋</span></span>
</p>
<p class="pb-4">
I write software. Currently I work as a <b>Site Reliability Engineer</b> for
@ -8,10 +8,10 @@
</p>
<p class="pb-4">
I'm <b>wpcarro</b> on
<a class="font-bold text-blue-600 hover:underline" href="https://github.com/wpcarro">GitHub</a>
<a class="font-bold text-blue-600 hover:underline" href="@github@">GitHub</a>
(and elsewhere), but if you're looking for code samples, the majority of
my open-source work resides in a magical place called the
<a class="font-bold text-blue-600 hover:underline" href="https://cs.tvl.fyi/depot/-/tree/users/wpcarro">depot</a>.
<a class="font-bold text-blue-600 hover:underline" href="@depotWork@">depot</a>.
</p>
<p class="pb-4">
If I'm not coding, I'm likely meditating, training Jiu Jitsu, or

View file

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>wpcarro.dev</title>
<title>@domain@</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=JetBrains+Mono">
@ -22,31 +22,31 @@
<header class="sticky z-10 transition duration-300 bg-gray-100 top-0 py-6">
<div class="flex max-w-sm md:max-w-3xl mx-auto">
<div class="flex-1 text-center md:text-left text-xl md:text-base">
<a href="https://cs.tvl.fyi/depot/-/blob/users/wpcarro/website/index.html">
<a href="@depotWork@/website">
<h1 class="font-bold">
<span class="text-black">(</span><a class="text-purple-600 hover:underline" href="https://cs.tvl.fyi/depot/-/blob/users/wpcarro/website/index.html">def</a>&nbsp;<a class="text-green-600 hover:underline text-bold" href="https://wpcarro.dev">"wpcarro.dev"</a><span class="text-black">)</span>
<span class="text-black">(</span><a class="text-purple-600 hover:underline" href="@depotWork@/website">def</a>&nbsp;<a class="text-green-600 hover:underline text-bold" href="@homepage@">"@domain@"</a><span class="text-black">)</span>
</h1>
</a>
</div>
<nav class="flex-1 hidden md:block">
<ul class="list-reset flex justify-end space-x-8">
<li>
<a class="hover:underline" href="https://wpcarro.dev/habits">
<a class="hover:underline" href="@habits@">
Habits
</a>
</li>
<li>
<a class="hover:underline" href="https://wpcarro.dev/blog">
<a class="hover:underline" href="@blog@">
Blog
</a>
</li>
<li>
<a class="hover:underline" href="https://github.com/wpcarro">
<a class="hover:underline" href="@github@">
GitHub
</a>
</li>
<li>
<a class="hover:underline" href="https://linkedin.com/in/williampatrickcarroll">
<a class="hover:underline" href="@linkedin@">
LinkedIn
</a>
</li>
@ -57,25 +57,25 @@
<div class="max-w-sm px-2 md:px-0 md:max-w-prose mx-auto">
@contentHtml@
<footer class="md:hidden pb-6">
<h2 class="text-xl font-bold py-4">More wpcarro?</h2>
<h2 class="text-xl font-bold py-4">More Bill?</h2>
<ul>
<li class="pb-6">
<a class="text-blue-600 font-bold" href="https://wpcarro.dev">
<a class="text-blue-600 font-bold" href="@homepage@">
Home <span class="text-blue-300">-></span>
</a>
</li>
<li class="pb-6">
<a class="text-blue-600 font-bold" href="https://wpcarro.dev/blog">
<a class="text-blue-600 font-bold" href="@blog@">
Blog <span class="text-blue-300">-></span>
</a>
</li>
<li class="pb-6">
<a class="text-blue-600 font-bold" href="https://github.com/wpcarro">
<a class="text-blue-600 font-bold" href="@github@">
GitHub <span class="text-blue-300">-></span>
</a>
</li>
<li class="pb-6">
<a class="text-blue-600 font-bold" href="https://linkedin.com/in/williampatrickcarroll">
<a class="text-blue-600 font-bold" href="@linkedin@">
LinkedIn <span class="text-blue-300">-></span>
</a>
</li>