public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-15 18:56:22 +00:00
Code Issues Releases Wiki Activity

improve style of sidenav

Browse Source
This commit is contained in:
HarlanLuo
2019-01-29 12:06:05 +08:00
committed by amedora
parent 8dc5214c9e
commit 51aff20d65
1 changed files with 36 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
browser/main/SideNav/SideNav.styl
View File

@@ -9,22 +9,24 @@
flex-direction column flex-direction column
.top .top
padding-bottom 15px display flex
align-items top
justify-content space-between
padding-bottom 10px
margin 14px 14px 4px
.switch-buttons .switch-buttons
background-color transparent background-color transparent
border 0 border 0
margin 24px auto 4px 14px
display flex display flex
align-items center
text-align center text-align center
.extra-buttons .extra-buttons
position absolute position relative
top -3px
display flex display flex
align-items center align-items center
justify-content flex-end
right 10px
top 24px
.search .search
position relative position relative
@@ -98,8 +100,15 @@
background-color #2E3235 background-color #2E3235
.switch-buttons .switch-buttons
display none display none
.extra-buttons > button:first-of-type // hide search icon
display none
.top .top
height 60px height 60px
align-items center
margin 0
justify-content center
position relative
left -4px
.top-menu .top-menu
position static position static
width $sideNav--folded-width width $sideNav--folded-width
@@ -144,12 +153,19 @@ body[data-theme="white"]
.root, .root--folded .root, .root--folded
background-color #f9f9f9 background-color #f9f9f9
color $ui-text-color color $ui-text-color
.search .search-input
background-color #f9f9f9
color $ui-text-color
body[data-theme="dark"] body[data-theme="dark"]
.root, .root--folded .root, .root--folded
border-right 1px solid $ui-dark-borderColor border-right 1px solid $ui-dark-borderColor
background-color $ui-dark-backgroundColor background-color $ui-dark-backgroundColor
color $ui-dark-text-color color $ui-dark-text-color
.search .search-input
background-color $ui-dark-backgroundColor
color $ui-dark-text-color
border-color $ui-dark-borderColor
.top .top
border-color $ui-dark-borderColor border-color $ui-dark-borderColor
@@ -159,12 +175,25 @@ body[data-theme="solarized-dark"]
background-color $ui-solarized-dark-backgroundColor background-color $ui-solarized-dark-backgroundColor
border-right 1px solid $ui-solarized-dark-borderColor border-right 1px solid $ui-solarized-dark-borderColor
.search .search-input
background-color $ui-solarized-dark-backgroundColor
color $ui-solarized-dark-text-color
border-color $ui-solarized-dark-borderColor
body[data-theme="monokai"] body[data-theme="monokai"]
.root, .root--folded .root, .root--folded
background-color $ui-monokai-backgroundColor background-color $ui-monokai-backgroundColor
border-right 1px solid $ui-monokai-borderColor border-right 1px solid $ui-monokai-borderColor
.search .search-input
background-color $ui-monokai-backgroundColor
color $ui-monokai-text-color
border-color $ui-monokai-borderColor
body[data-theme="dracula"] body[data-theme="dracula"]
.root, .root--folded .root, .root--folded
background-color $ui-dracula-backgroundColor background-color $ui-dracula-backgroundColor
border-right 1px solid $ui-dracula-borderColor border-right 1px solid $ui-dracula-borderColor
.search .search-input
background-color $ui-dracula-backgroundColor
color $ui-dracula-text-color
border-color $ui-dracula-borderColor