1
0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-11 00:36:26 +00:00
Files
Boostnote/browser/main/Detail/NoteDetailInfo.styl
2020-01-30 19:14:58 +01:00

116 lines
2.3 KiB
Stylus

@import('DetailVars')
$info-height = 60px
$info-margin-under-border = 30px
.info
absolute top left right
left 0
right 0
height $info-height
background-color $ui-noteDetail-backgroundColor
width 100%
display flex
align-items center
padding 0 20px
z-index 99
.info > div
> button
-webkit-user-drag none
user-select none
> img, span
-webkit-user-drag none
user-select none
.info-left
padding 0 10px
width 100%
display flex
align-items center
.info-left-top-folderSelect
display flex
align-items center
justify-content center
.info-left-button
width 34px
height 34px
navButtonColor()
color $ui-favorite-star-button-color
font-size 14px
line-height 0
margin 13px 2px
padding 0
border-radius 17px
&:hover .info-left-button-tooltip
opacity 1
&:focus
border-color $ui-favorite-star-button-color
&:active, &:active:hover
background-color $ui-favorite-star-button-color
color $ui-button--color
.info-right
z-index 101
display inline-flex
margin-top 3px
.undo-button
width 34px
height 34px
border-radius 17px
font-size 14px
margin 5px 0px
border none
color $ui-button-color
display flex
align-items center
justify-content center
fill $ui-button-color
background-color transparent
cursor pointer
&:active
border-color $ui-button--active-backgroundColor
&:hover
background-color alpha($ui-button--hover-backgroundColor, 60%)
transition 0.2s
.control-lockButton-tooltip
opacity 1
body[data-theme="dark"]
.info
border-color $ui-dark-borderColor
background-color $ui-dark-noteDetail-backgroundColor
.info-delete
color $ui-dark-text-color
.info-delete-confirmButton
colorDarkDangerButton()
color $ui-dark-text-color
.info-delete-cancelButton
colorDarkDefaultButton()
border-color $ui-dark-borderColor
color $ui-dark-text-color
.info-right
background-color $ui-dark-noteDetail-backgroundColor
.undo-button
topBarButtonDark()
apply-theme(theme)
body[data-theme={theme}]
.info
border-color get-theme-var(theme, 'borderColor')
background-color get-theme-var(theme, 'noteDetail-backgroundColor')
for theme in 'solarized-dark' 'dracula'
apply-theme(theme)
for theme in $themes
apply-theme(theme)