From c1df311e8627193e56b6506e0c5b14c6bcc7ab13 Mon Sep 17 00:00:00 2001
From: sota1235 <sota1235@gmail.com>
Date: Thu, 29 Dec 2016 19:08:29 +0900
Subject: [PATCH] modify: add icon for NoteItemSimple component

---
 browser/main/NoteList/NoteItemSimple.js   |  5 +++++
 browser/main/NoteList/NoteItemSimple.styl | 12 ++++++++++++
 2 files changed, 17 insertions(+)

diff --git a/browser/main/NoteList/NoteItemSimple.js b/browser/main/NoteList/NoteItemSimple.js
index 2696ccd4..503e4171 100644
--- a/browser/main/NoteList/NoteItemSimple.js
+++ b/browser/main/NoteList/NoteItemSimple.js
@@ -22,6 +22,10 @@ const NoteItemSimple = ({ isActive, note, handleNoteClick, handleNoteContextMenu
     onContextMenu={e => handleNoteContextMenu(e, `${note.storage}-${note.key}`)}
   >
     <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
         : <span styleName='item-simple-title-empty'>Empty</span>
@@ -35,6 +39,7 @@ NoteItemSimple.propTypes = {
   note: PropTypes.shape({
     storage: PropTypes.string.isRequired,
     key: PropTypes.string.isRequired,
+    type: PropTypes.string.isRequired,
     title: PropTypes.string.isrequired,
   }),
   handleNoteClick: PropTypes.func.isRequired,
diff --git a/browser/main/NoteList/NoteItemSimple.styl b/browser/main/NoteList/NoteItemSimple.styl
index f6bae95e..ead8890d 100644
--- a/browser/main/NoteList/NoteItemSimple.styl
+++ b/browser/main/NoteList/NoteItemSimple.styl
@@ -17,11 +17,15 @@ $control-height = 30px
   &:active
     background-color $ui-active-color
     color white
+    .item-simple-title-icon
+      color white
 
 .item-simple--active
   @extend .item-simple
   background-color $ui-active-color
   color white
+  .item-simple-title-icon
+    color white
   &:hover
     background-color $ui-active-color
 
@@ -35,6 +39,11 @@ $control-height = 30px
   color $ui-text-color
   border-bottom $ui-border
 
+.item-simple-title-icon
+  font-size 12px
+  color $ui-inactive-text-color
+  padding-right 6px
+
 .item-simple-title-empty
   font-weight normal
   color $ui-inactive-text-color
@@ -65,5 +74,8 @@ body[data-theme="dark"]
     color $ui-dark-text-color
     border-color $ui-dark-borderColor
 
+  .item-simple-title-icon
+    color $ui-darkinactive-text-color
+
   .item-simple-title-empty
     color $ui-dark-inactive-text-color