From b861bbb5810c95fe7079c853453ea698ca01f336 Mon Sep 17 00:00:00 2001
From: Ralph Amissah <ralph.amissah@gmail.com>
Date: Tue, 27 Jun 2023 16:53:20 -0400
Subject: icon chars, usability / cosmetic minor fix

---
 src/doc_reform/io_out/html_snippet.d         |  6 +-
 src/doc_reform/io_out/metadata.d             | 66 +++++++++++++++++-----
 src/doc_reform/io_out/xmls.d                 | 12 ++--
 src/doc_reform/io_out/xmls_css.d             | 84 ++++++++++++++++++++++++++++
 src/doc_reform/meta/metadoc_curate_authors.d | 39 ++++++++++++-
 src/doc_reform/meta/metadoc_curate_topics.d  | 39 ++++++++++++-
 6 files changed, 217 insertions(+), 29 deletions(-)

(limited to 'src/doc_reform')

diff --git a/src/doc_reform/io_out/html_snippet.d b/src/doc_reform/io_out/html_snippet.d
index 8dbb949..92c25d5 100644
--- a/src/doc_reform/io_out/html_snippet.d
+++ b/src/doc_reform/io_out/html_snippet.d
@@ -71,9 +71,9 @@ template htmlSnippet() {
     <link href="%s" rel="stylesheet" />
   </head>
   <body>
-    <p class="heading">
-      <a href="%s">⟰&nbsp;</a>&nbsp;
-      <a href="%s">&nbsp;≅&nbsp;</a>
+    <p class="icons">
+      <a href="%s" class="lnkicon">⟰&nbsp;</a>&nbsp;
+      <a href="%s" class="lnkicon">&nbsp;≅&nbsp;</a>
     </p>
   </body>
 </html>┃",
diff --git a/src/doc_reform/io_out/metadata.d b/src/doc_reform/io_out/metadata.d
index 2745237..1ac7350 100644
--- a/src/doc_reform/io_out/metadata.d
+++ b/src/doc_reform/io_out/metadata.d
@@ -60,7 +60,7 @@ template outputMetadata() {
         <div class="flex-menu-option">
           <!-- SiSU Spine Search -->
           <form action="%s" target="_top" method="POST" accept-charset="UTF-8" id="searchtxt">
-          &nbsp;&nbsp;<font size="2">&#x1f50e;&nbsp;
+          &nbsp;&nbsp;<font size="2">%s&nbsp;
           <input type="text" name="sf" size="24" maxlength="255">%s
           <input type="hidden" name="sml" value="1000">
           <input type="hidden" name="ec" value="on">
@@ -84,6 +84,11 @@ template outputMetadata() {
     <!-- SiSU Spine Search -->
     </div>┃",
         doc_matters.conf_make_meta.conf.w_srv_cgi_action,
+        (doc_matters.conf_make_meta.conf.w_srv_db_sqlite_filename.empty)
+          ? ""
+          : "\n    <a href=\""
+            ~ doc_matters.conf_make_meta.conf.w_srv_cgi_action
+            ~ "\">&#x1f50e;&nbsp;</a>",
         (doc_matters.conf_make_meta.conf.w_srv_db_sqlite_filename.empty)
           ? ""
           : "\n    <input type=\"hidden\" name=\"db\" value=\""
@@ -134,6 +139,18 @@ string theme_dark_0 = format(q"┃
     color                    : #888888;
     text-decoration          : underline;
   }
+  a.lnkicon:link {
+    text-decoration          : none;
+  }
+  a.lnkicon:visited {
+    text-decoration          : none;
+  }
+  a.lnkicon:hover {
+    font-size                : 160%%;
+  }
+  a:hover img {
+    background-color         : #FFFFFF;
+  }
   input {
     color                    : #FFFFFF;
     background-color         : #777777;
@@ -164,6 +181,18 @@ string theme_light_0 = format(q"┃
     color                    : #003399;
     text-decoration          : underline;
   }
+  a.lnkicon:link {
+    text-decoration          : none;
+  }
+  a.lnkicon:visited {
+    text-decoration          : none;
+  }
+  a.lnkicon:hover {
+    font-size                : 160%%;
+  }
+  a:hover img {
+    background-color         : #FFFFFF;
+  }
   input {
     color                    : #000000;
     background-color         : #FFFFFF;
@@ -265,6 +294,15 @@ string theme_light_1 = format(q"┃
     margin-right             : 6px;
     text-align               : left;
   }
+  p.icons, .icons_center {
+    font-size                : 100%%;
+    margin-top               : 0px;
+    margin-bottom            : 0px;
+    margin-right             : 6px;
+  }
+  p.icons {
+    text-align               : left;
+  }
   p.lev0 {
     font-size                : 120%%;
     margin-left              : 1em;
@@ -388,9 +426,9 @@ string theme_light_1 = format(q"┃
     ┃");
     metadata_ ~= "<div class=\"flex-menu-bar\"><div class=\"flex-menu-option\">";
     if (doc_matters.opt.action.html_link_curate) {
-      metadata_ ~= format(q"┃<p>[<a href="%s">&nbsp;<b>⟰</b>&nbsp;HOME&nbsp;</a>&nbsp;|&nbsp;<a href="../../index.html">&nbsp;≅&nbsp;Collection&nbsp;</a>]&nbsp;&nbsp;[
-       <a href="../../authors.html">&nbsp;&#x1F58B;&nbsp;Authors&nbsp;</a> |
-       <a href="../../topics.html">&nbsp;⌘&nbsp;Topics&nbsp;</a>]</p>
+      metadata_ ~= format(q"┃<p class="icons">[<a href="%s" class="lnkicon">&nbsp;<b>⟰</b>&nbsp;HOME&nbsp;</a>&nbsp;|&nbsp;<a href="../../index.html" class="lnkicon">&nbsp;≅&nbsp;Collection&nbsp;</a>]&nbsp;&nbsp;[
+       <a href="../../authors.html" class="lnkicon">&nbsp;&#x1F58B;&nbsp;Authors&nbsp;</a> |
+       <a href="../../topics.html" class="lnkicon">&nbsp;⌘&nbsp;Topics&nbsp;</a>]</p>
     ┃",
     (doc_matters.opt.action.webserver_url_doc_root.length > 0)
       ? doc_matters.opt.action.webserver_url_doc_root
@@ -398,7 +436,7 @@ string theme_light_1 = format(q"┃
       , // HOME index.html equivalent _cfg.www_url_doc_root,
     );
     } else {
-      metadata_ ~= format(q"┃<p>[<a href="../../../index.html">&nbsp;≅&nbsp;<b>HOME</b>&nbsp;</a>&nbsp;<a href="../../index.html">&nbsp;≅&nbsp;Collection&nbsp;</a>]
+      metadata_ ~= format(q"┃<p class="icons">[<a href="../../../index.html" class="lnkicon">&nbsp;≅&nbsp;<b>HOME</b>&nbsp;</a>&nbsp;<a href="../../index.html" class="lnkicon">&nbsp;≅&nbsp;Collection&nbsp;</a>]
     ┃");
     }
     metadata_ ~= "</div>" ~ inline_search_form(doc_matters) ~ "</div><hr />";
@@ -436,35 +474,35 @@ string theme_light_1 = format(q"┃
     }
     metadata_ ~= "<hr /><p class=\"lev1\">source: "      ~ doc_matters.src.filename_base ~ "</p>";
     if (doc_matters.opt.action.html_link_markup_source) {
-      metadata_ ~= "<p class=\"lev1\">●&nbsp;&nbsp;markup source:&nbsp;&nbsp;the&nbsppod&nbsp[<a href=\"../../" ~ pth_pod.internal_base ~ "/" ~ doc_matters.src.filename_base ~ ".zip\">"
+      metadata_ ~= "<p class=\"lev1\">●&nbsp;&nbsp;markup source:&nbsp;&nbsp;the&nbsppod&nbsp[<a href=\"../../" ~ pth_pod.internal_base ~ "/" ~ doc_matters.src.filename_base ~ ".zip\" class=\"lnkicon\">"
                    ~ "&nbsp;🫛&nbsp;zipped&nbsp;</a>|&nbsp;"
-                   ~ "<a href=\"../../" ~ pth_pod.internal_base ~ "/" ~ doc_matters.src.filename_base ~ "/\">"
+                   ~ "<a href=\"../../" ~ pth_pod.internal_base ~ "/" ~ doc_matters.src.filename_base ~ "/\" class=\"lnkicon\">"
                    ~ "&nbsp;🫛&nbsp;tree&nbsp;</a>]&nbsp;";
     }
-    metadata_ ~= "<p class=\"lev1\">●&nbsp;&nbsp;outputs:&nbsp;&nbsp;[&nbsp;html:&nbsp;<a href=\""    ~ doc_matters.src.filename_base ~ ".html\">"
+    metadata_ ~= "<p class=\"lev1\">●&nbsp;&nbsp;outputs:&nbsp;&nbsp;[&nbsp;html:&nbsp;<a href=\""    ~ doc_matters.src.filename_base ~ ".html\" class=\"lnkicon\">"
                  ~ "&nbsp;▤&nbsp;scroll&nbsp;</a>&nbsp;"
-                 ~ "|<a href=\""    ~ doc_matters.src.filename_base ~ "/toc.html\">"
+                 ~ "|<a href=\""    ~ doc_matters.src.filename_base ~ "/toc.html\" class=\"lnkicon\">"
                  ~ "&nbsp;※&nbsp;seg&nbsp;</a>]&nbsp;&nbsp;&nbsp;"
-                 ~ "[<a href=\"../../" ~ pth_epub.internal_base ~ "/" ~ doc_matters.src.filename_base ~ "." ~ doc_matters.src.language ~ ".epub\">"
+                 ~ "[<a href=\"../../" ~ pth_epub.internal_base ~ "/" ~ doc_matters.src.filename_base ~ "." ~ doc_matters.src.language ~ ".epub\" class=\"lnkicon\">"
                  ~ "&nbsp;◆&nbsp;epub&nbsp;</a>]&nbsp;&nbsp;&nbsp;";
     if ((doc_matters.opt.action.html_link_pdf) || (doc_matters.opt.action.html_link_pdf_a4)) {
       metadata_ ~=  "[&nbsp;pdf:&nbsp;<a href=\"../../pdf/"
                  ~ doc_matters.src.filename_base
-                 ~ "." ~ doc_matters.src.language ~ ".a4.portrait.pdf\">"
+                 ~ "." ~ doc_matters.src.language ~ ".a4.portrait.pdf\" class=\"lnkicon\">"
                  ~ "&nbsp;□&nbsp;a4&nbsp;</a>&nbsp"
                  ~ "|<a href=\"../../pdf/"
                  ~ doc_matters.src.filename_base
-                 ~ "." ~ doc_matters.src.language ~ ".letter.portrait.pdf\">"
+                 ~ "." ~ doc_matters.src.language ~ ".letter.portrait.pdf\" class=\"lnkicon\">"
                  ~ "&nbsp;□&nbsp;U.S.&nbsp;letter&nbsp;</a>]&nbsp";
     } else if (doc_matters.opt.action.html_link_pdf_a4) {
       metadata_ ~=  "[<a href=\"../../pdf/"
                  ~ doc_matters.src.filename_base
-                 ~ "." ~ doc_matters.src.language ~ ".a4.portrait.pdf\">"
+                 ~ "." ~ doc_matters.src.language ~ ".a4.portrait.pdf\" class=\"lnkicon\">"
                  ~ "&nbsp;□&nbsp;pdf&nbsp;(a4)&nbsp;</a>]&nbsp";
     } else if (doc_matters.opt.action.html_link_pdf_letter) {
       metadata_ ~=  "[<a href=\"../../pdf/"
                  ~ doc_matters.src.filename_base
-                 ~ "." ~ doc_matters.src.language ~ ".letter.portrait.pdf\">"
+                 ~ "." ~ doc_matters.src.language ~ ".letter.portrait.pdf\" class=\"lnkicon\">"
                  ~ "&nbsp;□&nbsp;pdf&nbsp;(U.S.&nbsp;letter)&nbsp;</a>]&nbsp";
     }
     metadata_ ~=  "</p>";
diff --git a/src/doc_reform/io_out/xmls.d b/src/doc_reform/io_out/xmls.d
index 4fd4e1b..16781e7 100644
--- a/src/doc_reform/io_out/xmls.d
+++ b/src/doc_reform/io_out/xmls.d
@@ -239,13 +239,13 @@ template outputXHTMLs() {
         _locations = (doc_matters.conf_make_meta.make.home_button_text)
           .replaceAll(
             rgx.inline_link,
-            ("<p class=\"tiny_left\"><a href=\"$2\">$1</a></p>"))
+            ("<p class=\"tiny_left\"><a href=\"$2\" class=\"lnkicon\">$1</a></p>"))
           .replaceAll(
             rgx.br_line, "")
           .replaceAll(
             rgx.br_line_inline, "");
       } else {
-         _locations = "<p class=\"tiny_left\"><a href=\"https://www.doc-reform.org\">spine</a></p>\n<p class=\"tiny_left\"><a href=\"https://git.sisudoc.org/software/spine/\">sources / git</a></p>\n<p class=\"tiny_left\"><a href=\"https://www.sisudoc.org\">www.sisudoc.org</a></p>";
+         _locations = "<p class=\"icons\"><a href=\"https://www.doc-reform.org\" class=\"lnkicon\">spine</a></p>\n<p class=\"icons\"><a href=\"https://git.sisudoc.org/software/spine/\" class=\"lnkicon\">sources / git</a></p>\n<p class=\"icons\"><a href=\"https://www.sisudoc.org\" class=\"lnkicon\">www.sisudoc.org</a></p>";
       }
       string o;
       o = format(q"┃<div class="flex-menu-option">
@@ -320,7 +320,7 @@ template outputXHTMLs() {
     ) {
       string o;
       string metadata_links = ((doc_matters.opt.action.html_link_curate)
-        ? format(q"┃<p class="small"><a href="%s">⟰&nbsp;</a>&nbsp;[<a href="%s">&nbsp;%s&nbsp;</a><a href="%sepub/%s.%s.epub">&nbsp;◆&nbsp;</a>%s%s<a href="%smetadata.%s.html">&nbsp;ℹ&nbsp;</a>]&nbsp;&nbsp;<a href="%s../../index.html">&nbsp;≅&nbsp;</a>|<a href="%s../../authors.html">&nbsp;&#x1F58B;&nbsp;</a>|<a href="%s../../topics.html">&nbsp;⌘&nbsp;</a>|</p>┃",
+        ? format(q"┃<p class="icons"><a href="%s" class="lnkicon">⟰&nbsp;</a>&nbsp;[<a href="%s" class="lnkicon">&nbsp;%s&nbsp;</a><a href="%sepub/%s.%s.epub" class="lnkicon">&nbsp;◆&nbsp;</a>%s%s<a href="%smetadata.%s.html" class="lnkicon">&nbsp;ℹ&nbsp;</a>]&nbsp;&nbsp;<a href="%s../../index.html" class="lnkicon">&nbsp;≅&nbsp;</a>|<a href="%s../../authors.html" class="lnkicon">&nbsp;&#x1F58B;&nbsp;</a>|<a href="%s../../topics.html" class="lnkicon">&nbsp;⌘&nbsp;</a>|</p>┃",
             (doc_matters.opt.action.webserver_url_doc_root.length > 0)
               ? doc_matters.opt.action.webserver_url_doc_root
               : doc_matters.conf_make_meta.conf.w_srv_data_root_url
@@ -339,7 +339,7 @@ template outputXHTMLs() {
               ~ doc_matters.src.filename_base
               ~  "."
               ~ doc_matters.src.lng
-              ~ ".a4.portrait.pdf\">&nbsp;□&nbsp;</a>")
+              ~ ".a4.portrait.pdf\" class=\"lnkicon\">&nbsp;□&nbsp;</a>")
             : "",
             (doc_matters.opt.action.html_link_pdf || doc_matters.opt.action.html_link_pdf_letter)
             ? ("<a href=\""
@@ -348,7 +348,7 @@ template outputXHTMLs() {
               ~ doc_matters.src.filename_base
               ~  "."
               ~ doc_matters.src.lng
-              ~ ".letter.portrait.pdf\">&nbsp;□&nbsp;</a>")
+              ~ ".letter.portrait.pdf\" class=\"lnkicon\">&nbsp;□&nbsp;</a>")
             : "",
             (type == "seg") ? "../" : "",
             doc_matters.src.filename_base,
@@ -486,7 +486,7 @@ template outputXHTMLs() {
   <hr />
   <div class="generator">
     <p class="small_center" id="sisu_spine"><a name="sisu_spine"></a>
-      <a href="https://sisudoc.org">≅ SiSU Spine ፨</a> (object numbering &amp; object search)
+      <a href="https://sisudoc.org" class="lnkicon">≅ SiSU Spine ፨</a> (object numbering &amp; object search)
     </p>
     <p class="small_center" id="sisu_spine"><a name="sisu_spine"></a>
       (web 1993, object numbering 1997, object search 2002 ...) 2023
diff --git a/src/doc_reform/io_out/xmls_css.d b/src/doc_reform/io_out/xmls_css.d
index dc4811d..50cab21 100644
--- a/src/doc_reform/io_out/xmls_css.d
+++ b/src/doc_reform/io_out/xmls_css.d
@@ -510,6 +510,15 @@ a.lnkocn:hover {
   color                    : #777777;
   font-size                : 1.8rem;
 }
+a.lnkicon:link {
+  text-decoration          : none;
+}
+a.lnkicon:visited {
+  text-decoration          : none;
+}
+a.lnkicon:hover {
+  font-size                : 160%%;
+}
 a:hover img {
   background-color         : #FFFFFF;
 }
@@ -798,6 +807,15 @@ p.tiny_center {
   margin-right             : 0px;
   text-align               : center;
 }
+p.icons, .icons_center {
+  font-size                : 100%%;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+}
+p.icons {
+  text-align               : left;
+}
 p.concordance_word {
   line-height              : 150%%;
   font-weight              : bold;
@@ -1241,6 +1259,16 @@ a.lnkocn:hover {
   color                    : #BBBBBB;
   font-size                : 1.8rem;
 }
+a.lnkicon:link {
+  text-decoration          : none;
+}
+a.lnkicon:visited {
+  text-decoration          : none;
+}
+a.lnkicon:hover {
+  color                    : #BBBBBB;
+  font-size                : 120%%;
+}
 a:hover img {
   background-color         : #000000;
 }
@@ -1973,6 +2001,15 @@ a.lnkocn:hover {
   color                    : #777777;
   font-size                : 1.8rem;
 }
+a.lnkicon:link {
+  text-decoration          : none;
+}
+a.lnkicon:visited {
+  text-decoration          : none;
+}
+a.lnkicon:hover {
+  font-size                : 160%%;
+}
 a:hover img {
   background-color         : #FFFFFF;
 }
@@ -2261,6 +2298,15 @@ p.tiny_center {
   margin-right             : 0px;
   text-align               : center;
 }
+p.icons, .icons_center {
+  font-size                : 100%%;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+}
+p.icons {
+  text-align               : left;
+}
 p.concordance_word {
   line-height              : 150%%;
   font-weight              : bold;
@@ -2630,6 +2676,16 @@ a.lnkocn:hover {
   color                    : #BBBBBB;
   font-size                : 1.8rem;
 }
+a.lnkicon:link {
+  text-decoration          : none;
+}
+a.lnkicon:visited {
+  text-decoration          : none;
+}
+a.lnkicon:hover {
+  color                    : #BBBBBB;
+  font-size                : 120%%;
+}
 a:hover img {
   background-color         : #000000;
 }
@@ -3288,6 +3344,15 @@ a.lnkocn:hover {
   color                    : #777777;
   font-size                : 1.8rem;
 }
+a.lnkicon:link {
+  text-decoration          : none;
+}
+a.lnkicon:visited {
+  text-decoration          : none;
+}
+a.lnkicon:hover {
+  font-size                : 160%%;
+}
 a:hover img {
   background-color         : #FFFFFF;
 }
@@ -3576,6 +3641,15 @@ p.tiny_center {
   margin-right             : 0px;
   text-align               : center;
 }
+p.icons, .icons_center {
+  font-size                : 100%%;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+}
+p.icons {
+  text-align               : left;
+}
 p.concordance_word {
   line-height              : 150%%;
   font-weight              : bold;
@@ -3835,6 +3909,16 @@ a.lnkocn:hover {
   color                    : #BBBBBB;
   font-size                : 1.8rem;
 }
+a.lnkicon:link {
+  text-decoration          : none;
+}
+a.lnkicon:visited {
+  text-decoration          : none;
+}
+a.lnkicon:hover {
+  color                    : #BBBBBB;
+  font-size                : 120%%;
+}
 a:hover img {
   background-color         : #000000;
 }
diff --git a/src/doc_reform/meta/metadoc_curate_authors.d b/src/doc_reform/meta/metadoc_curate_authors.d
index e11c9aa..39887c6 100644
--- a/src/doc_reform/meta/metadoc_curate_authors.d
+++ b/src/doc_reform/meta/metadoc_curate_authors.d
@@ -140,6 +140,18 @@ string theme_dark_0 = format(q"┃
     color                    : #FFFFFF;
     background               : #777777;
   }
+  a.lnkicon:link {
+    text-decoration          : none;
+  }
+  a.lnkicon:visited {
+    text-decoration          : none;
+  }
+  a.lnkicon:hover {
+    font-size                : 160%%;
+  }
+  a:hover img {
+    background-color         : #FFFFFF;
+  }
   input, select, textarea {
     font-size                : 150%%;
   }
@@ -187,6 +199,18 @@ string theme_light_0 = format(q"┃
   a.lev3:hover {
     background               : #BBBBBB;
   }
+  a.lnkicon:link {
+    text-decoration          : none;
+  }
+  a.lnkicon:visited {
+    text-decoration          : none;
+  }
+  a.lnkicon:hover {
+    font-size                : 160%%;
+  }
+  a:hover img {
+    background-color         : #FFFFFF;
+  }
   input, select, textarea {
     font-size                : 150%%;
   }
@@ -331,6 +355,15 @@ string theme_light_1 = format(q"┃
     margin-right             : 6px;
     text-align               : left;
   }
+  p.icons, .icons_center {
+    font-size                : 100%%;
+    margin-top               : 0px;
+    margin-bottom            : 0px;
+    margin-right             : 6px;
+  }
+  p.icons {
+    text-align               : left;
+  }
   p.lev0 {
     font-size                : 120%%;
     margin-left              : 1em;
@@ -394,14 +427,14 @@ string theme_light_1 = format(q"┃
 <h1>⌘ Curated metadata - &#x1F58B; Authors (output organised by language &amp; filetype)</h1>
 <div class="flex-menu-bar">
 <div class="flex-menu-option">
-<p>[<a href="../../index.html">&nbsp;⟰&nbsp;HOME&nbsp;</a>&nbsp;|&nbsp;<a href="../index.html">&nbsp;≅&nbsp;Collection&nbsp;</a>]
- [<a href="topics.html">&nbsp;⌘&nbsp;Curated&nbsp;metadata&nbsp;-&nbsp;⌘&nbsp;Topics&nbsp;</a>] </p>
+<p class="icons">[<a href="../../index.html" class="lnkicon">&nbsp;⟰&nbsp;HOME&nbsp;</a>&nbsp;|&nbsp;<a href="../index.html" class="lnkicon">&nbsp;≅&nbsp;Collection&nbsp;</a>]
+ [<a href="topics.html" class="lnkicon">&nbsp;⌘&nbsp;Curated&nbsp;metadata&nbsp;-&nbsp;⌘&nbsp;Topics&nbsp;</a>] </p>
 </div>
 %s
 </div>
 <p></p>
 <hr />
-<p><a href="#A">A</a>,&nbsp;<a href="#B">B</a>,&nbsp;<a href="#C">C</a>,&nbsp;<a href="#D">D</a>,&nbsp;<a href="#E">E</a>,&nbsp;<a href="#F">F</a>,&nbsp;<a href="#G">G</a>,&nbsp;<a href="#H">H</a>,&nbsp;<a href="#I">I</a>,&nbsp;<a href="#J">J</a>,&nbsp;<a href="#K">K</a>,&nbsp;<a href="#L">L</a>,&nbsp;<a href="#M">M</a>,&nbsp;<a href="#N">N</a>,&nbsp;<a href="#O">O</a>,&nbsp;<a href="#P">P</a>,&nbsp;<a href="#Q">Q</a>,&nbsp;<a href="#R">R</a>,&nbsp;<a href="#S">S</a>,&nbsp;<a href="#T">T</a>,&nbsp;<a href="#U">U</a>,&nbsp;<a href="#V">V</a>,&nbsp;<a href="#W">W</a>,&nbsp;<a href="#X">X</a>,&nbsp;<a href="#Y">Y</a>,&nbsp;<a href="#Z">Z</a>,&nbsp;
+<p><a href="#A" class="lnkicon">A</a>,&nbsp;<a href="#B" class="lnkicon">B</a>,&nbsp;<a href="#C" class="lnkicon">C</a>,&nbsp;<a href="#D" class="lnkicon">D</a>,&nbsp;<a href="#E" class="lnkicon">E</a>,&nbsp;<a href="#F" class="lnkicon">F</a>,&nbsp;<a href="#G" class="lnkicon">G</a>,&nbsp;<a href="#H" class="lnkicon">H</a>,&nbsp;<a href="#I" class="lnkicon">I</a>,&nbsp;<a href="#J" class="lnkicon">J</a>,&nbsp;<a href="#K" class="lnkicon">K</a>,&nbsp;<a href="#L" class="lnkicon">L</a>,&nbsp;<a href="#M" class="lnkicon">M</a>,&nbsp;<a href="#N" class="lnkicon">N</a>,&nbsp;<a href="#O" class="lnkicon">O</a>,&nbsp;<a href="#P" class="lnkicon">P</a>,&nbsp;<a href="#Q" class="lnkicon">Q</a>,&nbsp;<a href="#R" class="lnkicon">R</a>,&nbsp;<a href="#S" class="lnkicon">S</a>,&nbsp;<a href="#T" class="lnkicon">T</a>,&nbsp;<a href="#U" class="lnkicon">U</a>,&nbsp;<a href="#V" class="lnkicon">V</a>,&nbsp;<a href="#W" class="lnkicon">W</a>,&nbsp;<a href="#X" class="lnkicon">X</a>,&nbsp;<a href="#Y" class="lnkicon">Y</a>,&nbsp;<a href="#Z" class="lnkicon">Z</a>,&nbsp;
 ┃",
   _opt_action.css_theme_default ? theme_light_0 : theme_dark_0,
   _opt_action.css_theme_default ? theme_light_1 : theme_dark_1,
diff --git a/src/doc_reform/meta/metadoc_curate_topics.d b/src/doc_reform/meta/metadoc_curate_topics.d
index c0a3036..d7ab54d 100644
--- a/src/doc_reform/meta/metadoc_curate_topics.d
+++ b/src/doc_reform/meta/metadoc_curate_topics.d
@@ -183,6 +183,18 @@ string theme_dark_0 = format(q"┃
     color                    : #FFFFFF;
     background               : #777777;
   }
+  a.lnkicon:link {
+    text-decoration          : none;
+  }
+  a.lnkicon:visited {
+    text-decoration          : none;
+  }
+  a.lnkicon:hover {
+    font-size                : 160%%;
+  }
+  a:hover img {
+    background-color         : #FFFFFF;
+  }
   input, select, textarea {
     font-size                : 150%%;
   }
@@ -230,6 +242,18 @@ string theme_light_0 = format(q"┃
   a.lev3:hover {
     background               : #BBBBBB;
   }
+  a.lnkicon:link {
+    text-decoration          : none;
+  }
+  a.lnkicon:visited {
+    text-decoration          : none;
+  }
+  a.lnkicon:hover {
+    font-size                : 160%%;
+  }
+  a:hover img {
+    background-color         : #FFFFFF;
+  }
   input, select, textarea {
     font-size                : 150%%;
   }
@@ -372,6 +396,15 @@ string theme_light_1 = format(q"┃
     margin-right             : 6px;
     text-align               : left;
   }
+  p.icons, .icons_center {
+    font-size                : 100%%;
+    margin-top               : 0px;
+    margin-bottom            : 0px;
+    margin-right             : 6px;
+  }
+  p.icons {
+    text-align               : left;
+  }
   p.lev0 {
     font-size                : 120%%;
     margin-left              : 1em;
@@ -435,13 +468,13 @@ string theme_light_1 = format(q"┃
 <h1>⌘ Curated metadata - ⌘ Topics (output organised by language &amp; filetype)</h1>
 <div class="flex-menu-bar">
 <div class="flex-menu-option">
-<p>[<a href="../../index.html">&nbsp;⟰&nbsp;HOME&nbsp;</a>&nbsp;|&nbsp;<a href="../index.html">&nbsp;≅&nbsp;Collection&nbsp;</a>]
- [<a href="authors.html">&nbsp;⌘&nbsp;Curated&nbsp;metadata&nbsp;-&nbsp;&#x1F58B;&nbsp;Authors&nbsp;</a>]
+<p class="icons">[<a href="../../index.html" class="lnkicon">&nbsp;⟰&nbsp;HOME&nbsp;</a>&nbsp;|&nbsp;<a href="../index.html" class="lnkicon">&nbsp;≅&nbsp;Collection&nbsp;</a>]
+ [<a href="authors.html" class="lnkicon">&nbsp;⌘&nbsp;Curated&nbsp;metadata&nbsp;-&nbsp;&#x1F58B;&nbsp;Authors&nbsp;</a>]
 </p>
 </div>
  %s
 </div>
-<p><a href="#A">A</a>,&nbsp;<a href="#B">B</a>,&nbsp;<a href="#C">C</a>,&nbsp;<a href="#D">D</a>,&nbsp;<a href="#E">E</a>,&nbsp;<a href="#F">F</a>,&nbsp;<a href="#G">G</a>,&nbsp;<a href="#H">H</a>,&nbsp;<a href="#I">I</a>,&nbsp;<a href="#J">J</a>,&nbsp;<a href="#K">K</a>,&nbsp;<a href="#L">L</a>,&nbsp;<a href="#M">M</a>,&nbsp;<a href="#N">N</a>,&nbsp;<a href="#O">O</a>,&nbsp;<a href="#P">P</a>,&nbsp;<a href="#Q">Q</a>,&nbsp;<a href="#R">R</a>,&nbsp;<a href="#S">S</a>,&nbsp;<a href="#T">T</a>,&nbsp;<a href="#U">U</a>,&nbsp;<a href="#V">V</a>,&nbsp;<a href="#W">W</a>,&nbsp;<a href="#X">X</a>,&nbsp;<a href="#Y">Y</a>,&nbsp;<a href="#Z">Z</a>,&nbsp;
+<p><a href="#A" class="lnkicon">A</a>,&nbsp;<a href="#B" class="lnkicon">B</a>,&nbsp;<a href="#C" class="lnkicon">C</a>,&nbsp;<a href="#D" class="lnkicon">D</a>,&nbsp;<a href="#E" class="lnkicon">E</a>,&nbsp;<a href="#F" class="lnkicon">F</a>,&nbsp;<a href="#G" class="lnkicon">G</a>,&nbsp;<a href="#H" class="lnkicon">H</a>,&nbsp;<a href="#I" class="lnkicon">I</a>,&nbsp;<a href="#J" class="lnkicon">J</a>,&nbsp;<a href="#K" class="lnkicon">K</a>,&nbsp;<a href="#L" class="lnkicon">L</a>,&nbsp;<a href="#M" class="lnkicon">M</a>,&nbsp;<a href="#N" class="lnkicon">N</a>,&nbsp;<a href="#O" class="lnkicon">O</a>,&nbsp;<a href="#P" class="lnkicon">P</a>,&nbsp;<a href="#Q" class="lnkicon">Q</a>,&nbsp;<a href="#R" class="lnkicon">R</a>,&nbsp;<a href="#S" class="lnkicon">S</a>,&nbsp;<a href="#T" class="lnkicon">T</a>,&nbsp;<a href="#U" class="lnkicon">U</a>,&nbsp;<a href="#V" class="lnkicon">V</a>,&nbsp;<a href="#W" class="lnkicon">W</a>,&nbsp;<a href="#X" class="lnkicon">X</a>,&nbsp;<a href="#Y" class="lnkicon" class="lnkicon">Y</a>,&nbsp;<a href="#Z" class="lnkicon">Z</a>,&nbsp;
 <p></p>
 <hr />
 ┃",
-- 
cgit v1.2.3