public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-14 02:06:29 +00:00
Code Issues Releases Wiki Activity

modify: add icon for NoteItemSimple component

Browse Source
This commit is contained in:
sota1235
2016-12-29 19:08:29 +09:00
parent cc3bd41df2
commit c1df311e86
2 changed files with 17 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
browser/main/NoteList/NoteItemSimple.js
View File

@@ -22,6 +22,10 @@ const NoteItemSimple = ({ isActive, note, handleNoteClick, handleNoteContextMenu
onContextMenu={e => handleNoteContextMenu(e, `${note.storage}-${note.key}`)} onContextMenu={e => handleNoteContextMenu(e, `${note.storage}-${note.key}`)}
> >
<div styleName='item-simple-title'> <div styleName='item-simple-title'>
{note.type === 'SNIPPET_NOTE'
? <i styleName='item-simple-title-icon' className='fa fa-fw fa-code' />
: <i styleName='item-simple-title-icon' className='fa fa-fw fa-file-text-o' />
}
{note.title.trim().length > 0 {note.title.trim().length > 0
? note.title ? note.title
: <span styleName='item-simple-title-empty'>Empty</span> : <span styleName='item-simple-title-empty'>Empty</span>
@@ -35,6 +39,7 @@ NoteItemSimple.propTypes = {
note: PropTypes.shape({ note: PropTypes.shape({
storage: PropTypes.string.isRequired, storage: PropTypes.string.isRequired,
key: PropTypes.string.isRequired, key: PropTypes.string.isRequired,
type: PropTypes.string.isRequired,
title: PropTypes.string.isrequired, title: PropTypes.string.isrequired,
}), }),
handleNoteClick: PropTypes.func.isRequired, handleNoteClick: PropTypes.func.isRequired,

12
browser/main/NoteList/NoteItemSimple.styl
View File

@@ -17,11 +17,15 @@ $control-height = 30px
&:active &:active
background-color $ui-active-color background-color $ui-active-color
color white color white
.item-simple-title-icon
color white
.item-simple--active .item-simple--active
@extend .item-simple @extend .item-simple
background-color $ui-active-color background-color $ui-active-color
color white color white
.item-simple-title-icon
color white
&:hover &:hover
background-color $ui-active-color background-color $ui-active-color
@@ -35,6 +39,11 @@ $control-height = 30px
color $ui-text-color color $ui-text-color
border-bottom $ui-border border-bottom $ui-border
.item-simple-title-icon
font-size 12px
color $ui-inactive-text-color
padding-right 6px
.item-simple-title-empty .item-simple-title-empty
font-weight normal font-weight normal
color $ui-inactive-text-color color $ui-inactive-text-color
@@ -65,5 +74,8 @@ body[data-theme="dark"]
color $ui-dark-text-color color $ui-dark-text-color
border-color $ui-dark-borderColor border-color $ui-dark-borderColor
.item-simple-title-icon
color $ui-darkinactive-text-color
.item-simple-title-empty .item-simple-title-empty
color $ui-dark-inactive-text-color color $ui-dark-inactive-text-color