grid items in note list are clickable as a whole

This commit is contained in:
zadam 2021-03-30 23:26:14 +02:00
parent f1f4f45c9d
commit 9cd45299b1
2 changed files with 20 additions and 2 deletions

View File

@ -72,7 +72,7 @@ function goToLink(e) {
e.preventDefault();
e.stopPropagation();
const $link = $(e.target).closest("a");
const $link = $(e.target).closest("a,.block-link");
const notePath = getNotePathFromLink($link);

View File

@ -20,6 +20,7 @@ const TPL = `
.note-list.grid-view .note-book-card {
flex-basis: 300px;
border: 1px solid transparent;
}
.note-list.grid-view .note-expander {
@ -30,6 +31,12 @@ const TPL = `
max-height: 300px;
}
.note-list.grid-view .note-book-card:hover {
cursor: pointer;
border: 1px solid var(--main-border-color);
background: var(--more-accented-background-color);
}
.note-book-card {
border-radius: 10px;
background-color: var(--accented-background-color);
@ -310,6 +317,7 @@ class NoteListRenderer {
const $expander = $('<span class="note-expander bx bx-chevron-right"></span>');
const {$renderedAttributes} = await attributeRenderer.renderNormalAttributes(note);
const notePath = this.parentNote.noteId + '/' + note.noteId;
const $card = $('<div class="note-book-card">')
.attr('data-note-id', note.noteId)
@ -317,10 +325,20 @@ class NoteListRenderer {
$('<h5 class="note-book-title">')
.append($expander)
.append($('<span class="note-icon">').addClass(note.getIcon()))
.append(await linkService.createNoteLink(note.noteId, {showTooltip: false, showNotePath: this.showNotePath}))
.append(this.viewType === 'grid'
? note.title
: await linkService.createNoteLink(notePath, {showTooltip: false, showNotePath: this.showNotePath})
)
.append($renderedAttributes)
);
if (this.viewType === 'grid') {
$card
.addClass("block-link")
.attr("data-note-path", notePath)
.on('click', e => linkService.goToLink(e));
}
$expander.on('click', () => this.toggleContent($card, note, !$card.hasClass("expanded")));
await this.toggleContent($card, note, expand);