M assets/styles/style.css → assets/styles/style.css

@@ -1,6 +1,18 @@ 
 /* Theme Switcher */
 /* Credits: https://endtimes.dev/no-javascript-dark-mode-toggle/ */
 
+.theme-switcher-icon {
+    cursor: pointer;
+    float: right;
+    margin: 2px;
+    margin-right: 10px;
+}
+
+#theme-switcher {
+    display: none;
+}
+
+
 :root {
 
     --html-font-size: 18px;
@@ -9,7 +21,9 @@ --line-height: 1.5;
     --scale-factor: 1.3333;
     --leading: 1.5rem;
     --letter-spacing: 0.05em;
+}
 
+.themed-content {
     --link-color: #e96363;
     --link-hover-color: #ff6e6e;
 
@@ -26,7 +40,7 @@ --error-color: #da3c3c;
 }
 
 
-#color-mode:checked~.themed-content {
+#theme-switcher:checked~.themed-content {
     --link-color: #b73333;
     --link-hover-color: #653131;
 
@@ -55,11 +69,11 @@ .themed-content .dark-mode-hide {
     display: none;
 }
 
-#color-mode:checked~.themed-content .light-mode-hide {
+#theme-switcher:checked~.themed-content .light-mode-hide {
     display: none;
 }
 
-#color-mode:checked~.themed-content .dark-mode-hide {
+#theme-switcher:checked~.themed-content .dark-mode-hide {
     display: initial;
 }
 
@@ -80,7 +94,7 @@ --warning-color: #FFAF00;
         --error-color: #DB141A;
     }
 
-    #color-mode:checked~.themed-content {
+    #theme-switcher:checked~.themed-content {
         --link-color: #e96363;
         --link-hover-color: #ff6e6e;
 
@@ -104,11 +118,11 @@ .themed-content .light-mode-hide {
         display: none;
     }
 
-    #color-mode:checked~.themed-content .dark-mode-hide {
+    #theme-switcher:checked~.themed-content .dark-mode-hide {
         display: none;
     }
 
-    #color-mode:checked~.themed-content .light-mode-hide {
+    #theme-switcher:checked~.themed-content .light-mode-hide {
         display: initial;
     }
 }
@@ -598,3 +612,14 @@ flex-basis: 100%;
         max-width: 100%;
     }
 }
+
+/* SVG icons */
+
+.icon svg {
+    width: 16px;
+    height: 16px;
+}
+
+.icon svg path {
+    fill: var(--primary-text-color);
+}

M rules.min → rules.min

@@ -25,8 +25,11 @@ "Articles"          %title
   "page"              %content-type
   ARCHIVES dvalues (/code :a /code :b a b >) sort %archives
   ARCHIVE-COLUMNS   %archive-columns
+  ; TODO: why processing twice??
   dup "_archives" swap mustache %contents
-  dup "page" swap mustache %contents
+  dup "page" swap mustache :page
+  "archives" page process-icons
+  %contents
   output-fwrite
 ) ^create-archives-page
 
@@ -39,8 +42,11 @@ "Articles"          %title
   "page"              %content-type
   ARCHIVES dvalues (/code :a /code :b a b >) sort %archives
   ARCHIVE-COLUMNS   %archive-columns
+  ; TODO: why processing twice??
   dup "_archives" swap mustache %contents
-  dup "page" swap mustache %contents
+  dup "page" swap mustache :page
+  "articles" page process-icons
+  %contents
   output-fwrite
 ) ^create-articles-page
 
@@ -54,7 +60,9 @@ "Projects"                                          %title
   "page"                                              %content-type
   PROJECTS ('active dhas?) filter (/id swap /id <) sort     %active-projects
   PROJECTS ('active dhas? not) filter (/id swap /id <) sort %inactive-projects
-  dup "projects" swap mustache %contents
+  dup "projects" swap mustache :page
+  "projects" page process-icons
+  %contents
   output-fwrite
 ) ^create-projects-page
 
@@ -138,6 +146,34 @@ asset output-cp
 ) ^copy-pdf-article-asset
 
 
+; Process :icon: markup
+(
+  symbol process-icons
+  (str :id str :text ==> str :result)
+  ( 
+    ; whitelist of common false positives for icon markup
+    ("borrow", "http", "cakephp") :whitelist
+    text ":([a-z]+[a-z0-9-]+):" (
+      :match
+      match 0 get :content
+      match 1 get :icon
+      "assets/images/entypo/$#.svg" (icon) =% :path
+      (path file?)
+        (
+          path fread from-xml "svg" xquery to-xml :svg
+          "<span class=\"icon\">$#</span>" (svg) =% @content
+        )
+        (
+          (whitelist icon in? not)
+            ("$# - Icon not found: $#" (id icon) =% warn)
+          when
+        )
+      if
+      content
+    ) replace-apply @result
+  ) 
+) ::
+
 ; Process a content file applying the appropriate template
 ; and compiling markdown to HTML if necessary.
 (
@@ -154,6 +190,7 @@ content input-fread @contents
   (content /ext ".md" ==) (contents content markdown @contents) when
   content contents %contents @content
   tpl content mustache @page
+  id page process-icons @page
   content page %contents @content
   (
       ((id "^(glyph|ruby-compendium)\/book" match?) ()) ;Do not add index.html
@@ -201,7 +238,9 @@ HOME
   latest %latest
   recents %recents
   ;tags %tags
-  dup "home" swap mustache %contents
+  dup "home" swap mustache :page
+  "home" page process-icons
+  %contents
   output-fwrite
 ) ^generate-home
 
@@ -217,10 +256,9 @@ ) tap
   output-fwrite
 ) ^process-css-asset
 
-
 ;;;;; MAIN ;;;;;
 
-#|
+;#|
 ; Process all contents
 contents (
   :content
@@ -246,7 +284,7 @@ create-articles-page
 
 ; Generate home page
 generate-home
-|#
+;|#
 
 ; Process all assets.
 assets (

M templates/_theme_switcher.mustache → templates/_theme_switcher.mustache

@@ -1,5 +1,5 @@ 
-    <input id="color-mode" type="checkbox" name="color-mode">
-    <label for="color-mode" class="themed-content">
-      <span class="dark-mode-hide">Dark Mode</span>
-      <span class="light-mode-hide">Light Mode</span>
+    <input id="theme-switcher" type="checkbox" name="theme-switcher">
+    <label for="theme-switcher" class="themed-content">
+      <span class="dark-mode-hide theme-switcher-icon">:moon:</span>
+      <span class="light-mode-hide theme-switcher-icon">:light-up:</span>
     </label>