diff --git a/.gitmodules b/.gitmodules
index 548af57f..73ca057a 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,3 +1,6 @@
 [submodule "browser/ace"]
 	path = browser/ace
 	url = https://github.com/ajaxorg/ace-builds.git
+[submodule "browser/electron-stylus"]
+	path = browser/electron-stylus
+	url = https://github.com/Rokt33r/electron-stylus.git
diff --git a/browser/electron-stylus b/browser/electron-stylus
new file mode 160000
index 00000000..6d86de7c
--- /dev/null
+++ b/browser/electron-stylus
@@ -0,0 +1 @@
+Subproject commit 6d86de7c6666363c6c62a1c4ef95a3c1204e10ec
diff --git a/browser/finder/Components/FinderDetail.jsx b/browser/finder/Components/FinderDetail.jsx
index 0f610d6c..afc29762 100644
--- a/browser/finder/Components/FinderDetail.jsx
+++ b/browser/finder/Components/FinderDetail.jsx
@@ -2,10 +2,9 @@ var React = require('react/addons')
 
 var CodeViewer = require('../../main/Components/CodeViewer')
 
-var Markdown = require('../../main/Mixins/Markdown')
+var MarkdownPreview = require('../../main/Components/MarkdownPreview')
 
 module.exports = React.createClass({
-  mixins: [Markdown],
   propTypes: {
     currentArticle: React.PropTypes.object
   },
@@ -28,7 +27,7 @@ module.exports = React.createClass({
           <div className='FinderDetail'>
             <div className='header'><i className='fa fa-file-text-o fa-fw'/> {article.title}</div>
             <div className='content'>
-              <div className='marked' dangerouslySetInnerHTML={{__html: ' ' + this.markdown(article.content)}}></div>
+              <MarkdownPreview className='marked' content={article.content}/>
             </div>
           </div>
         )
diff --git a/browser/finder/index.electron.html b/browser/finder/index.electron.html
index e69f70ce..9aa524c9 100644
--- a/browser/finder/index.electron.html
+++ b/browser/finder/index.electron.html
@@ -64,7 +64,7 @@
   <div id="content"></div>
   <script src="../ace/src-min/ace.js"></script>
   <script>
-    require('electron-stylus')(__dirname + '/../styles/finder/index.styl')
+    require('../electron-stylus')(__dirname + '/../styles/finder/index.styl', 'finderCss')
     require('node-jsx').install({ harmony: true, extension: '.jsx' })
     require('./index.jsx')
   </script>
diff --git a/browser/main/Components/PlanetArticleDetail.jsx b/browser/main/Components/PlanetArticleDetail.jsx
index 23ff9761..6bf1d1b5 100644
--- a/browser/main/Components/PlanetArticleDetail.jsx
+++ b/browser/main/Components/PlanetArticleDetail.jsx
@@ -66,7 +66,7 @@ module.exports = React.createClass({
           <div className='detailHeader'>
             <div className='itemLeft'>
               <ProfileImage className='profileImage' size='25' email={article.User.email}/>
-              <i className='fa fa-file-text-o fa-fw'></i>
+              <i className='fa fa-code fa-fw'></i>
             </div>
 
             <div className='itemRight'>
diff --git a/browser/main/Components/PlanetCreateModal.jsx b/browser/main/Components/PlanetCreateModal.jsx
index c92f8fc7..3775ba58 100644
--- a/browser/main/Components/PlanetCreateModal.jsx
+++ b/browser/main/Components/PlanetCreateModal.jsx
@@ -72,7 +72,7 @@ module.exports = React.createClass({
               this.setState({error: {message: 'The entered name already in use'}})
               break
             default:
-              this.setState({error: {message: 'Undefined error please try again'}})
+              this.setState({error: {message: 'Unexpected error occured! please try again'}})
           }
         }.bind(this))
     })
diff --git a/browser/main/Components/PlanetSettingModal.jsx b/browser/main/Components/PlanetSettingModal.jsx
index 10432b2f..a592c945 100644
--- a/browser/main/Components/PlanetSettingModal.jsx
+++ b/browser/main/Components/PlanetSettingModal.jsx
@@ -58,18 +58,44 @@ module.exports = React.createClass({
   handleSavePlanetProfile: function (e) {
     var planet = this.props.planet
 
-    this.setState({profileSubmitStatus: 'sending'}, function () {
+    this.setState({profileFormStatus: 'sending', profileFormError: null}, function () {
       Hq.updatePlanet(planet.userName, planet.name, this.state.planet)
         .then(function (res) {
           var planet = res.body
-
-          this.setState({profileSubmitStatus: 'done'})
+          console.log(planet)
+          this.setState({profileFormStatus: 'done'})
 
           PlanetStore.Actions.update(planet)
+          this.props.close()
         }.bind(this))
         .catch(function (err) {
-          this.setState({profileSubmitStatus: 'error'})
           console.error(err)
+          var newState = {
+            profileFormStatus: 'error'
+          }
+
+          if (err.status == null) {
+            newState.profileFormError = {message: 'Check your network connection'}
+            return this.setState(newState)
+          }
+
+          switch (err.status) {
+            case 403:
+              newState.profileFormError = err.response.body
+              this.setState(newState)
+              break
+            case 422:
+              newState.profileFormError = {message: 'Planet name should be Alphanumeric with _, -'}
+              this.setState(newState)
+              break
+            case 409:
+              newState.profileFormError = {message: 'The entered name already in use'}
+              this.setState(newState)
+              break
+            default:
+              newState.profileFormError = {message: 'Undefined error please try again'}
+              this.setState(newState)
+          }
         }.bind(this))
     })
   },
@@ -130,11 +156,11 @@ module.exports = React.createClass({
         <div className='formConfirm'>
           <button onClick={this.handleSavePlanetProfile} className='saveButton btn-primary'>Save</button>
 
-          <div className={'alertInfo' + (this.state.profileSubmitStatus === 'sending' ? '' : ' hide')}>on Sending...</div>
+          <div className={'alertInfo' + (this.state.profileFormStatus === 'sending' ? '' : ' hide')}>on Sending...</div>
 
-          <div className={'alertError' + (this.state.profileSubmitStatus === 'error' ? '' : ' hide')}>Connection failed.. Try again.</div>
+          <div className={'alertError' + (this.state.profileFormStatus === 'error' ? '' : ' hide')}>{this.state.profileFormError != null ? this.state.profileFormError.message : 'Unexpected error occured! please try again'}</div>
 
-          <div className={'alertSuccess' + (this.state.profileSubmitStatus === 'done' ? '' : ' hide')}>Successfully done!!</div>
+          <div className={'alertSuccess' + (this.state.profileFormStatus === 'done' ? '' : ' hide')}>Successfully done!!</div>
         </div>
       </div>
     )
diff --git a/browser/main/Stores/PlanetStore.js b/browser/main/Stores/PlanetStore.js
index f7559876..a1232b6f 100644
--- a/browser/main/Stores/PlanetStore.js
+++ b/browser/main/Stores/PlanetStore.js
@@ -53,6 +53,14 @@ module.exports = Reflux.createStore({
     localStorage.setItem('currentUser', JSON.stringify(currentUser))
     UserStore.Actions.update(currentUser)
 
+    planet.Codes.forEach(function (code) {
+      code.type = 'code'
+    })
+
+    planet.Notes.forEach(function (note) {
+      note.type = 'note'
+    })
+
     // Update the planet
     localStorage.setItem('planet-' + planet.id, JSON.stringify(planet))
 
diff --git a/browser/main/index.electron.html b/browser/main/index.electron.html
index 31eb98b8..ba9fe46d 100644
--- a/browser/main/index.electron.html
+++ b/browser/main/index.electron.html
@@ -29,14 +29,16 @@
   }
   #loadingCover img{
     display: block;
-    margin: 0 auto;
+    margin: 75px auto 5px;
+    width: 160px;
+    height: 160px;
   }
   #loadingCover .message{
-    font-size: 45px;
+    font-size: 30px;
     text-align: center;
     line-height: 1.6;
-    font-weight: 200;
-    color: #404849;
+    font-weight: 100;
+    color: #888;
   }
   </style>
 </head>
@@ -88,7 +90,7 @@
 
     var version = require('remote').getGlobal('version')
     document.title = 'Boost ' + ((version == null || version.length === 0) ? 'DEV version' : 'v' + version)
-    require('electron-stylus')(__dirname + '/../styles/main/index.styl')
+    require('../electron-stylus')(__dirname + '/../styles/main/index.styl', 'mainCss')
     require('node-jsx').install({ harmony: true, extension: '.jsx' })
     require('./index.jsx')
   </script>
diff --git a/browser/styles/shared/modal.styl b/browser/styles/shared/modal.styl
index 250de965..736c9fb1 100644
--- a/browser/styles/shared/modal.styl
+++ b/browser/styles/shared/modal.styl
@@ -97,7 +97,7 @@
           float right
           padding 12px 10px
           border-radius 5px
-          width 200px
+          width 320px
           font-size 1em
           overflow-x hidden
           white-space nowrap
@@ -139,7 +139,7 @@
           float right
           padding 12px 10px
           border-radius 5px
-          width 200px
+          width 320px
           font-size 1em
           overflow-x hidden
           white-space nowrap
diff --git a/main.js b/main.js
index d9fc9b29..9fb81ce9 100644
--- a/main.js
+++ b/main.js
@@ -27,6 +27,7 @@ var path = require('path')
 
 autoUpdater
   .on('error', function (err, message) {
+    console.error(message)
     nn.notify({
       title: 'Error! ' + versionText,
       icon: path.join(__dirname, 'browser/main/resources/favicon-230x230.png'),
@@ -34,11 +35,7 @@ autoUpdater
     })
   })
   .on('checking-for-update', function () {
-    nn.notify({
-      title: 'Boost launched!! ' + versionText,
-      icon: path.join(__dirname, 'browser/main/resources/favicon-230x230.png'),
-      message: 'Checking update is available....'
-    })
+    // Connecting
   })
   .on('update-available', function () {
     nn.notify({
@@ -131,9 +128,10 @@ app.on('ready', function () {
     'zoom-factor': 1.0,
     'always-on-top': true,
     'web-preferences': {
-        'overlay-scrollbars': true,
-        'skip-taskbar': true
-      }
+      'overlay-scrollbars': true,
+      'skip-taskbar': true
+    },
+    'standard-window': false
   })
 
   popUpWindow.loadUrl('file://' + __dirname + '/browser/finder/index.electron.html')
@@ -141,6 +139,7 @@ app.on('ready', function () {
   popUpWindow.on('blur', function () {
     popUpWindow.hide()
   })
+
   popUpWindow.setVisibleOnAllWorkspaces(true)
 
   var globalShortcut = require('global-shortcut')
@@ -167,8 +166,9 @@ function makeNewMainWindow () {
     height: 720,
     'zoom-factor': 1.0,
     'web-preferences': {
-        'overlay-scrollbars': true
-      }
+      'overlay-scrollbars': true
+    },
+    'standard-window': false
   })
   if (update != null) {
     mainWindow.webContents.on('did-finish-load', function () {
diff --git a/modules/menu-template.js b/modules/menu-template.js
index ad34ae62..9021cba0 100644
--- a/modules/menu-template.js
+++ b/modules/menu-template.js
@@ -5,7 +5,7 @@ module.exports = [
     label: 'Electron',
     submenu: [
       {
-        label: 'About Electron',
+        label: 'About Boost',
         selector: 'orderFrontStandardAboutPanel:'
       },
       {
diff --git a/package.json b/package.json
index 97fb7a0b..9a7cd215 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "boost",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "Boost App",
   "main": "main.js",
   "scripts": {
@@ -31,7 +31,6 @@
   },
   "homepage": "https://github.com/Rokt33r/codexen-app#readme",
   "dependencies": {
-    "electron-stylus": "^0.1.0",
     "font-awesome": "^4.3.0",
     "markdown-it": "^4.3.1",
     "md5": "^2.0.0",
@@ -43,6 +42,7 @@
     "react-router": "^0.13.3",
     "react-select": "^0.5.4",
     "reflux": "^0.2.8",
+    "stylus": "^0.52.0",
     "superagent": "^1.2.0",
     "superagent-promise": "^1.0.3"
   },
diff --git a/tray-icon.png b/tray-icon.png
index aba8e7d5..c42383b3 100644
Binary files a/tray-icon.png and b/tray-icon.png differ
diff --git a/tray-icon@2x.png b/tray-icon@2x.png
index eff01fc0..effa6bfa 100644
Binary files a/tray-icon@2x.png and b/tray-icon@2x.png differ