mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-15 18:56:22 +00:00
design update 2
This commit is contained in:
@@ -8,7 +8,7 @@ const InfoButton = ({
|
||||
<button styleName='control-infoButton'
|
||||
onClick={onClick}
|
||||
>
|
||||
<i className='fa fa-info-circle infoButton' styleName='info-button' />
|
||||
<img styleName='iconInfo' src='../resources/icon/icon-info.svg'/>
|
||||
</button>
|
||||
)
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
.infoButton
|
||||
padding 0px
|
||||
margin 15px 0
|
||||
margin 45px 0
|
||||
|
||||
body[data-theme="dark"]
|
||||
.control-infoButton
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
.control-infoButton-panel
|
||||
z-index 200
|
||||
margin-top 38px
|
||||
right 0px
|
||||
right 0
|
||||
position absolute
|
||||
padding 20px 25px 0 25px
|
||||
width 300px
|
||||
|
||||
@@ -232,7 +232,7 @@ class MarkdownNoteDetail extends React.Component {
|
||||
}
|
||||
|
||||
getToggleLockButton () {
|
||||
return this.state.isLocked ? 'fa-eye-slash' : 'fa-eye'
|
||||
return this.state.isLocked ? '../resources/icon/icon-lock.svg' : '../resources/icon/icon-unlock.svg'
|
||||
}
|
||||
|
||||
handleDeleteKeyDown (e) {
|
||||
@@ -332,23 +332,25 @@ class MarkdownNoteDetail extends React.Component {
|
||||
/>
|
||||
|
||||
{(() => {
|
||||
const faClassName = `fa ${this.getToggleLockButton()}`
|
||||
const imgSrc = `${this.getToggleLockButton()}`
|
||||
const lockButtonComponent =
|
||||
<button styleName='control-lockButton'
|
||||
onFocus={(e) => this.handleFocus(e)}
|
||||
onMouseDown={(e) => this.handleLockButtonMouseDown(e)}
|
||||
>
|
||||
<i className={faClassName} styleName='lock-button' />
|
||||
<img styleName='iconInfo' src={imgSrc}/>
|
||||
</button>
|
||||
|
||||
return (
|
||||
this.state.isLockButtonShown ? lockButtonComponent : ''
|
||||
)
|
||||
})()}
|
||||
|
||||
|
||||
<button styleName='control-fullScreenButton'
|
||||
onMouseDown={(e) => this.handleFullScreenButton(e)}
|
||||
>
|
||||
<i className='fa fa-window-maximize' styleName='fullScreen-button' />
|
||||
<img styleName='iconInfo' src='../resources/icon/icon-sidebar.svg'/>
|
||||
</button>
|
||||
|
||||
<TrashButton onClick={(e) => this.handleTrashButtonClick(e)} />
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
|
||||
.control-lockButton
|
||||
top 160px
|
||||
margin-bottom 10px
|
||||
topBarButtonLight()
|
||||
|
||||
.trashed-infopanel
|
||||
@@ -28,7 +29,6 @@
|
||||
right $note-detail-right-margin
|
||||
top $info-height + $info-margin-under-border
|
||||
bottom $statusBar-height
|
||||
|
||||
.body-noteEditor
|
||||
absolute top bottom left right
|
||||
|
||||
|
||||
@@ -52,7 +52,7 @@ $info-margin-under-border = 15px
|
||||
.info-right
|
||||
position absolute
|
||||
right -20px
|
||||
top 0
|
||||
top 10px
|
||||
background $ui-noteDetail-backgroundColor
|
||||
bottom 1px
|
||||
padding-left 30px
|
||||
|
||||
@@ -610,7 +610,7 @@ class SnippetNoteDetail extends React.Component {
|
||||
|
||||
<button styleName='control-fullScreenButton'
|
||||
onMouseDown={(e) => this.handleFullScreenButton(e)}>
|
||||
<i className='fa fa-window-maximize' styleName='fullScreen-button' />
|
||||
<img styleName='iconInfo' src='../resources/icon/icon-sidebar.svg'/>
|
||||
</button>
|
||||
|
||||
<TrashButton onClick={(e) => this.handleTrashButtonClick(e)} />
|
||||
|
||||
@@ -67,6 +67,7 @@
|
||||
|
||||
.control-fullScreenButton
|
||||
top 80px
|
||||
margin-bottom 10px
|
||||
topBarButtonLight()
|
||||
|
||||
body[data-theme="white"]
|
||||
|
||||
@@ -47,10 +47,10 @@ class StarButton extends React.Component {
|
||||
onMouseLeave={(e) => this.handleMouseLeave(e)}
|
||||
onClick={this.props.onClick}
|
||||
>
|
||||
<i styleName='icon'
|
||||
className={this.state.isActive || this.props.isActive
|
||||
? 'fa fa-star'
|
||||
: 'fa fa-star-o'
|
||||
<img styleName='icon'
|
||||
src={this.state.isActive || this.props.isActive
|
||||
? '../resources/icon/icon-starred.svg'
|
||||
: '../resources/icon/icon-star.svg'
|
||||
}
|
||||
/>
|
||||
</button>
|
||||
|
||||
@@ -8,7 +8,7 @@ const TrashButton = ({
|
||||
<button styleName='control-trashButton'
|
||||
onClick={(e) => onClick(e)}
|
||||
>
|
||||
<i className='fa fa-trash trashButton' styleName='info-button' />
|
||||
<img styleName='iconInfo' src='../resources/icon/icon-trash.svg'/>
|
||||
</button>
|
||||
)
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
.control-trashButton
|
||||
top 120px
|
||||
margin-bottom 10px
|
||||
topBarButtonLight()
|
||||
|
||||
.control-trashButton--in-trash
|
||||
@@ -8,7 +9,6 @@
|
||||
|
||||
.trashButton
|
||||
padding 0px
|
||||
margin 15px 0
|
||||
|
||||
body[data-theme="dark"]
|
||||
.control-trashButton
|
||||
|
||||
Reference in New Issue
Block a user