Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-31 18:36:30 +01:00
Code Issues Packages Projects Releases Activity

feat(command_palette): improve layout

Browse Source
This commit is contained in:
Elian Doran
2025-07-27 18:11:43 +03:00
parent 3517715aab
commit d7f154cfd1
2 changed files with 27 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
apps/client/src/services/note_autocomplete.ts
View File

@@ -320,16 +320,16 @@ function initNoteAutocomplete($el: JQuery<HTMLElement>, options?: Options) {
suggestion: (suggestion) => {
if (suggestion.action === "command") {
let html = `<div class="command-suggestion">`;
html += `<div class="command-header">`;
html += `<span class="command-icon ${suggestion.icon || "bx bx-terminal"}"></span>`;
html += `<span class="command-name">${suggestion.highlightedNotePathTitle}</span>`;
if (suggestion.commandShortcut) {
html += `<kbd class="command-shortcut">${suggestion.commandShortcut}</kbd>`;
}
html += `</div>`;
html += `<div class="command-content">`;
html += `<div class="command-name">${suggestion.highlightedNotePathTitle}</div>`;
if (suggestion.commandDescription) {
html += `<div class="command-description">${suggestion.commandDescription}</div>`;
}
html += `</div>`;
if (suggestion.commandShortcut) {
html += `<kbd class="command-shortcut">${suggestion.commandShortcut}</kbd>`;
}
html += '</div>';
return html;
}

36
apps/client/src/stylesheets/style.css
View File

@@ -1781,6 +1781,13 @@ textarea {
}
/* Command palette styling */
.jump-to-note-dialog .command-suggestion {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.9em;
}
.jump-to-note-dialog .aa-suggestion .command-suggestion,
.jump-to-note-dialog .aa-suggestion .command-suggestion div {
padding: 0;
@@ -1792,22 +1799,28 @@ textarea {
background-color: var(--hover-background-color);
}
.jump-to-note-dialog .command-header {
display: flex;
align-items: center;
gap: 0.5rem;
position: relative;
.jump-to-note-dialog .command-icon {
color: var(--muted-text-color);
font-size: 1.125rem;
flex-shrink: 0;
margin-top: 0.125rem;
}
.jump-to-note-dialog .command-icon {
flex-shrink: 0;
.jump-to-note-dialog .command-content {
flex-grow: 1;
min-width: 0;
}
.jump-to-note-dialog .command-name {
flex: 1;
font-weight: bold;
}
.jump-to-note-dialog .command-description {
font-size: 0.8em;
line-height: 1.3;
opacity: 0.75;
}
.jump-to-note-dialog kbd.command-shortcut {
background-color: transparent;
color: inherit;
@@ -1815,13 +1828,6 @@ textarea {
font-family: inherit !important;
}
.jump-to-note-dialog .command-description {
margin-top: 0.25rem;
font-size: 0.875em;
line-height: 1.3;
opacity: 0.75;
}
.empty-table-placeholder {
text-align: center;
color: var(--muted-text-color);