diff --git a/apps/client/src/services/note_autocomplete.ts b/apps/client/src/services/note_autocomplete.ts index 66031f482..9ca4fa86f 100644 --- a/apps/client/src/services/note_autocomplete.ts +++ b/apps/client/src/services/note_autocomplete.ts @@ -327,7 +327,7 @@ function initNoteAutocomplete($el: JQuery, options?: Options) { } // Add special class for search-notes action const actionClass = suggestion.action === "search-notes" ? "search-notes-action" : ""; - + // Choose appropriate icon based on action let iconClass = suggestion.icon ?? "bx bx-note"; if (suggestion.action === "search-notes") { @@ -337,18 +337,18 @@ function initNoteAutocomplete($el: JQuery, options?: Options) { } else if (suggestion.action === "external-link") { iconClass = "bx bx-link-external"; } - + // Simplified HTML structure without nested divs let html = `
`; - html += ``; - html += ``; - html += `${suggestion.highlightedNotePathTitle}`; - + html += ``; + html += ``; + html += `${suggestion.highlightedNotePathTitle}`; + // Add attribute snippet inline if available if (suggestion.highlightedAttributeSnippet) { - html += `${suggestion.highlightedAttributeSnippet}`; + html += `${suggestion.highlightedAttributeSnippet}`; } - + html += ``; html += `
`; return html; diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css index 290240b84..ae6e2109a 100644 --- a/apps/client/src/stylesheets/style.css +++ b/apps/client/src/stylesheets/style.css @@ -862,10 +862,34 @@ table.promoted-attributes-in-tooltip th { .aa-dropdown-menu .aa-suggestion { cursor: pointer; - padding: 5px; + padding: 6px 16px; margin: 0; } +.aa-dropdown-menu .aa-suggestion .icon { + display: inline-block; + line-height: inherit; + vertical-align: top; +} + +.aa-dropdown-menu .aa-suggestion .text { + display: inline-block; + width: calc(100% - 20px); + padding-left: 4px; +} + +.aa-dropdown-menu .aa-suggestion .search-result-title { + display: block; +} + +.aa-dropdown-menu .aa-suggestion .search-result-attributes { + display: block; + font-size: 0.8em; + color: var(--muted-text-color); + opacity: 0.6; + line-height: 1; +} + .aa-dropdown-menu .aa-suggestion p { padding: 0; margin: 0; @@ -1828,33 +1852,6 @@ textarea { width: 100%; } -.jump-to-note-results .aa-dropdown-menu .aa-suggestion { - white-space: normal; - padding: 2px 12px !important; - line-height: 1.1; - position: relative; - border-radius: 0; - margin: 0 !important; -} - -.jump-to-note-results .note-suggestion { - margin: 0; - padding: 0; - line-height: 1; -} - -.jump-to-note-results .aa-suggestion:not(:last-child)::after { - display: none; /* Remove dividers for more compact look */ -} - -.jump-to-note-results .aa-suggestion:last-child::after { - display: none; -} - -.jump-to-note-results .aa-suggestion.disabled::after { - display: none; -} - .jump-to-note-results .aa-dropdown-menu .aa-suggestion:hover, .jump-to-note-results .aa-dropdown-menu .aa-cursor { background-color: var(--hover-item-background-color, #f8f9fa); diff --git a/apps/client/src/stylesheets/theme-next/base.css b/apps/client/src/stylesheets/theme-next/base.css index 6ab16a456..bee48c023 100644 --- a/apps/client/src/stylesheets/theme-next/base.css +++ b/apps/client/src/stylesheets/theme-next/base.css @@ -536,10 +536,9 @@ body.mobile .dropdown-menu .dropdown-item.submenu-open .dropdown-toggle::after { } /* List item */ -.jump-to-note-dialog .aa-suggestions div, -.note-detail-empty .aa-suggestions div { - border-radius: 0; - padding: 12px 16px; +.jump-to-note-dialog .aa-suggestion, +.note-detail-empty .aa-suggestion { + border-radius: 6px; color: var(--menu-text-color); cursor: default; }