1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-14 02:06:29 +00:00

Align notification bar with the navigation bar

This commit is contained in:
Cristian Beskid
2017-09-25 17:17:34 +02:00
parent 1a6f3d808b
commit 80c13f7c4f
2 changed files with 9 additions and 3 deletions

View File

@@ -45,7 +45,7 @@ class RealtimeNotification extends React.Component {
: '' : ''
return ( return (
<div styleName='notification-area'>{link}</div> <div styleName='notification-area' style={this.props.style}>{link}</div>
) )
} }
} }

View File

@@ -20,7 +20,11 @@ function focused () {
mixpanel.track('MAIN_FOCUSED') mixpanel.track('MAIN_FOCUSED')
} }
// the width of the navigation bar when it is folded/collapsed
const foldedNavigationWidth = 44;
class Main extends React.Component { class Main extends React.Component {
constructor (props) { constructor (props) {
super(props) super(props)
@@ -217,7 +221,7 @@ class Main extends React.Component {
<div styleName={config.isSideNavFolded ? 'body--expanded' : 'body'} <div styleName={config.isSideNavFolded ? 'body--expanded' : 'body'}
id='main-body' id='main-body'
ref='body' ref='body'
style={{left: config.isSideNavFolded ? 44 : this.state.navWidth}} style={{left: config.isSideNavFolded ? foldedNavigationWidth : this.state.navWidth}}
> >
<TopBar style={{width: this.state.listWidth}} <TopBar style={{width: this.state.listWidth}}
{..._.pick(this.props, [ {..._.pick(this.props, [
@@ -256,7 +260,9 @@ class Main extends React.Component {
ignorePreviewPointerEvents={this.state.isRightSliderFocused} ignorePreviewPointerEvents={this.state.isRightSliderFocused}
/> />
</div> </div>
<RealtimeNotification /> <RealtimeNotification
style={{left: config.isSideNavFolded ? foldedNavigationWidth : this.state.navWidth}}
/>
</div> </div>
) )
} }