1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 09:46:22 +00:00

Fixed ToggleMode button overlapping CSS issue

The absolute positioning of the toggle mode button was creating a static overlapping position issue with the top bar. This fix solves that problem by removing the static positioning and coupling the button component with the buttons to the right
This commit is contained in:
pfftdammitchris
2018-02-20 21:09:43 -08:00
parent 46a733ba5b
commit 4f15cc3f08
3 changed files with 6 additions and 7 deletions

View File

@@ -362,12 +362,10 @@ class MarkdownNoteDetail extends React.Component {
value={this.state.note.tags}
onChange={this.handleUpdateTag.bind(this)}
/>
<ToggleModeButton onClick={(e) => this.handleSwitchMode(e)} editorType={editorType} />
<TodoListPercentage percentageOfTodo={getTodoPercentageOfCompleted(note.content)} />
</div>
<div styleName='info-right'>
<ToggleModeButton onClick={(e) => this.handleSwitchMode(e)} editorType={editorType} />
<StarButton
onClick={(e) => this.handleStarButtonClick(e)}
isActive={note.isStarred}

View File

@@ -7,6 +7,7 @@
background-color $ui-noteDetail-backgroundColor
box-shadow none
padding 20px 40px
overflow hidden
.lock-button
padding-bottom 3px
@@ -44,7 +45,7 @@
margin 0 30px
.body-noteEditor
absolute top bottom left right
body[data-theme="white"]
.root
box-shadow $note-detail-box-shadow

View File

@@ -5,8 +5,8 @@
width 52px
display flex
align-items center
position absolute
right 165px
position: relative
top 2px
.active
background-color #1EC38B
width 33px
@@ -55,4 +55,4 @@ body[data-theme="solarized-dark"]
background-color #002B36
.active
background-color #1EC38B
box-shadow 2px 0px 7px #222222
box-shadow 2px 0px 7px #222222