add icon nail binding

build/app.js

@@ -1796,7 +1796,14 @@ function CheckPantheon(db, sectionName, playerData) {
 
   for (var entry in entries) {
     if (playerData[property][entry] === true) {
-      (0,_hk_functions_js__WEBPACK_IMPORTED_MODULE_2__.SetIconGreen)(section, entry);
+      switch (entry) {
+        case "boundNail":
+          (0,_hk_functions_js__WEBPACK_IMPORTED_MODULE_2__.SetIcon)(section, entry, "bindingNail");
+          break;
+
+        default:
+          (0,_hk_functions_js__WEBPACK_IMPORTED_MODULE_2__.SetIconGreen)(section, entry);
+      }
     } else {
       (0,_hk_functions_js__WEBPACK_IMPORTED_MODULE_2__.SetIconRed)(section, entry);
     }
@@ -6851,6 +6858,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "SetIconPartialJournal": () => (/* binding */ SetIconPartialJournal),
 /* harmony export */   "SetIconRed": () => (/* binding */ SetIconRed),
 /* harmony export */   "SetIconNone": () => (/* binding */ SetIconNone),
+/* harmony export */   "SetIcon": () => (/* binding */ SetIcon),
 /* harmony export */   "ObjectLength": () => (/* binding */ ObjectLength),
 /* harmony export */   "TranslateMapName": () => (/* binding */ TranslateMapName)
 /* harmony export */ });
@@ -6914,14 +6922,6 @@ function SetIconRed() {
   var entry = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
   section.entries[entry].icon = "red";
 }
-/**
- * Switches global variable to an "information" symbol
- */
-
-/* function CurrentDataInfo() {
-    completionSymbol = SYMBOL_INFO;
-} */
-
 /**
  * Switches global variable to no symbol (span with left padding)
  */
@@ -6932,6 +6932,17 @@ function SetIconNone() {
   var entry = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
   section.entries[entry].icon = "none";
 }
+/**
+ * Switches global variable to a chosen symbol
+ */
+
+
+function SetIcon() {
+  var section = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var entry = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+  var icon = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "";
+  section.entries[entry].icon = icon;
+}
 /**
  * Checks the length of a JavaScript Object like Array.length
  * @param {object} object JavaScript Object
@@ -7025,6 +7036,8 @@ var SYMBOL_CLOCK = "<i class='icon-clock'></i>"; // "🕑 "
 
 var SYMBOL_FILE = "<i class='icon-doc-text-inv'></i>"; // "📁"
 
+var SYMBOL_BINDING_NAIL = "<i class='reznoricon-binding-nail'></i>"; // Nail Binding
+
 var SYMBOL_EMPTY = "<span class='padding-left'></span>";
 var FLEUR_DIVIDE = "<div class='horizontal-line'></div>";
 var WIKI_LINK = "https://hollowknight.fandom.com/wiki/";
@@ -7189,6 +7202,7 @@ function GenerateInnerHTML(db) {
   var iconPartial = SYMBOL_PARTIAL;
   var iconClock = SYMBOL_CLOCK;
   var iconNull = SYMBOL_EMPTY;
+  var iconBindingNail = SYMBOL_BINDING_NAIL;
   var finalHTMLFill = "";
   var textFill = "";
   var Img = "";
@@ -7395,7 +7409,7 @@ function GenerateInnerHTML(db) {
         textFill += SingleEntryFill(obj);
         break;
 
-      /* ###################### Create all other sections ##################### */
+      /* ######################### Create all other sections ################################################################## */
 
       default:
         /* ###################### Create section descriptions under each H2 title ##################### */
@@ -7440,6 +7454,10 @@ function GenerateInnerHTML(db) {
                 obj.span[0] = "<span class='spoiler-span-green'>";
                 break;
 
+              case "bindingNail":
+                obj.icon = iconBindingNail;
+                break;
+
               case "red":
                 obj.icon = iconRed;
                 break;

src/css/reznoricon.css

@@ -1,7 +1,7 @@
 [class^="reznoricon-"],
 [class*=" reznoricon-"] {
     position: relative;
-    padding-left: 1.6em;
+    padding-left: 1.48em;
 }
 
 [class^="reznoricon-"]:before,
@@ -12,13 +12,16 @@
     top: 0;
     width: 1.2em;
     height: 1.2em;
-    margin-right: .2em;
+    padding: 0.1em 0 0.1em 0.1em;
+    margin: 0;
     text-align: center;
     line-height: 0;
-    margin-left: .2em;
+    content: "";
-    padding-top: 0.1em;
+    background-size: auto 100%;
+    background-position: center;
+    background-repeat: no-repeat;
 }
 
 .reznoricon-binding-nail:before {
-    content: url("../img/binding-nail.png");
+    background-image: url("../img/binding-nail.png");
 }

src/js/HKCheckCompletion.js

@@ -1970,7 +1970,16 @@ function CheckPantheon(db, sectionName, playerData) {
   for (let entry in entries) {
 
     if (playerData[property][entry] === true) {
-      SetIconGreen(section, entry);
+
+      switch(entry) {
+
+        case "boundNail":
+          SetIcon(section, entry, "bindingNail");
+          break;
+
+        default:
+          SetIconGreen(section, entry);
+      }
     } else {
       SetIconRed(section, entry);
     }

src/js/page-functions.js

@@ -208,6 +208,7 @@ function GenerateInnerHTML(db) {
   let iconPartial = SYMBOL_PARTIAL;
   let iconClock = SYMBOL_CLOCK;
   let iconNull = SYMBOL_EMPTY;
+  let iconBindingNail = SYMBOL_BINDING_NAIL;
 
   let finalHTMLFill = "";
   let textFill = "";
@@ -457,7 +458,7 @@ function GenerateInnerHTML(db) {
 
         break;
 
-        /* ###################### Create all other sections ##################### */
+      /* ######################### Create all other sections ################################################################## */
 
       default:
 
@@ -507,6 +508,10 @@ function GenerateInnerHTML(db) {
                 obj.span[0] = "<span class='spoiler-span-green'>";
                 break;
 
+              case "bindingNail":
+                obj.icon = iconBindingNail;
+                break;
+  
               case "red":
                 obj.icon = iconRed;
                 break;