gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-02-27 00:53:35 +01:00
Code Issues Actions 14 Packages Projects Releases Wiki Activity

ui/grid view card: refactor CSS

Browse Source
This commit is contained in:
Adorian Doran 2026-02-23 09:34:08 +02:00
parent 538e1f0fdd
commit dc8c10e531
1 changed files with 22 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
apps/client/src/widgets/collections/legacy/ListOrGridView.css
View File

@ -7,6 +7,12 @@
height: 100%;
overflow: auto;
}
&.grid-view .note-list-container {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
}
/* #region List view / Grid view common styles */
@ -60,6 +66,7 @@
}
.note-path {
opacity: 0.5;
margin-left: 0;
font-size: .85em;
line-height: .85em;
@ -134,6 +141,10 @@
}
}
.note-content-preview:has(.note-book-content:empty) {
display: none;
}
/* #endregion */
/* #region List view */
@ -159,12 +170,6 @@
color: var(--note-list-view-icon-color);
}
.note-path {
margin-left: 0.5em;
vertical-align: middle;
opacity: 0.5;
}
.note-list-attributes {
flex-grow: 1;
margin-inline-start: 1em;
@ -191,7 +196,6 @@
}
}
/* Note content preview */
.nested-note-list .note-book-content {
outline: 1px solid var(--note-list-view-content-background);
@ -239,10 +243,6 @@
}
}
.note-content-preview:has(.note-book-content:empty) {
display: none;
}
/* #endregion */
/* #region Grid view */
@ -255,10 +255,16 @@
flex-direction: column;
flex-shrink: 0;
flex-grow: 1;
flex-basis: 300px;
max-height: 300px;
padding: 0;
overflow: hidden;
user-select: none;
body.mobile & {
flex-basis: 150px;
}
&:hover {
background-color: var(--card-background-hover-color);
filter: contrast(105%);
@ -307,6 +313,11 @@
padding: 0;
}
img {
max-height: 220px;
object-fit: contain;
}
.file-footer {
display: flex;
gap: 8px;
@ -329,42 +340,6 @@
}
}
.note-list.grid-view .note-list-container {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.note-list.grid-view .note-book-card {
flex-basis: 300px;
border: 1px solid transparent;
}
body.mobile .note-list.grid-view .note-book-card {
flex-basis: 150px;
}
.note-list.grid-view .note-book-card {
max-height: 300px;
}
.note-list.grid-view .note-book-card img {
max-height: 220px;
object-fit: contain;
}
.note-list.grid-view .note-book-card:hover {
cursor: pointer;
border: 1px solid var(--main-border-color);
background: var(--more-accented-background-color);
}
.note-list.grid-view .note-path {
margin-left: 0.5em;
vertical-align: middle;
opacity: 0.5;
}
.note-book-card .note-book-content {
padding: 0;
font-size: 0.8rem;