1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 17:56:25 +00:00
Files
Boostnote/browser/main/modals/PreferencesModal/PreferencesModal.styl
2017-04-13 12:14:36 +09:00

98 lines
1.7 KiB
Stylus

@import('./Tab')
top-bar--height = 50px
.root
modal()
max-width 800px
min-height 500px
height 80%
overflow hidden
position relative
.top-bar
absolute top left right
height top-bar--height
background-color $ui-backgroundColor
border-bottom solid 1px $ui-borderColor
p
text-align center
font-size 18px
line-height top-bar--height
.top-bar-close
position absolute
background-color transparent
color $ui-inactive-text-color
border none
top 0
right 0
text-align center
width top-bar--height
height top-bar--height
.nav
absolute top left right
top top-bar--height
left 0
width 140px
margin-left 30px
margin-top 20px
background-color $ui-backgroundColor
.nav-button
font-size 14px
text-align left
width 100px
margin 4px 0
padding 5px 0
padding-left 10px
border none
border-radius 2px
background-color transparent
color $ui-text-color
font-size 14px
.nav-button--active
@extend .nav-button
color $ui-text-color
background-color $ui-button--active-backgroundColor
&:hover
color $ui-text-color
.nav-button-icon
display block
.content
absolute left right bottom
top top-bar--height
left 140px
margin-top 10px
overflow-y auto
body[data-theme="dark"]
.root
modalDark()
.top-bar
background-color transparent
border-color #4A4D52
p
color $tab--dark-text-color
.nav
background-color transparent
border-color $ui-dark-borderColor
.nav-button
background-color transparent
color $tab--dark-text-color
&:hover
color $ui-dark-text-color
.nav-button--active
@extend .nav-button
color white
background-color $dark-primary-button-background--active
&:hover
color white