diff --git a/browser/main/NoteList/NoteItem.js b/browser/main/NoteList/NoteItem.js index 0293e34a..df1bded5 100644 --- a/browser/main/NoteList/NoteItem.js +++ b/browser/main/NoteList/NoteItem.js @@ -51,27 +51,29 @@ const NoteItem = ({ isActive, note, dateDisplay, handleNoteClick, handleNoteCont onClick={e => handleNoteClick(e, `${note.storage}-${note.key}`)} onContextMenu={e => handleNoteContextMenu(e, `${note.storage}-${note.key}`)} > -
{dateDisplay}
+
+
{dateDisplay}
-
- {note.title.trim().length > 0 - ? note.title - : Empty - } -
- -
-
- {note.tags.length > 0 - ? TagElementList(note.tags) - : '' +
+ {note.title.trim().length > 0 + ? note.title + : Empty }
-
- {note.isStarred ? - : '' - } +
+
+ {note.tags.length > 0 + ? TagElementList(note.tags) + : '' + } +
+
+ + {note.isStarred ? + : '' + } +
) diff --git a/browser/main/NoteList/NoteItem.styl b/browser/main/NoteList/NoteItem.styl index fdfe18b9..a07670de 100644 --- a/browser/main/NoteList/NoteItem.styl +++ b/browser/main/NoteList/NoteItem.styl @@ -7,7 +7,7 @@ $control-height = 30px .item position relative - padding 20px 25px + padding 0 25px user-select none cursor pointer background-color $ui-noteList-backgroundColor @@ -26,6 +26,10 @@ $control-height = 30px background-color transparent color white +.item-wrapper + padding 20px 0 + border-bottom $ui-border + .item--active @extend .item background-color $ui-active-color @@ -115,6 +119,9 @@ body[data-theme="dark"] &:hover background-color alpha($ui-active-color, 20%) + .item-wrapper + border-color $ui-dark-borderColor + .item--active @extend .item border-color $ui-dark-borderColor