mirror of
https://github.com/zadam/trilium.git
synced 2026-02-20 12:44:25 +01:00
ui/grid view: add support for search view
This commit is contained in:
parent
419e87b0de
commit
f200ac898a
@ -366,7 +366,8 @@ body .todo-list input[type="checkbox"]:not(:checked):before {
|
||||
|
||||
.note-split.with-hue,
|
||||
.quick-edit-dialog-wrapper.with-hue,
|
||||
.nested-note-list-item.with-hue {
|
||||
.nested-note-list-item.with-hue,
|
||||
.note-book-card.with-hue {
|
||||
--note-icon-custom-background-color: hsl(var(--custom-color-hue), 15.8%, 30.9%);
|
||||
--note-icon-custom-color: hsl(var(--custom-color-hue), 100%, 76.5%);
|
||||
--note-icon-hover-custom-background-color: hsl(var(--custom-color-hue), 28.3%, 36.7%);
|
||||
|
||||
@ -336,7 +336,8 @@
|
||||
|
||||
.note-split.with-hue,
|
||||
.quick-edit-dialog-wrapper.with-hue,
|
||||
.nested-note-list-item.with-hue {
|
||||
.nested-note-list-item.with-hue,
|
||||
.note-book-card.with-hue {
|
||||
--note-icon-custom-background-color: hsl(var(--custom-color-hue), 44.5%, 43.1%);
|
||||
--note-icon-custom-color: hsl(var(--custom-color-hue), 91.3%, 91%);
|
||||
--note-icon-hover-custom-background-color: hsl(var(--custom-color-hue), 55.1%, 50.2%);
|
||||
|
||||
@ -57,13 +57,6 @@
|
||||
content: "\00a0\00a0";
|
||||
}
|
||||
|
||||
.note-book-header .note-icon {
|
||||
font-size: 100%;
|
||||
display: inline-block;
|
||||
padding-inline-end: 7px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.note-book-card .note-book-card {
|
||||
border: 1px solid var(--main-border-color);
|
||||
}
|
||||
@ -134,6 +127,59 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* Search result view */
|
||||
.nested-note-list.search-results .nested-note-list-item,
|
||||
.note-list-container.search-results .note-book-card .note-book-header {
|
||||
span.tn-icon + span > span {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
small {
|
||||
line-height: .85em;
|
||||
}
|
||||
|
||||
.note-path {
|
||||
margin-left: 0;
|
||||
font-size: .85em;
|
||||
line-height: .85em;
|
||||
font-weight: 500;
|
||||
letter-spacing: .5pt;
|
||||
}
|
||||
|
||||
.tn-icon {
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 1.75em;
|
||||
height: 1.75em;
|
||||
margin-inline-end: 12px;
|
||||
border-radius: 50%;
|
||||
background: var(--note-icon-custom-background-color, var(--note-list-view-large-icon-background));
|
||||
font-size: 1.2em;
|
||||
color: var(--note-icon-custom-color, var(--note-list-view-large-icon-color));
|
||||
}
|
||||
|
||||
.ck-find-result {
|
||||
background: var(--note-list-view-search-result-highlight-background);
|
||||
color: var(--note-list-view-search-result-highlight-color);
|
||||
font-weight: 600;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.nested-note-list .note-book-content,
|
||||
.note-list-container .note-book-content {
|
||||
.ck-find-result {
|
||||
outline: 2px solid var(--note-list-view-content-search-result-highlight-background);
|
||||
border-radius: 4px;
|
||||
background: var(--note-list-view-content-search-result-highlight-background);
|
||||
color: var(--note-list-view-content-search-result-highlight-color);
|
||||
}
|
||||
}
|
||||
|
||||
/* #region List view */
|
||||
|
||||
@keyframes note-preview-show {
|
||||
@ -197,47 +243,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* List item (search results view) */
|
||||
.nested-note-list.search-results .nested-note-list-item {
|
||||
span.tn-icon + span > span {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
small {
|
||||
line-height: .85em;
|
||||
}
|
||||
|
||||
.note-path {
|
||||
margin-left: 0;
|
||||
font-size: .85em;
|
||||
line-height: .85em;
|
||||
font-weight: 500;
|
||||
letter-spacing: .5pt;
|
||||
}
|
||||
|
||||
.tn-icon {
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 1.75em;
|
||||
height: 1.75em;
|
||||
margin-inline-end: 12px;
|
||||
border-radius: 50%;
|
||||
background: var(--note-icon-custom-background-color, var(--note-list-view-large-icon-background));
|
||||
font-size: 1.2em;
|
||||
color: var(--note-icon-custom-color, var(--note-list-view-large-icon-color));
|
||||
}
|
||||
|
||||
h5 .ck-find-result {
|
||||
background: var(--note-list-view-search-result-highlight-background);
|
||||
color: var(--note-list-view-search-result-highlight-color);
|
||||
font-weight: 600;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
/* Note content preview */
|
||||
.nested-note-list .note-book-content {
|
||||
@ -291,13 +296,6 @@
|
||||
justify-content: center;
|
||||
min-height: 50vh;
|
||||
}
|
||||
|
||||
.ck-find-result {
|
||||
outline: 2px solid var(--note-list-view-content-search-result-highlight-background);
|
||||
border-radius: 4px;
|
||||
background: var(--note-list-view-content-search-result-highlight-background);
|
||||
color: var(--note-list-view-content-search-result-highlight-color);
|
||||
}
|
||||
}
|
||||
|
||||
.note-content-preview:has(.note-book-content:empty) {
|
||||
|
||||
@ -72,7 +72,7 @@ export function GridView({ note, noteIds: unfilteredNoteIds, highlightedTokens }
|
||||
<div class="note-list-wrapper">
|
||||
{!hasCollectionProperties && <Pager {...pagination} />}
|
||||
|
||||
<div class="note-list-container use-tn-links">
|
||||
<div className={clsx("note-list-container use-tn-links", {"search-results": (noteType === "search")})}>
|
||||
{pageNotes?.map(childNote => (
|
||||
<GridNoteCard note={childNote} parentNote={note} highlightedTokens={highlightedTokens} includeArchived={includeArchived} />
|
||||
))}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user