fix(client): autocomplete looking off in new tab

This commit is contained in:
Elian Doran 2025-08-26 19:15:36 +03:00
parent cf059e7f86
commit 72e2f6757e
No known key found for this signature in database
3 changed files with 36 additions and 40 deletions

View file

@ -327,7 +327,7 @@ function initNoteAutocomplete($el: JQuery<HTMLElement>, 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<HTMLElement>, options?: Options) {
} else if (suggestion.action === "external-link") {
iconClass = "bx bx-link-external";
}
// Simplified HTML structure without nested divs
let html = `<div class="note-suggestion ${actionClass}">`;
html += `<span class="${iconClass}" style="display: inline-block; width: 16px; vertical-align: top;"></span>`;
html += `<span style="display: inline-block; width: calc(100% - 20px); padding-left: 4px;">`;
html += `<span class="search-result-title" style="display: block;">${suggestion.highlightedNotePathTitle}</span>`;
html += `<span class="icon ${iconClass}"></span>`;
html += `<span class="text">`;
html += `<span class="search-result-title">${suggestion.highlightedNotePathTitle}</span>`;
// Add attribute snippet inline if available
if (suggestion.highlightedAttributeSnippet) {
html += `<span style="display: block; font-size: 0.8em; color: var(--muted-text-color); opacity: 0.6; line-height: 1;" class="search-result-attributes">${suggestion.highlightedAttributeSnippet}</span>`;
html += `<span class="search-result-attributes">${suggestion.highlightedAttributeSnippet}</span>`;
}
html += `</span>`;
html += `</div>`;
return html;

View file

@ -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);

View file

@ -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;
}