mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-15 10:46:32 +00:00
365 lines
8.6 KiB
Stylus
365 lines
8.6 KiB
Stylus
.ModalBase
|
|
fixed top left bottom right
|
|
z-index modalZIndex
|
|
&.hide
|
|
display none
|
|
.modalBack
|
|
absolute top left bottom right
|
|
background-color modalBackColor
|
|
z-index modalZIndex + 1
|
|
.modal
|
|
position relative
|
|
width 650px
|
|
margin 50px auto 0
|
|
z-index modalZIndex + 2
|
|
box-shadow popupShadow
|
|
background-color white
|
|
border-radius 10px
|
|
padding 15px
|
|
.modal-header
|
|
border-bottom solid 1px borderColor
|
|
margin-bottom 10px
|
|
h1
|
|
padding 10px 0 15px
|
|
font-size 1.5em
|
|
.modal-body
|
|
p
|
|
margin-bottom 10px
|
|
.modal-footer
|
|
clearfix()
|
|
border-top solid 1px borderColor
|
|
padding-top 10px
|
|
.modal-control
|
|
float right
|
|
|
|
.EditProfileModal
|
|
height 500px
|
|
.leftPane
|
|
absolute top bottom left
|
|
width 175px
|
|
padding 20px
|
|
border-right solid 1px borderColor
|
|
.tabLabel
|
|
font-size 1.5em
|
|
margin-top 25px
|
|
margin-bottom 35px
|
|
color brandColor
|
|
.tabList button
|
|
btnStripDefault()
|
|
display block
|
|
width 100%
|
|
font-size 1.1em
|
|
padding 10px 5px
|
|
margin-bottom 15px
|
|
text-align left
|
|
.rightPane
|
|
absolute top bottom right
|
|
left 175px
|
|
padding 15px
|
|
.userInfoTab, .paswordTab
|
|
padding-top 45px
|
|
.formField
|
|
position relative
|
|
clearfix()
|
|
margin-bottom 15px
|
|
label
|
|
width 30%
|
|
display block
|
|
line-height 33px
|
|
float left
|
|
input
|
|
width 70%
|
|
display block
|
|
borderInput()
|
|
height 33px
|
|
font-size 1em
|
|
border-radius 10px
|
|
float left
|
|
.formConfirm
|
|
position relative
|
|
clearfix()
|
|
margin-bottom 15px
|
|
button
|
|
float right
|
|
btnDefault()
|
|
padding 10px 15px
|
|
border-radius 5px
|
|
font-size 1em
|
|
margin-left 5px
|
|
.alertInfo, .alertSuccess, .alertError
|
|
float right
|
|
padding 12px 10px
|
|
border-radius 5px
|
|
width 200px
|
|
font-size 1em
|
|
overflow-x hidden
|
|
white-space nowrap
|
|
transition 0.1s
|
|
&.hide
|
|
width 0
|
|
padding 12px 0
|
|
.alertInfo
|
|
alertInfo()
|
|
.alertSuccess
|
|
alertSuccess()
|
|
.alertError
|
|
alertError()
|
|
|
|
.LaunchModal
|
|
.modal-tab
|
|
text-align center
|
|
margin-bottom 10px
|
|
.btn-primary, .btn-default
|
|
margin 0
|
|
border-radius 0
|
|
border-width 1px
|
|
width 150px
|
|
border-radius 0
|
|
&:nth-child(1)
|
|
border-right solid 1px borderColor
|
|
border-top-left-radius 5px
|
|
border-bottom-left-radius 5px
|
|
&:nth-child(2)
|
|
border-left none
|
|
border-top-right-radius 5px
|
|
border-bottom-right-radius 5px
|
|
.Select
|
|
.Select-control
|
|
border-color borderColor
|
|
&.is-focused
|
|
.Select-control
|
|
border-color brandBorderColor
|
|
.Select-menu-outer
|
|
border-color borderColor
|
|
.ace_editor
|
|
border-radius 5px
|
|
border solid 1px borderColor
|
|
.CodeForm, .NoteForm
|
|
.form-group
|
|
margin-bottom 10px
|
|
.CodeForm
|
|
textarea.codeDescription
|
|
height 75px
|
|
font-size 0.9em
|
|
margin-bottom 10px
|
|
.modeSelect.Select
|
|
display inline-block
|
|
width 200px
|
|
height 37px
|
|
.Select-control
|
|
height 37px
|
|
.ace_editor
|
|
height 258px
|
|
.NoteForm
|
|
.ace_editor
|
|
height 358px
|
|
.previewMode
|
|
absolute top right
|
|
font-size 0.8em
|
|
line-height 24px
|
|
padding 5 15px
|
|
background-color transparentify(invBackgroundColor, 0.2)
|
|
color invTextColor
|
|
border-top-right-radius 5px
|
|
.marked
|
|
height 360px
|
|
overflow-x hidden
|
|
overflow-y auto
|
|
box-sizing border-box
|
|
padding 5px
|
|
border solid 1px borderColor
|
|
border-radius 5px
|
|
marked()
|
|
|
|
.PlanetCreateModal.modal, .PlanetAddUserModal.modal
|
|
padding 60px 0
|
|
.nameInput
|
|
width 80%
|
|
font-size 1.3em
|
|
margin 25px auto 15px
|
|
text-align center
|
|
.userNameSelect
|
|
width 80%
|
|
font-size 1.3em
|
|
margin 35px auto
|
|
text-align center
|
|
.formField
|
|
text-align center
|
|
margin 0 auto 25px
|
|
select
|
|
display inline-block
|
|
width 150px
|
|
height 33px
|
|
border solid 1px borderColor
|
|
background-color white
|
|
padding 0 10px
|
|
margin 0 15px
|
|
|
|
.submitButton
|
|
display block
|
|
margin 0 auto
|
|
box-sizing border-box
|
|
width 55px
|
|
height 55px
|
|
circle()
|
|
btnPrimary()
|
|
.PlanetSettingModal.modal, .PersonalSettingModal.modal
|
|
width 720px
|
|
height 500px
|
|
.settingNav
|
|
absolute top bottom left
|
|
width 200px
|
|
box-sizing border-box
|
|
padding 10px
|
|
border-right solid 1px borderColor
|
|
h1
|
|
margin 40px auto
|
|
font-size 1.5em
|
|
color brandColor
|
|
text-align center
|
|
nav
|
|
button
|
|
font-size 1em
|
|
display block
|
|
box-sizing border-box
|
|
padding 15px 15px
|
|
margin 10px 0
|
|
border none
|
|
border-radius 10px
|
|
width 100%
|
|
text-align left
|
|
background-color transparent
|
|
color textColor
|
|
cursor pointer
|
|
transition 0.1s
|
|
&:hover, &.hover
|
|
background-color hoverBackgroundColor
|
|
&:active, &.active
|
|
color brandColor
|
|
.settingBody
|
|
absolute top bottom right
|
|
left 200px
|
|
padding 15px
|
|
.PreferencesModal.modal
|
|
.settingBody
|
|
.profile
|
|
height 500px
|
|
padding-top 50px
|
|
.profileTop
|
|
box-sizing border-box
|
|
height 200px
|
|
border-bottom solid 1px borderColor
|
|
.profileBottom
|
|
margin-top 25px
|
|
height 200px
|
|
.profileFormRow
|
|
clearfix()
|
|
margin-bottom 15px
|
|
label
|
|
display block
|
|
float left
|
|
width 150px
|
|
line-height 33px
|
|
text-align left
|
|
input
|
|
float left
|
|
width 250px
|
|
.alertSuccess, .alertError, .alertInfo
|
|
float right
|
|
transition 0.1s
|
|
overflow hidden
|
|
white-space nowrap
|
|
width 200px
|
|
text-align center
|
|
&.hide
|
|
width 0
|
|
.alertSuccess
|
|
alertSuccess()
|
|
.alertError
|
|
alertError()
|
|
.alertInfo
|
|
alertInfo()
|
|
.saveButton
|
|
float right
|
|
.contact
|
|
height 500px
|
|
padding-top 50px
|
|
p
|
|
text-align left
|
|
margin-bottom 15px
|
|
line-height 140%
|
|
input
|
|
margin-bottom 15px
|
|
textarea
|
|
margin-bottom 15px
|
|
max-height 250px
|
|
.contactFormRow
|
|
clearfix()
|
|
.saveButton
|
|
float right
|
|
.alertSuccess, .alertError, .alertInfo
|
|
float right
|
|
transition 0.1s
|
|
overflow hidden
|
|
white-space nowrap
|
|
width 200px
|
|
text-align center
|
|
&.hide
|
|
width 0
|
|
.alertSuccess
|
|
alertSuccess()
|
|
.alertError
|
|
alertError()
|
|
.alertInfo
|
|
alertInfo()
|
|
.info
|
|
text-align left
|
|
.infoLabel
|
|
margin 75px 0 25px
|
|
.externalList
|
|
padding-left 10px
|
|
li
|
|
margin 15px
|
|
.logout
|
|
text-align center
|
|
.logoutLabel
|
|
margin 100px 0 25px
|
|
font-size 1.4em
|
|
.userPhoto
|
|
margin-bottom 25px
|
|
circle()
|
|
box-shadow 1px 1px 4px 0px #C5C5C5
|
|
|
|
.PlanetSettingModal.modal
|
|
.settingBody
|
|
.planetProfile
|
|
height 500px
|
|
padding-top 50px
|
|
.planetProfileForm
|
|
height 275px
|
|
box-sizing border-box
|
|
border-bottom solid 1px borderColor
|
|
.planetDeleteForm
|
|
height 225px
|
|
.planetDeleteControl
|
|
margin-top 15px
|
|
clearfix()
|
|
.toggle
|
|
float left
|
|
transition width 0.3s, color 0.1s, border-color 0.1s
|
|
overflow hidden
|
|
white-space nowrap
|
|
width 345px
|
|
height 44px
|
|
&.hide
|
|
width 0
|
|
.planetDeleteLabel
|
|
display inline-block
|
|
line-height 44px
|
|
.cancelButton
|
|
display inline-block
|
|
margin-left 15px
|
|
margin-right 0
|
|
.deleteButton
|
|
float left
|