From e457e6a2f2868cf26f908b62b7d80547af86eae6 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Mon, 25 Aug 2025 21:07:09 +0300
Subject: [PATCH 01/13] style/note icon buttons: fade the color and use the
 default cursor when disabled

---
 apps/client/src/widgets/note_icon.css | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/apps/client/src/widgets/note_icon.css b/apps/client/src/widgets/note_icon.css
index 67eeadecf..cb067a7f6 100644
--- a/apps/client/src/widgets/note_icon.css
+++ b/apps/client/src/widgets/note_icon.css
@@ -10,13 +10,14 @@
     font-size: 180%;
     background-color: transparent;
     border: 1px solid transparent;
-    cursor: pointer;
     padding: 6px;
-    color: var(--main-text-color);
+    cursor: pointer;
+    color: var(--muted-text-color);
 }
-
-.note-icon-widget button.note-icon:hover {
-    border: 1px solid var(--main-border-color);
+    
+.note-icon-widget button.note-icon:disabled {
+    cursor: default;
+    opacity: .75;
 }
 
 .note-icon-widget .dropdown-menu {

From b9101c9fb2cb0a31bd3431e9591ee8d070146b6f Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Mon, 25 Aug 2025 21:12:26 +0300
Subject: [PATCH 02/13] style/delete note dialog: tweak layout

---
 apps/client/src/widgets/dialogs/delete_notes.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/client/src/widgets/dialogs/delete_notes.tsx b/apps/client/src/widgets/dialogs/delete_notes.tsx
index b16fafd0a..bb1b4e7cd 100644
--- a/apps/client/src/widgets/dialogs/delete_notes.tsx
+++ b/apps/client/src/widgets/dialogs/delete_notes.tsx
@@ -113,10 +113,10 @@ function DeletedNotes({ noteIdsToBeDeleted }: { noteIdsToBeDeleted: DeleteNotesP
 
     if (noteIdsToBeDeleted.length) {
         return (
-            <div className="delete-notes-list-wrapper">
+            <div className="delete-notes-list-wrapper" style={{paddingTop: "16px"}}>
                 <h4>{t("delete_notes.notes_to_be_deleted", { notesCount: noteIdsToBeDeleted.length })}</h4>
     
-                <ul className="delete-notes-list" style={{ maxHeight: "200px", overflow: "auto" }}>
+                <ul className="delete-notes-list" style={{ maxHeight: "200px", overflow: "auto"}}>
                     {noteLinks.map((link, index) => (
                         <li key={index} dangerouslySetInnerHTML={{ __html: link }} />
                     ))}

From 8405d960beb7cfcc55fb271c81843476fdf9675d Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Mon, 25 Aug 2025 21:48:52 +0300
Subject: [PATCH 03/13] style/ribbon/attribute editor: improve layout

---
 .../ribbon/components/AttributeEditor.tsx     | 58 ++++++++++---------
 apps/client/src/widgets/ribbon/style.css      | 33 +++--------
 2 files changed, 38 insertions(+), 53 deletions(-)

diff --git a/apps/client/src/widgets/ribbon/components/AttributeEditor.tsx b/apps/client/src/widgets/ribbon/components/AttributeEditor.tsx
index d6c609dba..85eb706fc 100644
--- a/apps/client/src/widgets/ribbon/components/AttributeEditor.tsx
+++ b/apps/client/src/widgets/ribbon/components/AttributeEditor.tsx
@@ -359,36 +359,38 @@ export default function AttributeEditor({ api, note, componentId, notePath, ntxI
                     disableNewlines disableSpellcheck
                 />
 
-                { needsSaving && <ActionButton
-                    icon="bx bx-save"
-                    className="save-attributes-button"
-                    text={escapeQuotes(t("attribute_editor.save_attributes"))}
-                    onClick={save}
-                /> }
+                <div className="attribute-editor-buttons">
+                    { needsSaving && <ActionButton
+                        icon="bx bx-save"
+                        className="save-attributes-button tn-tool-button"
+                        text={escapeQuotes(t("attribute_editor.save_attributes"))}
+                        onClick={save}
+                    /> }
 
-                <ActionButton 
-                    icon="bx bx-plus"
-                    className="add-new-attribute-button"
-                    text={escapeQuotes(t("attribute_editor.add_a_new_attribute"))}
-                    onClick={(e) => {
-                        // Prevent automatic hiding of the context menu due to the button being clicked.
-                        e.stopPropagation();
+                    <ActionButton 
+                        icon="bx bx-plus"
+                        className="add-new-attribute-button tn-tool-button"
+                        text={escapeQuotes(t("attribute_editor.add_a_new_attribute"))}
+                        onClick={(e) => {
+                            // Prevent automatic hiding of the context menu due to the button being clicked.
+                            e.stopPropagation();
 
-                        contextMenu.show<AttributeCommandNames>({
-                            x: e.pageX,
-                            y: e.pageY,
-                            orientation: "left",
-                            items: [
-                                { title: t("attribute_editor.add_new_label"), command: "addNewLabel", uiIcon: "bx bx-hash" },
-                                { title: t("attribute_editor.add_new_relation"), command: "addNewRelation", uiIcon: "bx bx-transfer" },
-                                { title: "----" },
-                                { title: t("attribute_editor.add_new_label_definition"), command: "addNewLabelDefinition", uiIcon: "bx bx-empty" },
-                                { title: t("attribute_editor.add_new_relation_definition"), command: "addNewRelationDefinition", uiIcon: "bx bx-empty" }
-                            ],
-                            selectMenuItemHandler: (item) => handleAddNewAttributeCommand(item.command)
-                        });
-                    }}
-                />
+                            contextMenu.show<AttributeCommandNames>({
+                                x: e.pageX,
+                                y: e.pageY,
+                                orientation: "left",
+                                items: [
+                                    { title: t("attribute_editor.add_new_label"), command: "addNewLabel", uiIcon: "bx bx-hash" },
+                                    { title: t("attribute_editor.add_new_relation"), command: "addNewRelation", uiIcon: "bx bx-transfer" },
+                                    { title: "----" },
+                                    { title: t("attribute_editor.add_new_label_definition"), command: "addNewLabelDefinition", uiIcon: "bx bx-empty" },
+                                    { title: t("attribute_editor.add_new_relation_definition"), command: "addNewRelationDefinition", uiIcon: "bx bx-empty" }
+                                ],
+                                selectMenuItemHandler: (item) => handleAddNewAttributeCommand(item.command)
+                            });
+                        }}
+                    />
+                </div>
 
                 { error && (
                     <div className="attribute-errors">
diff --git a/apps/client/src/widgets/ribbon/style.css b/apps/client/src/widgets/ribbon/style.css
index 3c6df6ba8..02438d4e3 100644
--- a/apps/client/src/widgets/ribbon/style.css
+++ b/apps/client/src/widgets/ribbon/style.css
@@ -271,7 +271,7 @@
     border: 0 !important;
     outline: 0 !important;
     box-shadow: none !important;
-    padding: 0 0 0 5px !important;
+    padding: 0 100px 0 5px !important;
     margin: 0 !important;
     max-height: 100px;
     overflow: auto;
@@ -283,36 +283,19 @@
     background: transparent !important;
 }
 
-.save-attributes-button {
-    color: var(--muted-text-color);
+.attribute-editor-buttons {
+    display: flex;
     position: absolute;
-    bottom: 14px;
-    right: 25px;
-    cursor: pointer;
-    border: 1px solid transparent;
-    font-size: 130%;
-}
-
-.add-new-attribute-button {
-    color: var(--muted-text-color);
-    position: absolute;
-    bottom: 13px;
+    top: 0;
     right: 0;
-    cursor: pointer;
-    border: 1px solid transparent;
-    font-size: 130%;
-}
-
-.add-new-attribute-button:hover, .save-attributes-button:hover {
-    border: 1px solid var(--button-border-color);
-    border-radius: var(--button-border-radius);
-    background: var(--button-background-color);
-    color: var(--button-text-color);
+    bottom: 0;
+    align-items: center;
+    gap: 10px;
 }
 
 .attribute-errors {
     color: red;
-    padding: 5px 50px 0px 5px; /* large right padding to avoid buttons */
+    padding: 5px 100px 0px 5px; /* large right padding to avoid buttons */
 }
 /* #endregion */
 

From 4857fecc41513c9bde3ddde21796c71985759803 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 26 Aug 2025 02:05:40 +0300
Subject: [PATCH 04/13] style/launcher/calendar: fix the width for the
 horizontal layout

---
 apps/client/src/stylesheets/theme-next/shell.css | 1 -
 1 file changed, 1 deletion(-)

diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css
index 8c460846f..65763260a 100644
--- a/apps/client/src/stylesheets/theme-next/shell.css
+++ b/apps/client/src/stylesheets/theme-next/shell.css
@@ -330,7 +330,6 @@ body.layout-horizontal > .horizontal {
  */
 
  .calendar-dropdown-widget {
-    width: unset !important;
     padding: 12px;
     color: var(--calendar-color);
     user-select: none;

From b0beb74011c6daf3a774ca894cd9a8a72ec289af Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 26 Aug 2025 02:27:17 +0300
Subject: [PATCH 05/13] style/dropdown buttons: tweak

---
 apps/client/src/widgets/ribbon/SearchDefinitionTab.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/client/src/widgets/ribbon/SearchDefinitionTab.tsx b/apps/client/src/widgets/ribbon/SearchDefinitionTab.tsx
index 4681151fd..36fef6b3d 100644
--- a/apps/client/src/widgets/ribbon/SearchDefinitionTab.tsx
+++ b/apps/client/src/widgets/ribbon/SearchDefinitionTab.tsx
@@ -186,7 +186,7 @@ function BulkActionsList({ note }: { note: FNote }) {
 function AddBulkActionButton({ note }: { note: FNote }) {
   return (
     <Dropdown
-      buttonClassName="action-add-toggle btn-sm"
+      buttonClassName="action-add-toggle btn btn-sm"
       text={<><Icon icon="bx bxs-zap" />{" "}{t("search_definition.action")}</>}
       noSelectButtonStyle
     >

From 0e6ad42923326ac4dac9fad84931b6793d3f74a9 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 26 Aug 2025 02:34:39 +0300
Subject: [PATCH 06/13] style: fix button class

---
 apps/client/src/widgets/find.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/client/src/widgets/find.ts b/apps/client/src/widgets/find.ts
index cb49bf487..e2f52d58a 100644
--- a/apps/client/src/widgets/find.ts
+++ b/apps/client/src/widgets/find.ts
@@ -87,7 +87,7 @@ const TPL = /*html*/`
 
         <div class="find-widget-spacer"></div>
 
-        <div class="find-widget-close-button"><button class="btn icon-action bx bx-x"></button></div>
+        <div class="find-widget-close-button"><button class="icon-action bx bx-x"></button></div>
     </div>
 
     <div class="replace-widget-box" style='display: none'>

From a54177fee089743106a1c2a2d1e14d35c0d3634e Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 26 Aug 2025 02:43:18 +0300
Subject: [PATCH 07/13] style(legacy)/checkboxes and radios: add a gap between
 the tickbox and the label

---
 apps/client/src/stylesheets/style.css            | 5 +++++
 apps/client/src/stylesheets/theme-next/forms.css | 1 +
 2 files changed, 6 insertions(+)

diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css
index ae6e2109a..44057bbc6 100644
--- a/apps/client/src/stylesheets/style.css
+++ b/apps/client/src/stylesheets/style.css
@@ -176,6 +176,11 @@ label.tn-checkbox + label.tn-checkbox {
     margin-left: 12px;
 }
 
+label.tn-radio input[type="radio"],
+label.tn-checkbox input[type="checkbox"] {
+    margin-right: .5em;
+}
+
 #left-pane input,
 #left-pane select,
 #left-pane textarea {
diff --git a/apps/client/src/stylesheets/theme-next/forms.css b/apps/client/src/stylesheets/theme-next/forms.css
index b09d6cb65..f4465f905 100644
--- a/apps/client/src/stylesheets/theme-next/forms.css
+++ b/apps/client/src/stylesheets/theme-next/forms.css
@@ -455,6 +455,7 @@ optgroup {
         left: 0;
         width: var(--box-size);
         height: 100%;
+        margin: unset;
         opacity: 0 !important;
     }
 

From 93f80c6837efdfd2f7a2ea851e1456d7b51d37df Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 26 Aug 2025 22:27:31 +0300
Subject: [PATCH 08/13] client/quick search: extract inline styles

---
 apps/client/src/widgets/quick_search.ts | 54 +++++++++++++++++++++----
 1 file changed, 47 insertions(+), 7 deletions(-)

diff --git a/apps/client/src/widgets/quick_search.ts b/apps/client/src/widgets/quick_search.ts
index 2449d4bc5..7f227eaa7 100644
--- a/apps/client/src/widgets/quick_search.ts
+++ b/apps/client/src/widgets/quick_search.ts
@@ -62,13 +62,52 @@ const TPL = /*html*/`
         display: none;
     }
     
-    .quick-search .dropdown-item:hover {
+    .quick-search-item.dropdown-item:hover {
         background-color: #f8f9fa;
     }
     
+     .quick-search .quick-search-item {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .quick-search .quick-search-item-header {
+        display: flex;
+        align-items: flex-start;
+        gap: 6px;
+    }
+
+    .quick-search .quick-search-item-icon {
+        flex-shrink: 0;
+        margin-top: 1px;
+    }
+
+    .quick-search search-result-title {
+        flex: 1;
+    }
+
+    .quick-search .search-result-attributes {
+        font-size: 0.75em;
+        color: var(--muted-text-color);
+        opacity: 0.5;
+        margin-left: 20px;
+        margin-top: 2px;
+        line-height: 1.2;"
+    }
+
+    .quick-search .search-result-content {
+        font-size: 0.85em;
+        color: var(--main-text-color);
+        opacity: 0.7;
+        margin-left: 20px;
+        margin-top: 4px;
+        line-height: 1.3;
+    }
+
     .quick-search .dropdown-divider {
         margin: 0;
     }
+
   </style>
 
   <div class="input-group-prepend">
@@ -83,6 +122,7 @@ const TPL = /*html*/`
 const INITIAL_DISPLAYED_NOTES = 15;
 const LOAD_MORE_BATCH_SIZE = 10;
 
+
 // TODO: Deduplicate with server.
 interface QuickSearchResponse {
     searchResultNoteIds: string[];
@@ -237,20 +277,20 @@ export default class QuickSearchWidget extends BasicWidget {
                 const $item = $('<a class="dropdown-item" tabindex="0" href="javascript:">');
                 
                 // Build the display HTML with content snippet below the title
-                let itemHtml = `<div style="display: flex; flex-direction: column;">
-                    <div style="display: flex; align-items: flex-start; gap: 6px;">
-                        <span class="${result.icon}" style="flex-shrink: 0; margin-top: 1px;"></span>
-                        <span style="flex: 1;" class="search-result-title">${result.highlightedNotePathTitle}</span>
+                let itemHtml = `<div class="quick-search-item">
+                    <div class="quick-search-item-header">
+                        <span class="quick-search-item-icon ${result.icon}"></span>
+                        <span class="search-result-title">${result.highlightedNotePathTitle}</span>
                     </div>`;
                 
                 // Add attribute snippet (tags/attributes) below the title if available
                 if (result.highlightedAttributeSnippet) {
-                    itemHtml += `<div style="font-size: 0.75em; color: var(--muted-text-color); opacity: 0.5; margin-left: 20px; margin-top: 2px; line-height: 1.2;" class="search-result-attributes">${result.highlightedAttributeSnippet}</div>`;
+                    itemHtml += `<div class="search-result-attributes">${result.highlightedAttributeSnippet}</div>`;
                 }
                 
                 // Add content snippet below the attributes if available
                 if (result.highlightedContentSnippet) {
-                    itemHtml += `<div style="font-size: 0.85em; color: var(--main-text-color); opacity: 0.7; margin-left: 20px; margin-top: 4px; line-height: 1.3;" class="search-result-content">${result.highlightedContentSnippet}</div>`;
+                    itemHtml += `<div class="search-result-content">${result.highlightedContentSnippet}</div>`;
                 }
                 
                 itemHtml += `</div>`;

From f034e8bb37dd8d1edd6eb0bae5bc59c5c06b34ab Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Wed, 27 Aug 2025 02:21:34 +0300
Subject: [PATCH 09/13] style/quick search results: tweak layout

---
 apps/client/src/stylesheets/style.css   |  2 +-
 apps/client/src/widgets/quick_search.ts | 49 +++++++++++--------------
 2 files changed, 23 insertions(+), 28 deletions(-)

diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css
index 44057bbc6..5b679cf53 100644
--- a/apps/client/src/stylesheets/style.css
+++ b/apps/client/src/stylesheets/style.css
@@ -2353,8 +2353,8 @@ footer.webview-footer button {
 .search-result-title b,
 .search-result-content b,
 .search-result-attributes b {
-    font-weight: 900;
     color: var(--admonition-warning-accent-color);
+    text-decoration: underline;
 }
 
 /* Customized icons */
diff --git a/apps/client/src/widgets/quick_search.ts b/apps/client/src/widgets/quick_search.ts
index 7f227eaa7..820c7fbe6 100644
--- a/apps/client/src/widgets/quick_search.ts
+++ b/apps/client/src/widgets/quick_search.ts
@@ -40,14 +40,11 @@ const TPL = /*html*/`
     .quick-search .dropdown-item:not(:last-child)::after {
         content: '';
         position: absolute;
+        left: 0;
         bottom: 0;
-        left: 50%;
-        transform: translateX(-50%);
-        width: 80%;
-        height: 2px;
-        background: var(--main-border-color);
-        border-radius: 1px;
-        opacity: 0.4;
+        width: 100%;
+        height: 1px;
+        background: var(--dropdown-border-color);
     }
     
     .quick-search .dropdown-item:last-child::after {
@@ -67,41 +64,37 @@ const TPL = /*html*/`
     }
     
      .quick-search .quick-search-item {
-        display: flex;
-        flex-direction: column;
+        width: 100%;
     }
 
     .quick-search .quick-search-item-header {
-        display: flex;
-        align-items: flex-start;
-        gap: 6px;
+        padding: 0 8px;
     }
 
     .quick-search .quick-search-item-icon {
-        flex-shrink: 0;
-        margin-top: 1px;
+        margin-inline-end: 2px;
     }
 
-    .quick-search search-result-title {
-        flex: 1;
+    .quick-search .search-result-title {
+        font-weight: 500;
     }
 
     .quick-search .search-result-attributes {
-        font-size: 0.75em;
-        color: var(--muted-text-color);
-        opacity: 0.5;
-        margin-left: 20px;
-        margin-top: 2px;
-        line-height: 1.2;"
+        opacity: .5;
+        padding: 0 8px;
+        font-size: .75em;
+    }
+
+    .quick-search .search-result-attributes br {
+        display: none;
     }
 
     .quick-search .search-result-content {
-        font-size: 0.85em;
+        margin-top: 8px;
+        padding: 8px;
+        background-color: var(--accented-background-color);
         color: var(--main-text-color);
-        opacity: 0.7;
-        margin-left: 20px;
-        margin-top: 4px;
-        line-height: 1.3;
+        font-size: .85em;
     }
 
     .quick-search .dropdown-divider {
@@ -293,6 +286,8 @@ export default class QuickSearchWidget extends BasicWidget {
                     itemHtml += `<div class="search-result-content">${result.highlightedContentSnippet}</div>`;
                 }
                 
+                console.log(result);
+
                 itemHtml += `</div>`;
                 
                 $item.html(itemHtml);

From 934c9d3df835631d8152b101cd4572acfb23bd85 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Wed, 27 Aug 2025 02:38:51 +0300
Subject: [PATCH 10/13] style/quick search results: improve appearance

---
 apps/client/src/stylesheets/theme-next-dark.css  |  1 +
 apps/client/src/stylesheets/theme-next-light.css |  1 +
 apps/client/src/stylesheets/theme-next/shell.css | 13 +++++++++++++
 apps/client/src/widgets/quick_search.ts          |  5 +++--
 4 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css
index b32e29f2b..7053c2655 100644
--- a/apps/client/src/stylesheets/theme-next-dark.css
+++ b/apps/client/src/stylesheets/theme-next-dark.css
@@ -121,6 +121,7 @@
     --quick-search-focus-border: #80808095;
     --quick-search-focus-background: #ffffff1f;
     --quick-search-focus-color: white;
+    --quick-search-result-content-background: #0000004d;
 
     --left-pane-collapsed-border-color: #0009;
     --left-pane-background-color: #1f1f1f;
diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css
index deb9fb2ec..a08d683f8 100644
--- a/apps/client/src/stylesheets/theme-next-light.css
+++ b/apps/client/src/stylesheets/theme-next-light.css
@@ -115,6 +115,7 @@
     --quick-search-focus-border: #00000029;
     --quick-search-focus-background: #ffffff80;
     --quick-search-focus-color: #000;
+    --quick-search-result-content-background: #00000017;
 
     --left-pane-collapsed-border-color: #0000000d;
     --left-pane-background-color: #f2f2f2;
diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css
index 65763260a..7f8c692f6 100644
--- a/apps/client/src/stylesheets/theme-next/shell.css
+++ b/apps/client/src/stylesheets/theme-next/shell.css
@@ -604,6 +604,19 @@ div.quick-search .search-button.show {
     overflow: hidden;
 }
 
+.quick-search .quick-search-item-icon {
+    vertical-align: text-bottom;
+}
+
+:root .quick-search .search-result-content {
+    background-color: var(--quick-search-result-content-background);
+    border-radius: 4px;
+}
+
+.quick-search .dropdown-item::after {
+    display: none;
+}
+
 /*
  * TREE PANE
  */
diff --git a/apps/client/src/widgets/quick_search.ts b/apps/client/src/widgets/quick_search.ts
index 820c7fbe6..ea2df5f46 100644
--- a/apps/client/src/widgets/quick_search.ts
+++ b/apps/client/src/widgets/quick_search.ts
@@ -22,8 +22,9 @@ const TPL = /*html*/`
     }
 
     .quick-search .dropdown-menu {
-        max-height: 600px;
-        max-width: 600px;
+        max-height: 80vh;
+        min-width: 400px;
+        max-width: 720px;
         overflow-y: auto;
         overflow-x: hidden;
         text-overflow: ellipsis;

From 620b57bfa6eb08a487dd881d455efdab8c220583 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Wed, 27 Aug 2025 02:49:48 +0300
Subject: [PATCH 11/13] style/quick search results: refactor

---
 apps/client/src/stylesheets/style.css            |  8 --------
 apps/client/src/stylesheets/theme-next/shell.css | 10 ++++++----
 apps/client/src/widgets/quick_search.ts          |  8 ++++++++
 3 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css
index 5b679cf53..a8a130341 100644
--- a/apps/client/src/stylesheets/style.css
+++ b/apps/client/src/stylesheets/style.css
@@ -2349,14 +2349,6 @@ footer.webview-footer button {
     padding: 1px 10px 1px 10px;
 }
 
-/* Search result highlighting */
-.search-result-title b,
-.search-result-content b,
-.search-result-attributes b {
-    color: var(--admonition-warning-accent-color);
-    text-decoration: underline;
-}
-
 /* Customized icons */
 
 .bx-tn-toc::before {
diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css
index 7f8c692f6..ff3fd5e9e 100644
--- a/apps/client/src/stylesheets/theme-next/shell.css
+++ b/apps/client/src/stylesheets/theme-next/shell.css
@@ -586,6 +586,10 @@ div.quick-search .search-button.show {
     top: 1px;
 }
 
+.quick-search .quick-search-item-icon {
+    vertical-align: text-bottom;
+}
+
 /* Note title */
 .quick-search .dropdown-menu .dropdown-item > a {
     color: var(--menu-text-color);
@@ -604,15 +608,13 @@ div.quick-search .search-button.show {
     overflow: hidden;
 }
 
-.quick-search .quick-search-item-icon {
-    vertical-align: text-bottom;
-}
-
+/* Note content snippet */
 :root .quick-search .search-result-content {
     background-color: var(--quick-search-result-content-background);
     border-radius: 4px;
 }
 
+/* Divider line */
 .quick-search .dropdown-item::after {
     display: none;
 }
diff --git a/apps/client/src/widgets/quick_search.ts b/apps/client/src/widgets/quick_search.ts
index ea2df5f46..74124aff4 100644
--- a/apps/client/src/widgets/quick_search.ts
+++ b/apps/client/src/widgets/quick_search.ts
@@ -98,6 +98,14 @@ const TPL = /*html*/`
         font-size: .85em;
     }
 
+    /* Search result highlighting */
+    .quick-search .search-result-title b,
+    .quick-search .search-result-content b,
+    .quick-search .search-result-attributes b {
+        color: var(--admonition-warning-accent-color);
+        text-decoration: underline;
+    }
+
     .quick-search .dropdown-divider {
         margin: 0;
     }

From e2cd357319d19cede24130781a24cafcd8bcc04e Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Wed, 27 Aug 2025 03:01:40 +0300
Subject: [PATCH 12/13] style/quick search results: customize the highlight
 color

---
 apps/client/src/stylesheets/theme-next-dark.css  | 1 +
 apps/client/src/stylesheets/theme-next-light.css | 1 +
 apps/client/src/stylesheets/theme-next/shell.css | 8 ++++++++
 3 files changed, 10 insertions(+)

diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css
index 7053c2655..69753b0db 100644
--- a/apps/client/src/stylesheets/theme-next-dark.css
+++ b/apps/client/src/stylesheets/theme-next-dark.css
@@ -122,6 +122,7 @@
     --quick-search-focus-background: #ffffff1f;
     --quick-search-focus-color: white;
     --quick-search-result-content-background: #0000004d;
+    --quick-search-result-highlight-color: #a4d995;
 
     --left-pane-collapsed-border-color: #0009;
     --left-pane-background-color: #1f1f1f;
diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css
index a08d683f8..cf6e7c6eb 100644
--- a/apps/client/src/stylesheets/theme-next-light.css
+++ b/apps/client/src/stylesheets/theme-next-light.css
@@ -116,6 +116,7 @@
     --quick-search-focus-background: #ffffff80;
     --quick-search-focus-color: #000;
     --quick-search-result-content-background: #00000017;
+    --quick-search-result-highlight-color: #c65050;
 
     --left-pane-collapsed-border-color: #0000000d;
     --left-pane-background-color: #f2f2f2;
diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css
index ff3fd5e9e..cd3ed44ee 100644
--- a/apps/client/src/stylesheets/theme-next/shell.css
+++ b/apps/client/src/stylesheets/theme-next/shell.css
@@ -614,6 +614,14 @@ div.quick-search .search-button.show {
     border-radius: 4px;
 }
 
+/* Highlighted search terms */
+:root .quick-search .search-result-title b,
+:root .quick-search .search-result-content b,
+:root .quick-search .search-result-attributes b {
+    color: var(--quick-search-result-highlight-color);
+    font-weight: 600;
+}
+
 /* Divider line */
 .quick-search .dropdown-item::after {
     display: none;

From 4d07a1aab6c9ac3fc5b3af377f09017fd793889a Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Wed, 27 Aug 2025 03:19:07 +0300
Subject: [PATCH 13/13] client/quick search results: add a whitespace between
 attributes

---
 apps/client/src/widgets/quick_search.ts | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/apps/client/src/widgets/quick_search.ts b/apps/client/src/widgets/quick_search.ts
index 74124aff4..95728b99e 100644
--- a/apps/client/src/widgets/quick_search.ts
+++ b/apps/client/src/widgets/quick_search.ts
@@ -86,10 +86,6 @@ const TPL = /*html*/`
         font-size: .75em;
     }
 
-    .quick-search .search-result-attributes br {
-        display: none;
-    }
-
     .quick-search .search-result-content {
         margin-top: 8px;
         padding: 8px;
@@ -287,7 +283,9 @@ export default class QuickSearchWidget extends BasicWidget {
                 
                 // Add attribute snippet (tags/attributes) below the title if available
                 if (result.highlightedAttributeSnippet) {
-                    itemHtml += `<div class="search-result-attributes">${result.highlightedAttributeSnippet}</div>`;
+                    // Replace <br> with a blank space to join the atributes on the same single line
+                    const snippet = (result.highlightedAttributeSnippet as string).replace(/<br\s?\/?>/g, " ");
+                    itemHtml += `<div class="search-result-attributes">${snippet}</div>`;
                 }
                 
                 // Add content snippet below the attributes if available
@@ -295,8 +293,6 @@ export default class QuickSearchWidget extends BasicWidget {
                     itemHtml += `<div class="search-result-content">${result.highlightedContentSnippet}</div>`;
                 }
                 
-                console.log(result);
-
                 itemHtml += `</div>`;
                 
                 $item.html(itemHtml);