Move the notification area from main window to preference modal

browser/main/Detail/MarkdownNoteDetail.styl

@@ -3,9 +3,7 @@
 
 .root
   absolute top right bottom
-  border-width 0 0 1px
-  border-style solid
-  border-color $ui-borderColor
+  border-width 0
   background-color $ui-noteDetail-backgroundColor
   box-shadow $note-detail-box-shadow
 
@@ -44,7 +42,6 @@
 
 body[data-theme="dark"]
   .root
-    border-color $ui-dark-borderColor
     background-color $ui-dark-noteDetail-backgroundColor
     box-shadow none
 

browser/main/Detail/SnippetNoteDetail.styl

@@ -3,9 +3,7 @@
 
 .root
   absolute top bottom right
-  border-width 0 0 1px
-  border-style solid
-  border-color $ui-borderColor
+  border-width 0
   background-color $ui-noteDetail-backgroundColor
   box-shadow $note-detail-box-shadow
 
@@ -57,7 +55,7 @@
 
 .override
   absolute bottom left
-  bottom 30px
+  bottom 2px
   left 60px
   height 23px
   z-index 101

browser/main/Main.js

@@ -14,7 +14,6 @@ import InitModal from 'browser/main/modals/InitModal'
 import mixpanel from 'browser/main/lib/mixpanel'
 import mobileAnalytics from 'browser/main/lib/AwsMobileAnalyticsConfig'
 import eventEmitter from 'browser/main/lib/eventEmitter'
-import RealtimeNotification from 'browser/components/RealtimeNotification'
 
 function focused () {
   mixpanel.track('MAIN_FOCUSED')
@@ -192,14 +191,6 @@ class Main extends React.Component {
 
     // the width of the navigation bar when it is folded/collapsed
     const foldedNavigationWidth = 44
-    let notificationBarOffsetLeft
-    if (this.state.fullScreen) {
-      notificationBarOffsetLeft = 0
-    } else if (config.isSideNavFolded) {
-      notificationBarOffsetLeft = foldedNavigationWidth
-    } else {
-      notificationBarOffsetLeft = this.state.navWidth
-    }
 
     return (
       <div
@@ -268,9 +259,6 @@ class Main extends React.Component {
             ignorePreviewPointerEvents={this.state.isRightSliderFocused}
           />
         </div>
-        <RealtimeNotification
-          style={{left: notificationBarOffsetLeft}}
-        />
       </div>
     )
   }

browser/main/NoteList/NoteList.styl

@@ -2,7 +2,6 @@ $control-height = 30px
 
 .root
   absolute left bottom
-  bottom 30px
   top $topBar-height - 1
   background-color $ui-noteList-backgroundColor
 

browser/main/StatusBar/StatusBar.styl

@@ -2,8 +2,6 @@
 
 .root
   absolute bottom left right
-  height $statusBar-height
-  bottom 16px
   z-index 100
   background-color $ui-noteDetail-backgroundColor
   display flex

browser/main/modals/PreferencesModal/index.js

@@ -9,6 +9,7 @@ import StoragesTab from './StoragesTab'
 import ModalEscButton from 'browser/components/ModalEscButton'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './PreferencesModal.styl'
+import RealtimeNotification from 'browser/components/RealtimeNotification'
 
 class Preferences extends React.Component {
   constructor (props) {
@@ -136,6 +137,7 @@ class Preferences extends React.Component {
         <div ref='content' styleName='content'>
           {content}
         </div>
+        <RealtimeNotification/>
       </div>
     )
   }