From 9e20c65ad82b74cd8ce6fb9ee020d62d00989e50 Mon Sep 17 00:00:00 2001
From: spi <22529093+spi43984@users.noreply.github.com>
Date: Wed, 4 Oct 2023 21:06:10 +0200
Subject: [PATCH] List icon configurable (#152)

List icon made configurable by introducing ul-li-icon CSS variable
---
 assets/css/variables.scss                     | 6 +++++-
 assets/js/index.js                            | 7 +++++--
 exampleSite/layouts/partials/custom_head.html | 6 +++++-
 3 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/assets/css/variables.scss b/assets/css/variables.scss
index a5f8400..941b061 100644
--- a/assets/css/variables.scss
+++ b/assets/css/variables.scss
@@ -41,4 +41,8 @@
     /* === Footer === */
     --footer-color-background: #22343a;
     --footer-color: #bbc7cc;
-}
\ No newline at end of file
+
+    /* === Lists === */
+    /* define list element for unnumbered lists, leave empty for default list element */
+    --ul-li-icon: fa-asterisk;
+}
diff --git a/assets/js/index.js b/assets/js/index.js
index a6ec32d..6ae24c7 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -88,8 +88,11 @@ var $sitehead = $("#site-head");
       });
     }
 
-    $('ul').addClass("fa-ul");
-    $("ul li").prepend('<span class="fa-li"><i class="fa fa-asterisk"></i></span>');
+    var ulLiIcon = getComputedStyle(document.documentElement).getPropertyValue('--ul-li-icon');
+    if (ulLiIcon.length > 0) {
+      $('ul').addClass("fa-ul");
+      $("ul li").prepend('<span class="fa-li"><i class="fa ' + ulLiIcon + '"></i></span>');
+    }
     $("blockquote p").prepend('<span class="quo fa fa-quote-left"></span>');
     $("blockquote p").append('<span class="quo fa fa-quote-right"></span>');
   });
diff --git a/exampleSite/layouts/partials/custom_head.html b/exampleSite/layouts/partials/custom_head.html
index a271c94..b492e20 100644
--- a/exampleSite/layouts/partials/custom_head.html
+++ b/exampleSite/layouts/partials/custom_head.html
@@ -14,11 +14,15 @@
     --section-light-bg-color: #ffdb8c!important;
     --section-dark-bg-color: #035e00!important;
     */
+
+     /* define list element for unnumbered lists, leave empty for default list element */
+     /* fa-asterisk is the default icon if this variable definition is missing completely */
+     --ul-li-icon: fa-dashcube;     /* this sets fa-dashcube as list icon */
+     --ul-li-icon: ;                /* this sets the default html list icon */
 }
 </style>
 -->
 
-
 <!-- Custom CSS via "custom.css"-file
      If you would rather place your custom CSS into
      a separate file, create a "custom.css" in your