mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-13 17:56:25 +00:00
507 lines
14 KiB
Stylus
507 lines
14 KiB
Stylus
menuColor = #808080
|
|
menuBgColor = #E6E6E6
|
|
closeBtnBgColor = #1790C6
|
|
iptFocusBorderColor = #369DCD
|
|
|
|
.Preferences.modal
|
|
padding 0
|
|
border-radius 5px
|
|
overflow hidden
|
|
width 720px
|
|
height 450px
|
|
&>.header
|
|
absolute top left right
|
|
height 50px
|
|
border-bottom 1px solid borderColor
|
|
background-color menuBgColor
|
|
&>.title
|
|
font-size 22px
|
|
font-weight bold
|
|
float left
|
|
padding-left 30px
|
|
line-height 50px
|
|
&>.closeBtn
|
|
float right
|
|
font-size 14px
|
|
background-color closeBtnBgColor
|
|
color white
|
|
padding 0 15px
|
|
height 33px
|
|
margin-top 9px
|
|
margin-right 15px
|
|
border none
|
|
border-radius 5px
|
|
&:hover
|
|
background-color lighten(closeBtnBgColor, 10%)
|
|
&>.nav
|
|
absolute left bottom
|
|
top 50px
|
|
width 180px
|
|
background-color menuBgColor
|
|
border-right 1px solid borderColor
|
|
&>button
|
|
width 100%
|
|
height 44px
|
|
font-size 18px
|
|
color menuColor
|
|
border none
|
|
background-color transparent
|
|
transition 0.1s
|
|
text-align left
|
|
padding-left 15px
|
|
&:hover
|
|
background-color darken(menuBgColor, 10%)
|
|
&.active, &:active
|
|
background-color brandColor
|
|
color white
|
|
&>.content
|
|
absolute right bottom
|
|
top 50px
|
|
left 180px
|
|
overflow-y auto
|
|
&>.section
|
|
padding 10px
|
|
border-bottom 1px solid borderColor
|
|
overflow-y auto
|
|
&:nth-last-child(1)
|
|
border-bottom none
|
|
&>.sectionTitle
|
|
font-size 18px
|
|
margin 10px 0 5px
|
|
color brandColor
|
|
&>.sectionInput
|
|
height 33px
|
|
margin-bottom 5px
|
|
clearfix()
|
|
label
|
|
width 180px
|
|
padding-left 15px
|
|
float left
|
|
line-height 33px
|
|
input
|
|
width 300px
|
|
float left
|
|
height 33px
|
|
border-radius 5px
|
|
border 1px solid borderColor
|
|
padding 0 10px
|
|
font-size 14px
|
|
outline none
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
&>.sectionConfirm
|
|
clearfix()
|
|
padding 5px 15px
|
|
button
|
|
float right
|
|
background-color brandColor
|
|
color white
|
|
border none
|
|
border-radius 5px
|
|
height 33px
|
|
padding 0 15px
|
|
font-size 14px
|
|
&:hover
|
|
background-color lighten(brandColor, 10%)
|
|
.alert
|
|
float right
|
|
width 250px
|
|
padding 10px 15px
|
|
margin 0 10px 0
|
|
.alert
|
|
color infoTextColor
|
|
background-color infoBackgroundColor
|
|
font-size 14px
|
|
padding 15px 15px
|
|
width 330px
|
|
border-radius 5px
|
|
margin 10px auto
|
|
&.error
|
|
color errorTextColor
|
|
background-color errorBackgroundColor
|
|
&.AppSettingTab
|
|
.description
|
|
marked()
|
|
&.TeamSettingTab
|
|
.header
|
|
border-bottom 1px solid borderColor
|
|
padding 10px
|
|
font-size 18px
|
|
color brandColor
|
|
line-height 33px
|
|
.teamSelect
|
|
border 1px solid borderColor
|
|
height 33px
|
|
width 200px
|
|
margin 0 10px
|
|
outline none
|
|
font-size 14px
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.teamDeleteConfirm
|
|
|
|
label
|
|
line-height 33px
|
|
font-size 14px
|
|
.teamDelete
|
|
label
|
|
line-height 33px
|
|
font-size 18px
|
|
color brandColor
|
|
.teamDelete, .teamDeleteConfirm
|
|
padding 15px 20px 15px 15px
|
|
button
|
|
background-color white
|
|
height 33px
|
|
font-size 14px
|
|
padding 0 15px
|
|
border 1px solid borderColor
|
|
float right
|
|
margin 0 5px
|
|
border-radius 5px
|
|
&:hover
|
|
background-color darken(white, 10%)
|
|
button.deleteBtn
|
|
background-color brandColor
|
|
border none
|
|
color white
|
|
&:hover
|
|
background-color lighten(brandColor, 10%)
|
|
&.MemberSettingTab
|
|
&>.header
|
|
border-bottom 1px solid borderColor
|
|
padding 10px
|
|
font-size 18px
|
|
color brandColor
|
|
line-height 33px
|
|
.teamSelect
|
|
border 1px solid borderColor
|
|
height 33px
|
|
width 200px
|
|
margin 0 10px
|
|
outline none
|
|
font-size 14px
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.membersTableSection
|
|
.addMember
|
|
clearfix()
|
|
padding 10px
|
|
.addMemberLabel
|
|
font-size 14px
|
|
line-height 33px
|
|
float left
|
|
.addMemberControl
|
|
width 330px
|
|
float left
|
|
margin-left 25px
|
|
.Select
|
|
display block
|
|
margin 0
|
|
float left
|
|
width 280px
|
|
height 33px
|
|
font-size 14px
|
|
border none
|
|
line-height 33px
|
|
background-color transparent
|
|
outline none
|
|
&.is-focus
|
|
.Select-control
|
|
border-color iptFocusBorderColor
|
|
.Select-control
|
|
height 33px
|
|
line-height 33px
|
|
padding 0 0 0 15px
|
|
border-radius 5px 0 0 5px
|
|
border 1px solid borderColor
|
|
border-right none
|
|
.Select-placeholder
|
|
padding 0 0 0 15px
|
|
.Seleect-arrow
|
|
top 21px
|
|
.Select-clear
|
|
padding 0 10px
|
|
.Select-noresults, .Select-option
|
|
line-height 33px
|
|
padding 0 0 0 15px
|
|
button
|
|
font-weight 400
|
|
height 33px
|
|
cursor pointer
|
|
margin 0
|
|
padding 0
|
|
width 50px
|
|
float right
|
|
border none
|
|
background-color brandColor
|
|
border-top-right-radius 5px
|
|
border-bottom-right-radius 5px
|
|
color white
|
|
font-size 14px
|
|
.memberList
|
|
&>.header
|
|
clearfix()
|
|
&>.userName
|
|
float left
|
|
&>.role
|
|
float left
|
|
&>.control
|
|
float right
|
|
&>li
|
|
&.edit
|
|
.colDescription
|
|
font-size 14px
|
|
line-height 33px
|
|
padding-left 15px
|
|
float left
|
|
strong
|
|
font-size 16px
|
|
color brandColor
|
|
.colDeleteConfirm
|
|
float right
|
|
margin-right 15px
|
|
button
|
|
border none
|
|
height 30px
|
|
width 60px
|
|
margin-top 1.5px
|
|
font-size 14px
|
|
background-color transparent
|
|
color stripBtnColor
|
|
&:hover
|
|
color stripHoverBtnColor
|
|
&:disabled
|
|
color lighten(stripBtnColor, 10%)
|
|
cursor not-allowed
|
|
&.primary
|
|
color brandColor
|
|
&:hover
|
|
color lighten(brandColor, 10%)
|
|
|
|
border-bottom 1px solid borderColor
|
|
height 44px
|
|
padding 0 25px
|
|
width 420px
|
|
margin 0 auto
|
|
clearfix()
|
|
&:nth-last-child(1)
|
|
border-bottom-color transparent
|
|
.colUserName
|
|
float left
|
|
width 250px
|
|
clearfix()
|
|
.userPhoto
|
|
width 30px
|
|
height 30px
|
|
float left
|
|
margin-top 7px
|
|
margin-right 15px
|
|
border-radius 15px
|
|
.userInfo
|
|
float left
|
|
margin-top 7px
|
|
width 205px
|
|
.userName
|
|
font-size 16px
|
|
margin-bottom 2px
|
|
overflow ellipsis
|
|
.userEmail
|
|
font-size 12px
|
|
overflow ellipsis
|
|
.colRole
|
|
float left
|
|
width 75px
|
|
.userRole
|
|
height 30px
|
|
background-color transparent
|
|
border 1px solid transparent
|
|
margin-top 7px
|
|
margin-right 35px
|
|
outline none
|
|
cursor pointer
|
|
&:hover
|
|
border-color borderColor
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
&:disabled
|
|
border-color transparent
|
|
cursor not-allowed
|
|
.colDelete
|
|
width 45px
|
|
float right
|
|
text-align center
|
|
button.deleteButton
|
|
border none
|
|
height 30px
|
|
width 30px
|
|
margin-top 7px
|
|
background-color transparent
|
|
color stripBtnColor
|
|
&:hover
|
|
color stripHoverBtnColor
|
|
&:disabled
|
|
color lighten(stripBtnColor, 10%)
|
|
cursor not-allowed
|
|
&.header
|
|
.colRole, .colDelete
|
|
text-align center
|
|
.colUserName, .colRole, .colDelete
|
|
line-height 44px
|
|
&.FolderSettingTab
|
|
&>.header
|
|
border-bottom 1px solid borderColor
|
|
padding 10px
|
|
font-size 18px
|
|
color brandColor
|
|
line-height 33px
|
|
.teamSelect
|
|
border 1px solid borderColor
|
|
height 33px
|
|
width 200px
|
|
margin 0 10px
|
|
outline none
|
|
font-size 14px
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.section
|
|
.folderTable
|
|
width 420px
|
|
margin 15px auto
|
|
&>div
|
|
border-bottom 1px solid borderColor
|
|
clearfix()
|
|
height 43px
|
|
line-height 33px
|
|
padding 5px 0
|
|
&:last-child
|
|
border-color transparent
|
|
.folderName
|
|
float left
|
|
width 175px
|
|
overflow ellipsis
|
|
padding-left 15px
|
|
.folderPublic
|
|
float left
|
|
text-align center
|
|
width 100px
|
|
.folderControl
|
|
float right
|
|
width 145px
|
|
text-align center
|
|
&.newFolder
|
|
.alert
|
|
display block
|
|
color infoTextColor
|
|
background-color infoBackgroundColor
|
|
font-size 14px
|
|
padding 15px 15px
|
|
width 330px
|
|
border-radius 5px
|
|
margin 0 auto
|
|
&.error
|
|
color errorTextColor
|
|
background-color errorBackgroundColor
|
|
.folderName input
|
|
height 33px
|
|
border 1px solid transparent
|
|
border-radius 5px
|
|
padding 0 10px
|
|
font-size 14px
|
|
outline none
|
|
width 150px
|
|
overflow ellipsis
|
|
&:hover
|
|
border-color borderColor
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.folderPublic select
|
|
height 33px
|
|
border 1px solid transparent
|
|
background-color white
|
|
outline none
|
|
display block
|
|
margin 0 auto
|
|
font-size 14px
|
|
&:hover
|
|
border-color borderColor
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.folderControl
|
|
button
|
|
border none
|
|
height 30px
|
|
margin-top 1.5px
|
|
font-size 14px
|
|
background-color transparent
|
|
color brandColor
|
|
&:hover
|
|
color lighten(brandColor, 10%)
|
|
&.FolderRow
|
|
.folderName input
|
|
height 33px
|
|
border 1px solid borderColor
|
|
border-radius 5px
|
|
padding 0 10px
|
|
font-size 14px
|
|
outline none
|
|
width 150px
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.folderPublic select
|
|
height 33px
|
|
border 1px solid borderColor
|
|
background-color white
|
|
outline none
|
|
display block
|
|
margin 0 auto
|
|
font-size 14px
|
|
&:focus
|
|
border-color iptFocusBorderColor
|
|
.folderControl
|
|
button
|
|
border none
|
|
height 30px
|
|
width 30px
|
|
margin-top 1.5px
|
|
font-size 14px
|
|
background-color transparent
|
|
color stripBtnColor
|
|
&:hover
|
|
color stripHoverBtnColor
|
|
&:disabled
|
|
color lighten(stripBtnColor, 10%)
|
|
cursor not-allowed
|
|
&.edit
|
|
.folderControl
|
|
button
|
|
width 60px
|
|
&.primary
|
|
color brandColor
|
|
&:hover
|
|
color lighten(brandColor, 10%)
|
|
&.delete
|
|
.folderDeleteLabel
|
|
float left
|
|
height 33px
|
|
width 250px
|
|
padding-left 15px
|
|
overflow ellipsis
|
|
strong
|
|
font-size 16px
|
|
color brandColor
|
|
.folderControl
|
|
button
|
|
width 60px
|
|
&.primary
|
|
color brandColor
|
|
&:hover
|
|
color lighten(brandColor, 10%)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|