fix style

browser/styles/main/HomeContainer/lib/CreateNewFolder.styl

@@ -34,29 +34,30 @@ iptFocusBorderColor = #369DCD
     border-radius 5px
     border solid 1px borderColor
     outline none
-    margin 100px auto 15px
+    margin 75px auto 20px
     &:focus
       border-color iptFocusBorderColor
   .colorSelect
     text-align center
     .option
       cursor pointer
-      .FolderMark
+      font-size 22px
-        padding 5px
+      height 48px
-        font-size 22px
+      width 48px
-        height 33px
+      margin 0 2px
-        width 33px
+      border 1px solid transparent
-        overflow hidden
+      border-radius 5px
-        line-height 33px
+      overflow hidden
-        transition 0.1s
+      line-height 45px
-        border 1px solid transparent
+      text-align center
-        border-radius 5px
+      transition 0.1s
-        margin 0 2px
+      display inline-block
-        &:hover
+      &:hover
-          border-color borderColor
+        border-color borderColor
-        &.active
+        font-size 28px
-          font-size 28px
+      &.active
-          border-color iptFocusBorderColor
+        font-size 28px
+        border-color iptFocusBorderColor
   .alert
     color infoTextColor
     background-color infoBackgroundColor

lib/components/modal/CreateNewFolder.js

@@ -62,13 +62,12 @@ export default class CreateNewFolder extends React.Component {
       colorIndexes.push(i)
     }
     let colorElements = colorIndexes.map(index => {
-      let className = index === this.state.color
+      let className = 'option'
-        ? 'active'
+      if (index === this.state.color) className += ' active'
-        : null
 
       return (
-        <span className='option' key={index} onClick={e => this.handleColorClick(index)(e)}>
+        <span className={className} key={index} onClick={e => this.handleColorClick(index)(e)}>
-          <FolderMark className={className} color={index}/>
+          <FolderMark color={index}/>
         </span>
       )
     })