From 98f79db8190d53e87b741f1bbc1f4dfebf41c45e Mon Sep 17 00:00:00 2001
From: Jonathan Dahan <git@jonathan.is>
Date: Tue, 14 May 2024 16:08:52 -0400
Subject: [PATCH] pages with colorful navigation

---
 .zs/active        |  5 +++++
 .zs/layout.html   | 15 +++++++++++++++
 coding/index.md   |  1 +
 index.html        | 13 -------------
 index.md          |  1 +
 living/index.md   |  1 +
 making/index.md   |  1 +
 speaking/index.md |  1 +
 style.css         | 14 +++++++-------
 working/index.md  |  1 +
 writing/index.md  |  1 +
 11 files changed, 34 insertions(+), 20 deletions(-)
 create mode 100755 .zs/active
 create mode 100644 .zs/layout.html
 create mode 100644 coding/index.md
 delete mode 100644 index.html
 create mode 100644 index.md
 create mode 100644 living/index.md
 create mode 100644 making/index.md
 create mode 100644 speaking/index.md
 create mode 100644 working/index.md
 create mode 100644 writing/index.md

diff --git a/.zs/active b/.zs/active
new file mode 100755
index 0000000..47ea8dc
--- /dev/null
+++ b/.zs/active
@@ -0,0 +1,5 @@
+#!/bin/sh
+
+# sets the 'active' class on an item if the url matches the directory
+urlpath=$(dirname "$ZS_URL")
+test "$1" = $urlpath && printf "active" || true
diff --git a/.zs/layout.html b/.zs/layout.html
new file mode 100644
index 0000000..9d37b6b
--- /dev/null
+++ b/.zs/layout.html
@@ -0,0 +1,15 @@
+<link href=/style.css rel=stylesheet />
+
+<nav>
+  <a href=jonathan.is>jonathan.is</a>
+  <menu>
+    <li class="{{ active writing }}"><a href=/writing  >/writing</a>
+    <li class="{{ active speaking }}"><a href=/speaking >/speaking</a>
+    <li class="{{ active coding }}"><a href=/coding   >/coding</a>
+    <li class="{{ active making }}"><a href=/making   >/making</a>
+    <li class="{{ active working }}"><a href=/working  >/working</a>
+    <li class="{{ active living }}"><a href=/living   >/living</a>
+  </menu>
+</nav>
+
+{{ content }}
diff --git a/coding/index.md b/coding/index.md
new file mode 100644
index 0000000..e0230e4
--- /dev/null
+++ b/coding/index.md
@@ -0,0 +1 @@
+coding
diff --git a/index.html b/index.html
deleted file mode 100644
index 864d8f4..0000000
--- a/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<link href=style.css rel=stylesheet />
-
-<nav>
-  <a href=jonathan.is>jonathan.is</a>
-  <menu>
-    <li><a href=/writing>/writing</a>
-    <li><a href=/speaking>/speaking</a>
-    <li><a href=/coding>/coding</a>
-    <li><a href=/making>/making</a>
-    <li><a href=/working>/working</a>
-    <li><a href=/living>/living</a>
-  </menu>
-</nav>
diff --git a/index.md b/index.md
new file mode 100644
index 0000000..8e3f60c
--- /dev/null
+++ b/index.md
@@ -0,0 +1 @@
+Hello, reach out to me via email
diff --git a/living/index.md b/living/index.md
new file mode 100644
index 0000000..54acd84
--- /dev/null
+++ b/living/index.md
@@ -0,0 +1 @@
+living
diff --git a/making/index.md b/making/index.md
new file mode 100644
index 0000000..8f88fcc
--- /dev/null
+++ b/making/index.md
@@ -0,0 +1 @@
+making
diff --git a/speaking/index.md b/speaking/index.md
new file mode 100644
index 0000000..bbee5ea
--- /dev/null
+++ b/speaking/index.md
@@ -0,0 +1 @@
+speaking
diff --git a/style.css b/style.css
index 3175c36..f4511c6 100644
--- a/style.css
+++ b/style.css
@@ -1,5 +1,5 @@
 body {
-  font-size: x-large
+  font-size: xx-large
 }
 
 li {
@@ -26,12 +26,12 @@ a:hover {
   --purple: #a033b3;
 }
 
-li:nth-of-type(6n + 1):hover { color: var(--red) }
-li:nth-of-type(6n + 2):hover { color: var(--orange) }
-li:nth-of-type(6n + 3):hover { color: var(--pink) }
-li:nth-of-type(6n + 4):hover { color: var(--green) }
-li:nth-of-type(6n + 5):hover { color: var(--blue) }
-li:nth-of-type(6n + 6):hover { color: var(--purple) }
+li:nth-of-type(6n + 1):hover, li.active:nth-of-type(6n + 1) { color: var(--red) }
+li:nth-of-type(6n + 2):hover, li.active:nth-of-type(6n + 2) { color: var(--orange) }
+li:nth-of-type(6n + 3):hover, li.active:nth-of-type(6n + 3) { color: var(--pink) }
+li:nth-of-type(6n + 4):hover, li.active:nth-of-type(6n + 4) { color: var(--green) }
+li:nth-of-type(6n + 5):hover, li.active:nth-of-type(6n + 5) { color: var(--blue) }
+li:nth-of-type(6n + 6):hover, li.active:nth-of-type(6n + 6) { color: var(--purple) }
 
 menu {
   padding: 0;
diff --git a/working/index.md b/working/index.md
new file mode 100644
index 0000000..d26b33d
--- /dev/null
+++ b/working/index.md
@@ -0,0 +1 @@
+working
diff --git a/writing/index.md b/writing/index.md
new file mode 100644
index 0000000..631ee76
--- /dev/null
+++ b/writing/index.md
@@ -0,0 +1 @@
+writing