From f90e51b5469dd2c8d84cdfc247b83bd3cf419882 Mon Sep 17 00:00:00 2001
From: KoloMl <thekolomoets@hotmail.com>
Date: Sat, 7 Dec 2024 20:54:56 +0400
Subject: [PATCH] Added icon for the properties to differentiate between props
 & tags

---
 manifest.json                       | 3 +++
 src/lib/components/SearchWrapper.js | 4 ++++
 src/styles/content/header.scss      | 9 +++++++++
 3 files changed, 16 insertions(+)
 create mode 100644 src/styles/content/header.scss

diff --git a/manifest.json b/manifest.json
index 0ec3a7d..d547d94 100644
--- a/manifest.json
+++ b/manifest.json
@@ -39,6 +39,9 @@
             ],
             "js": [
                 "src/content/header.js"
+            ],
+            "css": [
+                "src/styles/content/header.scss"
             ]
         },
         {
diff --git a/src/lib/components/SearchWrapper.js b/src/lib/components/SearchWrapper.js
index 43720db..276747b 100644
--- a/src/lib/components/SearchWrapper.js
+++ b/src/lib/components/SearchWrapper.js
@@ -289,6 +289,10 @@ export class SearchWrapper extends BaseComponent {
     suggestionItem.dataset.value = suggestedTerm;
     suggestionItem.innerText = suggestedTerm;
 
+    const propertyIcon = document.createElement('i');
+    propertyIcon.classList.add('fa', 'fa-info-circle');
+    suggestionItem.insertAdjacentElement('afterbegin', propertyIcon);
+
     suggestionItem.addEventListener('mouseover', () => {
       SearchWrapper.#findAndResetSelectedSuggestion(suggestionItem);
       suggestionItem.classList.add('autocomplete__item--selected');
diff --git a/src/styles/content/header.scss b/src/styles/content/header.scss
new file mode 100644
index 0000000..22b76e0
--- /dev/null
+++ b/src/styles/content/header.scss
@@ -0,0 +1,9 @@
+.autocomplete {
+  &__item {
+    &--property {
+      i {
+        margin-right: .5em;
+      }
+    }
+  }
+}