mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-13 01:36:22 +00:00
improve style of StatusBar & display pathname from StatusBar
This commit is contained in:
@@ -1,9 +1,19 @@
|
||||
.root
|
||||
absolute bottom left right
|
||||
height 24px
|
||||
height $statusBar-height
|
||||
border-top $ui-border
|
||||
background-color $ui-backgroundColor
|
||||
|
||||
.pathname
|
||||
absolute left
|
||||
height 24px
|
||||
overflow ellipsis
|
||||
width 350px
|
||||
line-height 24px
|
||||
font-size 12px
|
||||
padding 0 15px
|
||||
color $ui-inactive-text-color
|
||||
|
||||
.zoom
|
||||
navButtonColor()
|
||||
absolute right
|
||||
@@ -21,3 +31,8 @@
|
||||
border-width 0 0 0 1px
|
||||
border-style solid
|
||||
border-color $ui-borderColor
|
||||
&:active .update-icon
|
||||
color white
|
||||
|
||||
.update-icon
|
||||
color $brand-color
|
||||
|
||||
@@ -49,14 +49,16 @@ class StatusBar extends React.Component {
|
||||
}
|
||||
|
||||
render () {
|
||||
let { config } = this.props
|
||||
let { config, location } = this.props
|
||||
|
||||
return (
|
||||
<div className='StatusBar'
|
||||
styleName='root'
|
||||
>
|
||||
<div styleName='pathname'>{location.pathname}</div>
|
||||
{this.state.updateAvailable
|
||||
? <button onClick={this.updateApp} styleName='update'>
|
||||
<i className='fa fa-cloud-download'/> Update is available!
|
||||
<i styleName='update-icon' className='fa fa-cloud-download'/> Update is available!
|
||||
</button>
|
||||
: null
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user