From 93e9235bb27feefe84b3a7870c556dfae1df2343 Mon Sep 17 00:00:00 2001
From: sota1235 <sota1235@gmail.com>
Date: Fri, 30 Dec 2016 15:05:04 +0900
Subject: [PATCH] modify: markup style for info tab on config modal

---
 .../main/modals/PreferencesModal/InfoTab.js   | 15 ++++++---
 .../main/modals/PreferencesModal/InfoTab.styl | 32 +++++++++++++------
 2 files changed, 34 insertions(+), 13 deletions(-)

diff --git a/browser/main/modals/PreferencesModal/InfoTab.js b/browser/main/modals/PreferencesModal/InfoTab.js
index ae3d52d0..6016941a 100644
--- a/browser/main/modals/PreferencesModal/InfoTab.js
+++ b/browser/main/modals/PreferencesModal/InfoTab.js
@@ -22,12 +22,19 @@ class InfoTab extends React.Component {
   render () {
     return (
       <div styleName='root'>
+        <div styleName='header'>Info</div>
+
         <div styleName='top'>
-          <img styleName='icon' src='../resources/app.png' width='150' height='150'/>
-          <div styleName='appId'>Boostnote {appVersion}</div>
-          <div styleName='description'>
-            A simple markdown/snippet note app for developer.
+          <div styleName='icon-space'>
+            <img styleName='icon' src='../resources/app.png' width='92' height='92'/>
+            <div styleName='icon-right'>
+              <div styleName='appId'>Boostnote {appVersion}</div>
+              <div styleName='description'>
+                A simple markdown/snippet note app for developer.
+              </div>
+            </div>
           </div>
+          <div styleName='clear'></div>
           <div styleName='madeBy'>Made by&nbsp;
             <a href='http://maisin.co/'
               onClick={(e) => this.handleLinkClick(e)}
diff --git a/browser/main/modals/PreferencesModal/InfoTab.styl b/browser/main/modals/PreferencesModal/InfoTab.styl
index 63244cd2..23cfd23e 100644
--- a/browser/main/modals/PreferencesModal/InfoTab.styl
+++ b/browser/main/modals/PreferencesModal/InfoTab.styl
@@ -1,3 +1,5 @@
+@import('./Tab')
+
 .root
   padding 15px
   white-space pre
@@ -5,27 +7,39 @@
   color $ui-text-color
   width 100%
 
+.clear
+  clear both
+
 .top
-  text-align center
-  margin-bottom 25px
+  text-align left
+  margin-bottom 20px
+
+.icon-space
+  margin 20px 0
+  height 100px
+
+.icon
+  display inline-block
+  vertical-align middle
+
+.icon-right
+  display inline-block
+  vertical-align middle
+  margin-left 20px
 
 .appId
   font-size 24px
+  margin-bottom 13px
 
 .description
-  overflow hidden
-  white-space normal
-  line-height 1.5
-  margin 5px auto 10px
   font-size 14px
-  text-align center
 
 .madeBy
-  font-size 12px
+  font-size 14px
   $ui-inactive-text-color
 
 .copyright
-  font-size 12px
+  font-size 14px
   $ui-inactive-text-color
 
 .list