mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-13 09:46:22 +00:00
Merge branch '0.6.0'
This commit is contained in:
Rokt33r
130
browser/styles/index.styl
Normal file
130
browser/styles/index.styl
Normal file
@@ -0,0 +1,130 @@
|
||||
$brand-color = #6AA5E9
|
||||
|
||||
$danger-color = #c9302c
|
||||
$danger-lighten-color = lighten(#c9302c, 5%)
|
||||
|
||||
// Layouts
|
||||
$statusBar-height = 24px
|
||||
$sideNav-width = 200px
|
||||
$sideNav--folded-width = 44px
|
||||
$topBar-height = 50px
|
||||
|
||||
// UI default
|
||||
$ui-text-color = #515151
|
||||
$ui-inactive-text-color = #939395
|
||||
$ui-borderColor = #D1D1D1
|
||||
$ui-backgroundColor = #FAFAFA
|
||||
$ui-border = solid 1px $ui-borderColor
|
||||
$ui-active-color = #6AA5E9
|
||||
|
||||
// UI Button
|
||||
$ui-button-color = #939395
|
||||
$ui-button--hover-backgroundColor = rgba(126, 127, 129, 0.08)
|
||||
$ui-button--active-color = white
|
||||
$ui-button--active-backgroundColor = #6AA5E9
|
||||
$ui-button--focus-borderColor = lighten(#369DCD, 25%)
|
||||
|
||||
// UI Tooltip
|
||||
$ui-tooltip-text-color = white
|
||||
$ui-tooltip-backgroundColor = alpha(#444, 70%)
|
||||
$ui-tooltip-button-backgroundColor = #D1D1D1
|
||||
$ui-tooltip-button--hover-backgroundColor = lighten(#D1D1D1, 30%)
|
||||
|
||||
// UI Input
|
||||
$ui-input--focus-borderColor = #369DCD
|
||||
$ui-input--disabled-backgroundColor = #DDD
|
||||
|
||||
/*
|
||||
* # Border
|
||||
*/
|
||||
$border-color = #D0D0D0
|
||||
$active-border-color = #369DCD
|
||||
$focus-border-color = #369DCD
|
||||
|
||||
$default-border = solid 1px $border-color
|
||||
$active-border = solid 1px $active-border-color
|
||||
|
||||
/**
|
||||
* # Button styles
|
||||
*/
|
||||
|
||||
// Default button
|
||||
$default-button-background = white
|
||||
$default-button-background--hover = #e6e6e6
|
||||
$default-button-background--active = #d4d4d4
|
||||
|
||||
colorDefaultButton()
|
||||
background-color $default-button-background
|
||||
&:hover
|
||||
background-color $default-button-background--hover
|
||||
&:active
|
||||
background-color $default-button-background--active
|
||||
&:active:hover
|
||||
background-color $default-button-background--active
|
||||
|
||||
// Primary button(Brand color)
|
||||
$primary-button-background = $brand-color
|
||||
$primary-button-background--hover = darken($brand-color, 5%)
|
||||
$primary-button-background--active = darken($brand-color, 10%)
|
||||
|
||||
colorPrimaryButton()
|
||||
color white
|
||||
background-color $primary-button-background
|
||||
&:hover
|
||||
background-color $primary-button-background--hover
|
||||
&:active
|
||||
background-color $primary-button-background--active
|
||||
&:active:hover
|
||||
background-color $primary-button-background--activ
|
||||
|
||||
// Danger button(Brand color)
|
||||
$danger-button-background = #c9302c
|
||||
$danger-button-background--hover = darken(#c9302c, 5%)
|
||||
$danger-button-background--active = darken(#c9302c, 10%)
|
||||
|
||||
colorDangerButton()
|
||||
color white
|
||||
background-color $danger-button-background
|
||||
&:hover
|
||||
background-color $danger-button-background--hover
|
||||
&:active
|
||||
background-color $danger-button-background--active
|
||||
&:active:hover
|
||||
background-color $danger-button-background--active
|
||||
|
||||
/**
|
||||
* Nav
|
||||
*/
|
||||
|
||||
navButtonColor()
|
||||
border none
|
||||
color $ui-button-color
|
||||
background-color transparent
|
||||
transition color background-color 0.15s
|
||||
&:hover
|
||||
background-color $ui-button--hover-backgroundColor
|
||||
&:active
|
||||
background-color $ui-button--active-backgroundColor
|
||||
color $ui-button--active-color
|
||||
&:active, &:active:hover
|
||||
background-color $ui-button--active-backgroundColor
|
||||
color $ui-button--active-color
|
||||
|
||||
/**
|
||||
* # Modal Stuff
|
||||
* These will be moved lib/modal
|
||||
*/
|
||||
|
||||
$modal-z-index = 1002
|
||||
$modal-background = white
|
||||
$modal-margin = 64px auto 64px
|
||||
$modal-border-radius = 5px
|
||||
|
||||
modal()
|
||||
position relative
|
||||
z-index $modal-z-index
|
||||
width 100%
|
||||
background-color $modal-background
|
||||
overflow hidden
|
||||
border-radius $modal-border-radius
|
||||
box-shadow 2px 2px 10px gray
|
||||
@@ -1,393 +0,0 @@
|
||||
noTagsColor = #999
|
||||
|
||||
infoButton()
|
||||
display inline-block
|
||||
border-radius 16.5px
|
||||
cursor pointer
|
||||
height 33px
|
||||
width 33px
|
||||
line-height 33px
|
||||
margin-right 5px
|
||||
font-size 18px
|
||||
color inactiveTextColor
|
||||
background-color white
|
||||
padding 0
|
||||
border 1px solid white
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
&:hover
|
||||
color inherit
|
||||
|
||||
.ArticleDetail
|
||||
absolute right bottom
|
||||
top 60px
|
||||
left 450px
|
||||
padding 10px
|
||||
background-color #E6E6E6
|
||||
border-top 1px solid borderColor
|
||||
&.empty
|
||||
.ArticleDetail-empty-box
|
||||
line-height 72px
|
||||
font-size 42px
|
||||
height 320px
|
||||
display flex
|
||||
align-items center
|
||||
.ArticleDetail-empty-box-message
|
||||
text-align center
|
||||
width 100%
|
||||
color inactiveTextColor
|
||||
.ArticleDetail-info
|
||||
height 70px
|
||||
width 100%
|
||||
font-size 12px
|
||||
user-select none
|
||||
&>.tutorial
|
||||
position fixed
|
||||
z-index 35
|
||||
.ArticleDetail-info-folder
|
||||
display inline-block
|
||||
max-width 100px
|
||||
overflow ellipsis
|
||||
height 10px
|
||||
width 150px
|
||||
height 27px
|
||||
outline none
|
||||
background-color darken(white, 5%)
|
||||
border 1px solid transparent
|
||||
&:hover
|
||||
background-color white
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
&>.tutorial
|
||||
position fixed
|
||||
z-index 35
|
||||
.ArticleDetail-info-status
|
||||
padding 0 5px
|
||||
.unsaved-mark
|
||||
color brandColor
|
||||
.ArticleDetail-info-control
|
||||
float right
|
||||
clearfix
|
||||
.ShareButton
|
||||
display block
|
||||
float left
|
||||
&>button, .ShareButton-open-button
|
||||
infoButton()
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-top 30px
|
||||
&:hover
|
||||
.tooltip
|
||||
opacity 1
|
||||
&>button
|
||||
float left
|
||||
&:nth-child(1) .tooltip
|
||||
margin-left -65px
|
||||
.ArticleDetail-info-control-delete-button
|
||||
.tooltip
|
||||
right 5px
|
||||
.ArticleDetail-info-control-save
|
||||
float left
|
||||
width 80px
|
||||
margin-right 5px
|
||||
overflow hidden
|
||||
transition width 0.15s ease-in-out
|
||||
border-radius 16.5px
|
||||
&.hide
|
||||
width 0px
|
||||
opacity 0.2
|
||||
.ArticleDetail-info-control-save-button
|
||||
infoButton()
|
||||
background-color brandColor
|
||||
color white
|
||||
font-size 12px
|
||||
width 100%
|
||||
border 1px solid brandBorderColor
|
||||
white-space nowrap
|
||||
.fa
|
||||
font-size 18px
|
||||
&:hover
|
||||
color white
|
||||
background-color lighten(brandColor, 15%)
|
||||
&:focus
|
||||
color white
|
||||
background-color lighten(brandColor, 15%)
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-top 30px
|
||||
margin-left -90px
|
||||
&:hover .tooltip
|
||||
opacity 1
|
||||
|
||||
.ShareButton-open-button .tooltip
|
||||
margin-left -40px
|
||||
.ShareButton-dropdown
|
||||
position fixed
|
||||
width 185px
|
||||
z-index 35
|
||||
background-color #F0F0F0
|
||||
padding 4px 0
|
||||
border-radius 5px
|
||||
right 5px
|
||||
top 95px
|
||||
box-shadow 0px 0px 10px 1px alpha(#bbb, 0.8)
|
||||
border 1px solid #bcbcbc
|
||||
&.hide
|
||||
display none
|
||||
&>button
|
||||
background-color transparent
|
||||
height 21px
|
||||
width 100%
|
||||
border none
|
||||
padding-left 20px
|
||||
text-align left
|
||||
font-size 13px
|
||||
font-family '.HelveticaNeueDeskInterface-Regular', sans-serif
|
||||
&:hover
|
||||
background-color #4297FE
|
||||
color white
|
||||
.ShareButton-url
|
||||
height 40px
|
||||
width 100%
|
||||
position relative
|
||||
padding 0 5px
|
||||
.ShareButton-url-input
|
||||
height 21px
|
||||
border none
|
||||
width 143px
|
||||
float left
|
||||
border-top-left-radius 3px
|
||||
border-bottom-left-radius 3px
|
||||
border 1px solid borderColor
|
||||
border-right none
|
||||
.ShareButton-url-button
|
||||
height 21px
|
||||
border none
|
||||
width 30px
|
||||
float left
|
||||
background-color #F0F0F0
|
||||
border-top-right-radius 3px
|
||||
border-bottom-right-radius 3px
|
||||
border 1px solid borderColor
|
||||
.ShareButton-url-button-tooltip
|
||||
tooltip()
|
||||
right 10px
|
||||
margin-top 5px
|
||||
&:hover
|
||||
.ShareButton-url-button-tooltip
|
||||
opacity 1
|
||||
&:active
|
||||
background-color #4297FE
|
||||
color white
|
||||
.ShareButton-url-alert
|
||||
padding 10px
|
||||
line-height 16px
|
||||
|
||||
|
||||
.ArticleDetail-info-row2
|
||||
.tutorial
|
||||
position fixed
|
||||
z-index 35
|
||||
font-style italic
|
||||
.TagSelect
|
||||
margin-top 5px
|
||||
.TagSelect-tags
|
||||
white-space nowrap
|
||||
overflow-x auto
|
||||
position relative
|
||||
noSelect()
|
||||
z-index 30
|
||||
background-color #E6E6E6
|
||||
clearfix()
|
||||
.TagSelect-tags-item
|
||||
background-color transparent
|
||||
color white
|
||||
margin 0 2px
|
||||
padding 0
|
||||
height 17px
|
||||
float left
|
||||
button.TagSelect-tags-item-remove
|
||||
display block
|
||||
float left
|
||||
background-color transparent
|
||||
border none
|
||||
font-size 8px
|
||||
color white
|
||||
width 15px
|
||||
height 17px
|
||||
text-align center
|
||||
line-height 12px
|
||||
padding 0
|
||||
margin 0
|
||||
border-top solid 1px darken(brandColor, 5%)
|
||||
border-bottom solid 1px darken(brandColor, 5%)
|
||||
border-left solid 1px darken(brandColor, 5%)
|
||||
border-right solid 1px transparent
|
||||
border-radius left 2px
|
||||
background-color brandColor
|
||||
&:hover
|
||||
background-color lighten(brandColor, 10%)
|
||||
border-color lighten(brandColor, 10%)
|
||||
&:focus
|
||||
background-color lighten(brandColor, 10%)
|
||||
border-color focusBorderColor
|
||||
.TagSelect-tags-item-label
|
||||
background-color brandColor
|
||||
float left
|
||||
font-size 12px
|
||||
border-top solid 1px darken(brandColor, 5%)
|
||||
border-bottom solid 1px darken(brandColor, 5%)
|
||||
border-right solid 1px darken(brandColor, 5%)
|
||||
line-height 15px
|
||||
padding 0 5px
|
||||
border-radius right 2px
|
||||
input.TagSelect-input
|
||||
background-color transparent
|
||||
border none
|
||||
border-bottom 1px solid transparent
|
||||
outline none
|
||||
margin 0 2px
|
||||
transition 0.15s
|
||||
height 18px
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
.TagSelect-suggest
|
||||
position fixed
|
||||
width 150px
|
||||
max-height 150px
|
||||
background-color white
|
||||
z-index 50
|
||||
border 1px solid borderColor
|
||||
border-radius 5px
|
||||
overflow-y auto
|
||||
&>button
|
||||
width 100%
|
||||
display block
|
||||
padding 0 15px
|
||||
height 33px
|
||||
line-height 33px
|
||||
background-color transparent
|
||||
border none
|
||||
text-align left
|
||||
font-size 14px
|
||||
&:hover
|
||||
background-color darken(white, 10%)
|
||||
.ArticleDetail-panel
|
||||
position absolute
|
||||
top 70px
|
||||
left 10px
|
||||
right 10px
|
||||
bottom 10px
|
||||
overflow-x hidden
|
||||
overflow-y auto
|
||||
background-color white
|
||||
border-radius 5px
|
||||
border solid 1px lighten(borderColor, 15%)
|
||||
&>.ArticleDetail-panel-header
|
||||
display block
|
||||
height 60px
|
||||
&>.tutorial
|
||||
fixed right
|
||||
z-index 35
|
||||
font-style italic
|
||||
.ArticleDetail-panel-header-mode
|
||||
z-index 30
|
||||
background-color white
|
||||
absolute top bottom
|
||||
right 10px
|
||||
display block
|
||||
height 33px
|
||||
margin-top 14px
|
||||
width 120px
|
||||
margin-right 15px
|
||||
border solid 1px borderColor
|
||||
border-radius 5px
|
||||
transition width 0.15s
|
||||
user-select none
|
||||
&.idle
|
||||
cursor pointer
|
||||
&:hover
|
||||
background-color darken(white, 5%)
|
||||
.ModeIcon
|
||||
padding 0 5px
|
||||
line-height 33px
|
||||
&.edit
|
||||
border-color focusBorderColor
|
||||
input
|
||||
width 120px
|
||||
line-height 31px
|
||||
padding 0 10px
|
||||
border none
|
||||
outline none
|
||||
background-color transparent
|
||||
font-size 14px
|
||||
.ModeSelect-options
|
||||
position fixed
|
||||
width 120px
|
||||
z-index 10
|
||||
border 1px solid borderColor
|
||||
border-radius 5px
|
||||
background-color white
|
||||
max-height 250px
|
||||
overflow-y auto
|
||||
margin-top 5px
|
||||
.ModeSelect-options-item
|
||||
height 33px
|
||||
line-height 33px
|
||||
cursor pointer
|
||||
&.active, &:hover.active
|
||||
background-color brandColor
|
||||
color white
|
||||
.ModeIcon
|
||||
width 30px
|
||||
text-align center
|
||||
display inline-block
|
||||
&:hover
|
||||
background-color darken(white, 10%)
|
||||
.ArticleDetail-panel-header-title
|
||||
absolute left top
|
||||
right 145px
|
||||
padding 0 15px
|
||||
background-color transparent
|
||||
input
|
||||
border none
|
||||
line-height 60px
|
||||
width 100%
|
||||
font-size 24px
|
||||
outline none
|
||||
.ArticleEditor
|
||||
absolute left right bottom
|
||||
top 60px
|
||||
.ArticleDetail-panel-content-tooltip
|
||||
absolute bottom right
|
||||
height 24px
|
||||
background-color alpha(black, 0.5)
|
||||
line-height 24px
|
||||
color white
|
||||
padding 0 15px
|
||||
opacity 0
|
||||
transition 0.1s
|
||||
z-index 35
|
||||
&:hover .ArticleDetail-panel-content-tooltip
|
||||
opacity 1
|
||||
.MarkdownPreview
|
||||
absolute top left right bottom
|
||||
marked()
|
||||
box-sizing border-box
|
||||
padding 5px 15px
|
||||
border-top solid 1px borderColor
|
||||
overflow-y auto
|
||||
user-select all
|
||||
&.empty
|
||||
color lighten(inactiveTextColor, 10%)
|
||||
user-select none
|
||||
font-size 14px
|
||||
&.lineNumbered
|
||||
.lineNumber
|
||||
display block
|
||||
.CodeEditor
|
||||
absolute top left right bottom
|
||||
border-top solid 1px borderColor
|
||||
min-height 300px
|
||||
border-bottom-left-radius 5px
|
||||
border-bottom-right-radius 5px
|
||||
@@ -1,105 +0,0 @@
|
||||
articleItemHoverBgColor = darken(white, 5%)
|
||||
articleItemColor = #777
|
||||
|
||||
.ArticleList
|
||||
absolute bottom
|
||||
top 60px
|
||||
left 200px
|
||||
width 250px
|
||||
border-top 1px solid borderColor
|
||||
border-right 1px solid borderColor
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
overflow-y auto
|
||||
noSelect()
|
||||
&>div
|
||||
.ArticleList-item
|
||||
border solid 2px transparent
|
||||
position relative
|
||||
min-height 110px
|
||||
width 100%
|
||||
cursor pointer
|
||||
transition 0.1s
|
||||
background-color white
|
||||
padding 0 10px
|
||||
font-size 12px
|
||||
.ArticleList-item-top
|
||||
clearfix()
|
||||
padding-top 2px
|
||||
line-height 18px
|
||||
height 20px
|
||||
color articleItemColor
|
||||
font-size 11px
|
||||
i
|
||||
margin-right 4px
|
||||
.folderName
|
||||
overflow ellipsis
|
||||
display inline-block
|
||||
width 120px
|
||||
.updatedAt
|
||||
float right
|
||||
line-height 18px
|
||||
.unsaved-mark
|
||||
color brandColor
|
||||
.ArticleList-item-middle
|
||||
font-size 16px
|
||||
position relative
|
||||
padding-top 6px
|
||||
height 22px
|
||||
.mode
|
||||
position absolute
|
||||
left 0
|
||||
font-size 12px
|
||||
line-height 16px
|
||||
.title
|
||||
position absolute
|
||||
left 19px
|
||||
right 0
|
||||
overflow ellipsis
|
||||
small
|
||||
color #AAA
|
||||
.ArticleList-item-middle2
|
||||
padding-top 8px
|
||||
pre
|
||||
color lighten(inactiveTextColor, 10%)
|
||||
white-space pre-wrap
|
||||
overflow hidden
|
||||
height 33px
|
||||
line-height 14px
|
||||
font-size 10px
|
||||
code
|
||||
font-family Monaco, Menlo, 'Ubuntu Mono', Consolas, source-code-pro, monospace
|
||||
.ArticleList-item-bottom
|
||||
padding-bottom 5px
|
||||
.tags
|
||||
color articleItemColor
|
||||
line-height 18px
|
||||
word-wrap break-word
|
||||
clearfix()
|
||||
i.fa-tags
|
||||
display inline
|
||||
float left
|
||||
padding 2px 2px 0 0
|
||||
height 14px
|
||||
line-height 13px
|
||||
a
|
||||
background-color brandColor
|
||||
float left
|
||||
color white
|
||||
border-radius 2px
|
||||
padding 1px 5px
|
||||
margin 2px
|
||||
height 14px
|
||||
line-height 13px
|
||||
font-size 10px
|
||||
opacity 0.8
|
||||
&:hover
|
||||
opacity 1
|
||||
&:hover, &.hover
|
||||
background-color articleItemHoverBgColor
|
||||
&:active, &.active
|
||||
background-color white
|
||||
&:active, &.active
|
||||
border-color brandBorderColor
|
||||
.divider
|
||||
border-bottom solid 1px borderColor
|
||||
@@ -1,213 +0,0 @@
|
||||
articleNavBgColor = #353535
|
||||
articleCount = #999
|
||||
|
||||
.ArticleNavigator
|
||||
background-color articleNavBgColor
|
||||
absolute top bottom left
|
||||
width 200px
|
||||
border-right 1px solid borderColor
|
||||
color white
|
||||
user-select none
|
||||
.userInfo
|
||||
height 60px
|
||||
display block
|
||||
box-sizing content-box
|
||||
border-bottom 1px solid borderColor
|
||||
.userProfileName
|
||||
color brandColor
|
||||
font-size 28px
|
||||
padding 6px 37px 0 10px
|
||||
white-space nowrap
|
||||
text-overflow ellipsis
|
||||
overflow hidden
|
||||
.userName
|
||||
color white
|
||||
padding-left 20px
|
||||
margin-top 3px
|
||||
.tutorial
|
||||
position fixed
|
||||
z-index 35
|
||||
top 0
|
||||
left 0
|
||||
pointer-event none
|
||||
font-style italic
|
||||
transition 0.1s
|
||||
&.hide
|
||||
opacity 0
|
||||
.settingBtn
|
||||
width 22px
|
||||
height 22px
|
||||
line-height 22px
|
||||
border-radius 11px
|
||||
position absolute
|
||||
top 19px
|
||||
right 14px
|
||||
color white
|
||||
padding 0
|
||||
background-color transparent
|
||||
border 1px solid white
|
||||
z-index 31
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-top -5px
|
||||
margin-left 10px
|
||||
&:hover
|
||||
.tooltip
|
||||
opacity 1
|
||||
&:active
|
||||
background-color brandColor
|
||||
border-color brandColor
|
||||
.ArticleNavigator-unsaved
|
||||
position absolute
|
||||
top 100px
|
||||
width 100%
|
||||
height 225px
|
||||
transition opacity 0.2s ease-in-out
|
||||
&.hide
|
||||
opacity 0.2
|
||||
.ArticleNavigator-unsaved-header
|
||||
border-bottom 1px solid alpha(borderColor, 0.5)
|
||||
padding-bottom 5px
|
||||
clearfix()
|
||||
position relative
|
||||
padding-left 10px
|
||||
font-size 18px
|
||||
line-height 22px
|
||||
.ArticleNavigator-unsaved-list
|
||||
height 165px
|
||||
padding 5px 0
|
||||
overflow-y scroll
|
||||
.ArticleNavigator-unsaved-list-item
|
||||
height 33px
|
||||
padding-left 15px
|
||||
clearfix()
|
||||
transition 0.1s
|
||||
cursor pointer
|
||||
overflow hidden
|
||||
&:hover
|
||||
background-color alpha(white, 0.05)
|
||||
&.active, &:active
|
||||
background-color alpha(lighten(brandColor, 25%), 70%)
|
||||
.ArticleNavigator-unsaved-list-item-label
|
||||
float left
|
||||
width 151px
|
||||
line-height 33px
|
||||
overflow ellipsis
|
||||
.ArticleNavigator-unsaved-list-item-label-untitled
|
||||
color inactiveTextColor
|
||||
.ArticleNavigator-unsaved-list-item-discard-button
|
||||
float right
|
||||
width 33px
|
||||
line-height 30px
|
||||
height 33px
|
||||
border none
|
||||
background-color transparent
|
||||
color white
|
||||
font-size 18px
|
||||
opacity 0.5
|
||||
&:hover
|
||||
opacity 1
|
||||
.ArticleNavigator-unsaved-list-empty
|
||||
height 33px
|
||||
padding-left 15px
|
||||
color alpha(white, 0.4)
|
||||
transition 0.1s
|
||||
line-height 33px
|
||||
&:hover
|
||||
color alpha(white, 0.6)
|
||||
.ArticleNavigator-unsaved-control
|
||||
absolute bottom
|
||||
height 33px
|
||||
border-top 1px solid alpha(borderColor, 0.5)
|
||||
width 100%
|
||||
.ArticleNavigator-unsaved-control-save-all-button
|
||||
border none
|
||||
background-color transparent
|
||||
font-size 14px
|
||||
color brandColor
|
||||
padding-left 15px
|
||||
width 100%
|
||||
height 33px
|
||||
text-align left
|
||||
&:hover
|
||||
color lighten(brandColor, 15%)
|
||||
background-color alpha(white, 0.05)
|
||||
&:active
|
||||
color white
|
||||
&:disabled
|
||||
color alpha(brandColor, 0.5)
|
||||
&:hover
|
||||
color alpha(lighten(brandColor, 25%), 0.5)
|
||||
background-color transparent
|
||||
|
||||
|
||||
.ArticleNavigator-folders
|
||||
absolute bottom
|
||||
top 365px
|
||||
width 100%
|
||||
transition top 0.15s ease-in-out
|
||||
background-color articleNavBgColor
|
||||
.tutorial
|
||||
position fixed
|
||||
z-index 35
|
||||
font-style italic
|
||||
&.expand
|
||||
top 100px
|
||||
.ArticleNavigator-folders-header
|
||||
border-bottom 1px solid alpha(borderColor, 0.5)
|
||||
padding-bottom 5px
|
||||
clearfix()
|
||||
position relative
|
||||
z-index 30
|
||||
.title
|
||||
float left
|
||||
padding-left 10px
|
||||
font-size 18px
|
||||
line-height 22px
|
||||
.addBtn
|
||||
float right
|
||||
margin-right 15px
|
||||
width 22px
|
||||
height 22px
|
||||
font-size 10px
|
||||
padding 0
|
||||
line-height 22px
|
||||
border 1px solid white
|
||||
border-radius 11px
|
||||
background-color transparent
|
||||
color white
|
||||
padding 0
|
||||
font-weight bold
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-top -6px
|
||||
margin-left 11px
|
||||
&:hover
|
||||
.tooltip
|
||||
opacity 1
|
||||
&:active
|
||||
background-color brandColor
|
||||
border-color brandColor
|
||||
.folderList
|
||||
absolute bottom
|
||||
top 33px
|
||||
overflow-y auto
|
||||
.folderList button
|
||||
height 33px
|
||||
width 199px
|
||||
border none
|
||||
text-align left
|
||||
font-size 14px
|
||||
background-color transparent
|
||||
color white
|
||||
padding-left 15px
|
||||
overflow ellipsis
|
||||
&:hover
|
||||
background-color alpha(white, 0.05)
|
||||
&.active, &:active
|
||||
background-color alpha(lighten(brandColor, 25%), 70%)
|
||||
.articleCount
|
||||
color white
|
||||
.articleCount
|
||||
color articleCount
|
||||
font-size 12px
|
||||
@@ -1,224 +0,0 @@
|
||||
bgColor = #E6E6E6
|
||||
inputBgColor = white
|
||||
|
||||
topBarBtnColor = #B3B3B3
|
||||
topBarBtnBgColor = #B3B3B3
|
||||
topBarBtnBgActiveColor = #3A3A3A
|
||||
|
||||
infoBtnColor = bgColor
|
||||
infoBtnBgColor = #B3B3B3
|
||||
infoBtnActiveBgColor = #3A3A3A
|
||||
|
||||
.ArticleTopBar
|
||||
absolute top right
|
||||
left 200px
|
||||
height 60px
|
||||
background-color bgColor
|
||||
user-select none
|
||||
&>.tutorial
|
||||
.clickJammer
|
||||
fixed top left bottom right
|
||||
z-index 40
|
||||
background transparent
|
||||
.global
|
||||
fixed bottom right
|
||||
height 100px
|
||||
z-index 35
|
||||
font-style italic
|
||||
.finder
|
||||
fixed bottom right
|
||||
height 250px
|
||||
left 50%
|
||||
margin-left -250px
|
||||
z-index 35
|
||||
font-style italic
|
||||
.back
|
||||
fixed top left bottom right
|
||||
z-index 20
|
||||
background-color transparentify(black, 80%)
|
||||
&>.ArticleTopBar-left
|
||||
float left
|
||||
&>.tutorial
|
||||
fixed top
|
||||
left 100px
|
||||
top 30px
|
||||
z-index 36
|
||||
font-style italic
|
||||
&>.ArticleTopBar-left-search
|
||||
position relative
|
||||
float left
|
||||
height 33px
|
||||
margin-top 13.5px
|
||||
margin-left 15px
|
||||
width 350px
|
||||
padding 5px 15px
|
||||
transition 0.1s
|
||||
font-size 16px
|
||||
border 1px solid transparent
|
||||
z-index 30
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-left -24px
|
||||
margin-top 35px
|
||||
opacity 1
|
||||
&.hide
|
||||
opacity 0
|
||||
ul
|
||||
li
|
||||
line-height 18px
|
||||
li:last-child
|
||||
line-height 10px
|
||||
margin-bottom 3px
|
||||
small
|
||||
font-size 10px
|
||||
position relative
|
||||
top -2px
|
||||
margin-left 15px
|
||||
input
|
||||
absolute top left
|
||||
width 350px
|
||||
border-radius 16.5px
|
||||
background-color inputBgColor
|
||||
border 1px solid transparent
|
||||
padding-left 35px
|
||||
outline none
|
||||
font-size 14px
|
||||
height 33px
|
||||
line-height 33px
|
||||
z-index 0
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
i.fa.fa-search
|
||||
position absolute
|
||||
display block
|
||||
top 0
|
||||
left 10px
|
||||
line-height 33px
|
||||
z-index 1
|
||||
pointer-events none
|
||||
.ArticleTopBar-left-search-clear-button
|
||||
position absolute
|
||||
top 6px
|
||||
right 10px
|
||||
width 20px
|
||||
height 20px
|
||||
border-radius 10px
|
||||
border none
|
||||
background-color transparent
|
||||
color topBarBtnColor
|
||||
transition 0.1s
|
||||
line-height 20px
|
||||
text-align center
|
||||
padding 0
|
||||
&:focus
|
||||
color textColor
|
||||
&:hover
|
||||
color white
|
||||
background-color topBarBtnBgColor
|
||||
&:active
|
||||
color white
|
||||
background-color darken(topBarBtnBgColor, 35%)
|
||||
.ArticleTopBar-left-control
|
||||
line-height 33px
|
||||
float left
|
||||
height 33px
|
||||
margin-top 13.5px
|
||||
margin-left 20px
|
||||
.tutorial
|
||||
fixed top
|
||||
left 200px
|
||||
z-index 36
|
||||
font-style italic
|
||||
button.ArticleTopBar-left-control-new-post-button
|
||||
position fixed
|
||||
background bgColor
|
||||
font-size 20px
|
||||
border none
|
||||
outline none
|
||||
color inactiveTextColor
|
||||
width 33px
|
||||
height 33px
|
||||
border-radius 16.5px
|
||||
transition 0.1s
|
||||
border 1px solid transparent
|
||||
z-index 30
|
||||
&:hover
|
||||
color textColor
|
||||
&:active
|
||||
color textColor
|
||||
background-color lighten(topBarBtnBgColor, 15%)
|
||||
&:disabled
|
||||
color inactiveTextColor
|
||||
background transparent
|
||||
&:focus
|
||||
color textColor
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-left -80px
|
||||
margin-top 40px
|
||||
&:hover
|
||||
.tooltip
|
||||
opacity 1
|
||||
&>.ArticleTopBar-right
|
||||
float right
|
||||
&>button
|
||||
display block
|
||||
position absolute
|
||||
right 74px
|
||||
top 20px
|
||||
width 20px
|
||||
height 20px
|
||||
font-size 14px
|
||||
line-height 14px
|
||||
background-color infoBtnBgColor
|
||||
color bgColor
|
||||
border-radius 11px
|
||||
border 1px solid bgColor
|
||||
transition 0.1s
|
||||
&:focus
|
||||
background-color lighten(infoBtnActiveBgColor, 15%)
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-left -50px
|
||||
margin-top 20px
|
||||
&:hover
|
||||
background-color infoBtnActiveBgColor
|
||||
.tooltip
|
||||
opacity 1
|
||||
|
||||
&>.ArticleTopBar-right-links-button
|
||||
display block
|
||||
position absolute
|
||||
top 8px
|
||||
right 15px
|
||||
opacity 0.7
|
||||
border-radius 23px
|
||||
height 46px
|
||||
width 46px
|
||||
border 1px solid transparent
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
&:hover
|
||||
opacity 1
|
||||
.tooltip
|
||||
opacity 1
|
||||
&>.ArticleTopBar-right-links-button-dropdown
|
||||
position fixed
|
||||
z-index 50
|
||||
right 10px
|
||||
top 40px
|
||||
background-color transparentify(invBackgroundColor, 80%)
|
||||
padding 5px 0
|
||||
.ArticleTopBar-right-links-button-dropdown-item
|
||||
padding 0 10px
|
||||
height 33px
|
||||
width 100%
|
||||
display block
|
||||
line-height 33px
|
||||
text-decoration none
|
||||
color white
|
||||
&:hover
|
||||
background-color transparentify(lighten(invBackgroundColor, 30%), 80%)
|
||||
|
||||
|
||||
|
||||
@@ -1,86 +0,0 @@
|
||||
userNavigatorBgColor = #1B1C1C
|
||||
userNavigatorColor = #DDD
|
||||
userAnchorColor = #979797
|
||||
userAnchorBgColor = #BEBEBE
|
||||
userAnchorActiveColor = textColor
|
||||
userAnchorActiveBgColor = white
|
||||
|
||||
.UserNavigator
|
||||
noSelect()
|
||||
background-color userNavigatorBgColor
|
||||
absolute left top bottom
|
||||
width 60px
|
||||
text-align center
|
||||
box-sizing border-box
|
||||
ul.userList
|
||||
position absolute
|
||||
top 25px
|
||||
left 0
|
||||
right 0
|
||||
bottom 70px
|
||||
// overflow-y auto
|
||||
&>li
|
||||
a
|
||||
display block
|
||||
width 38px
|
||||
height 64px
|
||||
margin 0 auto 10px
|
||||
text-align center
|
||||
text-decoration none
|
||||
color userAnchorColor
|
||||
line-height 44px
|
||||
font-size 1.1em
|
||||
cursor pointer
|
||||
transition 0.1s
|
||||
|
||||
img.ProfileImage
|
||||
width 38px
|
||||
height 38px
|
||||
border-radius 22px
|
||||
opacity 0.7
|
||||
&:hover
|
||||
img.ProfileImage
|
||||
opacity 1
|
||||
.userTooltip
|
||||
opacity 1
|
||||
&.active
|
||||
img.ProfileImage
|
||||
opacity 1
|
||||
.userTooltip
|
||||
tooltip()
|
||||
position absolute
|
||||
margin-top -52px
|
||||
margin-left 44px
|
||||
.keyLabel
|
||||
margin-top -25px
|
||||
font-size 0.8em
|
||||
color userNavigatorColor
|
||||
button.createTeamBtn
|
||||
display block
|
||||
margin 0 auto
|
||||
width 30px
|
||||
height 30px
|
||||
border-radius 15px
|
||||
border 2px solid darken(white, 5%)
|
||||
color darken(white, 5%)
|
||||
text-align center
|
||||
background-image none
|
||||
background-color transparent
|
||||
box-sizing border-box
|
||||
absolute left right
|
||||
bottom 15px
|
||||
font-size 22px
|
||||
line-height 22px
|
||||
transition 0.1s
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-top -26px
|
||||
margin-left 30px
|
||||
&:hover, &.hover, &:focus, &.focus
|
||||
color white
|
||||
border-color white
|
||||
.tooltip
|
||||
opacity 1
|
||||
&:active
|
||||
background-color brandColor
|
||||
border-color brandColor
|
||||
@@ -1,13 +1,6 @@
|
||||
@import '../../../node_modules/nib/lib/nib'
|
||||
@import '../vars'
|
||||
@import '../mixins/*'
|
||||
global-reset()
|
||||
@import '../shared/*'
|
||||
@import './ArticleNavigator'
|
||||
@import './ArticleTopBar'
|
||||
@import './ArticleList'
|
||||
@import './ArticleDetail'
|
||||
@import './modal/*'
|
||||
@import '../theme/*'
|
||||
|
||||
DEFAULT_FONTS = 'Lato', helvetica, arial, sans-serif
|
||||
@@ -96,63 +89,25 @@ textarea.block-input
|
||||
#content
|
||||
fullsize()
|
||||
|
||||
.Main
|
||||
.appUpdateButton
|
||||
position fixed
|
||||
z-index 2000
|
||||
bottom 5px
|
||||
right 53px
|
||||
padding 10px 15px
|
||||
border none
|
||||
border-radius 5px
|
||||
background-color brandColor
|
||||
color white
|
||||
opacity 0.7
|
||||
&:hover
|
||||
opacity 1
|
||||
background-color lighten(brandColor, 10%)
|
||||
.contactButton
|
||||
position fixed
|
||||
z-index 2000
|
||||
bottom 5px
|
||||
right 5px
|
||||
padding 10px 15px
|
||||
border none
|
||||
border-radius 5px
|
||||
background-color brandColor
|
||||
color white
|
||||
opacity 0.7
|
||||
&:hover
|
||||
opacity 1
|
||||
background-color lighten(brandColor, 10%)
|
||||
.tooltip
|
||||
tooltip()
|
||||
margin-top -22px
|
||||
margin-left -107px
|
||||
&:hover .tooltip
|
||||
opacity 1
|
||||
modalZIndex= 1000
|
||||
modalBackColor = transparentify(black, 65%)
|
||||
|
||||
.OSSAnnounceModal
|
||||
height 250
|
||||
text-align center
|
||||
.OSSAnnounceModal-title
|
||||
font-size 32px
|
||||
padding 45px 0
|
||||
|
||||
.OSSAnnounceModal-link
|
||||
display block
|
||||
font-size 20px
|
||||
margin 25px 0 65px
|
||||
.OSSAnnounceModal-closeBtn
|
||||
display block
|
||||
margin 0 auto
|
||||
border none
|
||||
.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
|
||||
background-color white
|
||||
padding 15px
|
||||
color #666666
|
||||
border-radius 5px
|
||||
width 150px
|
||||
height 33px
|
||||
background-color brandColor
|
||||
color white
|
||||
opacity 0.7
|
||||
&:hover
|
||||
opacity 1
|
||||
background-color lighten(brandColor, 10%)
|
||||
|
||||
|
||||
@@ -1,91 +0,0 @@
|
||||
tabNavColor = #999999
|
||||
iptFocusBorderColor = #369DCD
|
||||
|
||||
.CreateNewFolder.modal
|
||||
width 600px
|
||||
height 450px
|
||||
.closeBtn
|
||||
position absolute
|
||||
top 15px
|
||||
right 15px
|
||||
width 33px
|
||||
height 33px
|
||||
font-size 18px
|
||||
line-height 33px
|
||||
padding 0
|
||||
text-align center
|
||||
background-color transparent
|
||||
border none
|
||||
color stripBtnColor
|
||||
&:hover
|
||||
color stripHoverBtnColor
|
||||
.title
|
||||
font-size 32px
|
||||
text-align center
|
||||
font-weight bold
|
||||
margin-top 25px
|
||||
.ipt
|
||||
display block
|
||||
width 330px
|
||||
font-size 14px
|
||||
height 44px
|
||||
line-height 44px
|
||||
padding 0 15px
|
||||
border-radius 5px
|
||||
border solid 1px borderColor
|
||||
outline none
|
||||
margin 75px auto 20px
|
||||
&:focus
|
||||
border-color iptFocusBorderColor
|
||||
.colorSelect
|
||||
text-align center
|
||||
.option
|
||||
cursor pointer
|
||||
font-size 22px
|
||||
height 48px
|
||||
width 48px
|
||||
margin 0 2px
|
||||
border 1px solid transparent
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
line-height 45px
|
||||
text-align center
|
||||
transition 0.1s
|
||||
display inline-block
|
||||
&:hover
|
||||
border-color borderColor
|
||||
font-size 28px
|
||||
&.active
|
||||
font-size 28px
|
||||
border-color iptFocusBorderColor
|
||||
.alert
|
||||
color infoTextColor
|
||||
background-color infoBackgroundColor
|
||||
font-size 14px
|
||||
padding 15px 15px
|
||||
width 330px
|
||||
border-radius 5px
|
||||
margin 15px auto 0
|
||||
&.error
|
||||
color errorTextColor
|
||||
background-color errorBackgroundColor
|
||||
.confirmBtn
|
||||
display block
|
||||
position absolute
|
||||
left 205px
|
||||
bottom 44px
|
||||
width 240px
|
||||
font-size 24px
|
||||
height 44px
|
||||
line-height 24px
|
||||
font-weight bold
|
||||
background-color brandColor
|
||||
color white
|
||||
border none
|
||||
border-radius 5px
|
||||
margin 0 auto
|
||||
transition 0.1s
|
||||
&:hover
|
||||
transform scale(1.1)
|
||||
&:disabled
|
||||
opacity 0.7
|
||||
@@ -1,199 +0,0 @@
|
||||
tabNavColor = #999999
|
||||
iptFocusBorderColor = #369DCD
|
||||
stripHoverBtnColor = #333
|
||||
stripBtnColor = lighten(stripHoverBtnColor, 35%)
|
||||
|
||||
.CreateNewTeam.modal
|
||||
width 600px
|
||||
height 450px
|
||||
.closeBtn
|
||||
position absolute
|
||||
top 15px
|
||||
right 15px
|
||||
width 33px
|
||||
height 33px
|
||||
font-size 18px
|
||||
line-height 33px
|
||||
padding 0
|
||||
text-align center
|
||||
background-color transparent
|
||||
border none
|
||||
color stripBtnColor
|
||||
&:hover
|
||||
color stripHoverBtnColor
|
||||
.title
|
||||
font-size 32px
|
||||
text-align center
|
||||
font-weight bold
|
||||
margin-top 25px
|
||||
.ipt
|
||||
display block
|
||||
width 330px
|
||||
font-size 14px
|
||||
height 44px
|
||||
line-height 44px
|
||||
padding 0 15px
|
||||
border-radius 5px
|
||||
border solid 1px borderColor
|
||||
outline none
|
||||
&:focus
|
||||
border-color iptFocusBorderColor
|
||||
.alert
|
||||
padding 0 15px
|
||||
height 44px
|
||||
line-height 44px
|
||||
width 300px
|
||||
margin 0 auto
|
||||
border-radius 5px
|
||||
color infoTextColor
|
||||
background-color infoBackgroundColor
|
||||
white-space nowrap
|
||||
overflow-x auto
|
||||
&.error
|
||||
color errorTextColor
|
||||
background-color errorBackgroundColor
|
||||
.confirmBtn
|
||||
display block
|
||||
position absolute
|
||||
left 180px
|
||||
bottom 44px
|
||||
width 240px
|
||||
font-size 24px
|
||||
height 44px
|
||||
line-height 24px
|
||||
font-weight bold
|
||||
background-color brandColor
|
||||
color white
|
||||
border none
|
||||
border-radius 5px
|
||||
margin 0 auto
|
||||
transition 0.1s
|
||||
&:hover
|
||||
transform scale(1.1)
|
||||
&:disabled
|
||||
opacity 0.7
|
||||
.tabNav
|
||||
absolute left right
|
||||
bottom 15px
|
||||
height 33px
|
||||
line-height 33px
|
||||
width 150px
|
||||
text-align center
|
||||
font-size 12px
|
||||
color tabNavColor
|
||||
margin 0 auto
|
||||
transition 0.1s
|
||||
i.active
|
||||
color brandColor
|
||||
.createTab
|
||||
.ipt
|
||||
margin 105px auto 15px
|
||||
.selectTab
|
||||
.memberForm
|
||||
display block
|
||||
margin 25px auto 15px
|
||||
width 330px
|
||||
clearfix()
|
||||
padding 0
|
||||
font-size 14px
|
||||
height 44px
|
||||
line-height 44px
|
||||
outline none
|
||||
.Select.memberName
|
||||
display block
|
||||
margin 0
|
||||
float left
|
||||
width 280px
|
||||
height 44px
|
||||
font-size 14px
|
||||
border none
|
||||
line-height 44px
|
||||
background-color transparent
|
||||
outline none
|
||||
&.is-focus
|
||||
.Select-control
|
||||
border-color iptFocusBorderColor
|
||||
.Select-control
|
||||
height 44px
|
||||
line-height 44px
|
||||
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 44px
|
||||
padding 0 0 0 15px
|
||||
|
||||
&:focus, &.focus
|
||||
border-color iptFocusBorderColor
|
||||
button
|
||||
font-weight 400
|
||||
height 44px
|
||||
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
|
||||
width 480px
|
||||
margin 0 auto
|
||||
height 190px
|
||||
overflow scroll
|
||||
border-bottom 1px solid borderColor
|
||||
&>li
|
||||
border-bottom 1px solid borderColor
|
||||
height 44px
|
||||
padding 0 25px
|
||||
clearfix()
|
||||
&:nth-last-child(1)
|
||||
border-bottom-color transparent
|
||||
.userPhoto
|
||||
width 30px
|
||||
height 30px
|
||||
float left
|
||||
margin-top 7px
|
||||
margin-right 15px
|
||||
border-radius 15px
|
||||
.userInfo
|
||||
float left
|
||||
margin-top 7px
|
||||
.userName
|
||||
font-size 16px
|
||||
margin-bottom 2px
|
||||
.userEmail
|
||||
font-size 12px
|
||||
.userControl
|
||||
float right
|
||||
.userRole
|
||||
float left
|
||||
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
|
||||
button
|
||||
border none
|
||||
height 30px
|
||||
margin-top 7px
|
||||
background-color transparent
|
||||
color stripBtnColor
|
||||
&:hover
|
||||
color stripHoverBtnColor
|
||||
@@ -1,33 +0,0 @@
|
||||
.DeleteArticleModal.modal
|
||||
width 350px !important
|
||||
top 100px
|
||||
user-select none
|
||||
.title
|
||||
font-size 24px
|
||||
margin-bottom 15px
|
||||
.message
|
||||
font-size 14px
|
||||
margin-bottom 15px
|
||||
.control
|
||||
text-align right
|
||||
button
|
||||
border-radius 5px
|
||||
height 33px
|
||||
padding 0 15px
|
||||
font-size 14px
|
||||
background-color white
|
||||
border 1px solid borderColor
|
||||
border-radius 5px
|
||||
margin-left 5px
|
||||
&:hover
|
||||
background-color darken(white, 10%)
|
||||
&:focus
|
||||
border-color focusBorderColor
|
||||
&.danger
|
||||
border-color #E9432A
|
||||
background-color #E9432A
|
||||
color white
|
||||
&:hover
|
||||
background-color lighten(#E9432A, 15%)
|
||||
&:focus
|
||||
background-color lighten(#E9432A, 15%)
|
||||
@@ -1,628 +0,0 @@
|
||||
menuColor = #808080
|
||||
menuBgColor = #E6E6E6
|
||||
closeBtnBgColor = #1790C6
|
||||
iptFocusBorderColor = #369DCD
|
||||
|
||||
.Preferences.modal
|
||||
padding 0
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
width 720px
|
||||
height 600px
|
||||
&>.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 20px
|
||||
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
|
||||
&>.sectionCheck
|
||||
margin-bottom 5px
|
||||
height 33px
|
||||
label
|
||||
width 150px
|
||||
padding-left 15px
|
||||
line-height 33px
|
||||
.sectionCheck-warn
|
||||
font-size 12px
|
||||
margin-left 10px
|
||||
border-left 2px solid brandColor
|
||||
padding-left 5px
|
||||
&>.sectionInput
|
||||
margin-bottom 5px
|
||||
clearfix()
|
||||
height 33px
|
||||
label
|
||||
width 150px
|
||||
padding-left 15px
|
||||
float left
|
||||
line-height 33px
|
||||
input
|
||||
width 250px
|
||||
float left
|
||||
height 33px
|
||||
border-radius 5px
|
||||
border 1px solid borderColor
|
||||
padding 0 10px
|
||||
font-size 14px
|
||||
outline none
|
||||
&:focus
|
||||
border-color iptFocusBorderColor
|
||||
&>.sectionSelect
|
||||
margin-bottom 5px
|
||||
clearfix()
|
||||
height 33px
|
||||
label
|
||||
width 150px
|
||||
padding-left 15px
|
||||
float left
|
||||
line-height 33px
|
||||
select
|
||||
float left
|
||||
width 200px
|
||||
height 25px
|
||||
margin-top 4px
|
||||
border-radius 5px
|
||||
border 1px solid borderColor
|
||||
padding 0 10px
|
||||
font-size 14px
|
||||
outline none
|
||||
&:focus
|
||||
border-color iptFocusBorderColor
|
||||
&>.sectionMultiSelect
|
||||
margin-bottom 5px
|
||||
clearfix()
|
||||
height 33px
|
||||
label
|
||||
width 150px
|
||||
padding-left 15px
|
||||
float left
|
||||
line-height 33px
|
||||
.sectionMultiSelect-input
|
||||
float left
|
||||
select
|
||||
width 80px
|
||||
height 25px
|
||||
margin-top 4px
|
||||
border-radius 5px
|
||||
border 1px solid borderColor
|
||||
padding 0 10px
|
||||
font-size 14px
|
||||
outline none
|
||||
margin-left 5px
|
||||
margin-right 15px
|
||||
&: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
|
||||
&.ContactTab
|
||||
padding 10px
|
||||
.title
|
||||
font-size 18px
|
||||
color brandColor
|
||||
margin-top 10px
|
||||
margin-bottom 10px
|
||||
p
|
||||
line-height 2
|
||||
&.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
|
||||
.folderColor
|
||||
float left
|
||||
margin-left 10px
|
||||
text-align center
|
||||
width 44px
|
||||
.folderName
|
||||
float left
|
||||
width 175px
|
||||
overflow ellipsis
|
||||
.folderControl
|
||||
float right
|
||||
width 125px
|
||||
text-align center
|
||||
&.folderHeader
|
||||
.folderName
|
||||
padding-left 25px
|
||||
&.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
|
||||
.sortBtns
|
||||
float left
|
||||
display block
|
||||
height 30px
|
||||
width 30px
|
||||
margin-top 1.5px
|
||||
position absolute
|
||||
button
|
||||
absolute left
|
||||
background-color transparent
|
||||
border none
|
||||
height 15px
|
||||
padding 0
|
||||
margin 0
|
||||
color stripBtnColor
|
||||
&:first-child
|
||||
top 0
|
||||
&:last-child
|
||||
top 15px
|
||||
&:hover
|
||||
color stripHoverBtnColor
|
||||
&:disabled
|
||||
color lighten(stripBtnColor, 10%)
|
||||
cursor not-allowed
|
||||
.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
|
||||
.folderColor
|
||||
.select
|
||||
height 33px
|
||||
width 33px
|
||||
border 1px solid borderColor
|
||||
background-color white
|
||||
outline none
|
||||
display block
|
||||
margin 0 auto
|
||||
font-size 14px
|
||||
border-radius 5px
|
||||
&:focus
|
||||
border-color iptFocusBorderColor
|
||||
.options
|
||||
position absolute
|
||||
background-color white
|
||||
text-align left
|
||||
border 1px solid borderColor
|
||||
border-radius 5px
|
||||
padding 0 5px 5px
|
||||
margin-left 5px
|
||||
margin-top -34px
|
||||
clearfix()
|
||||
.label
|
||||
margin-left 5px
|
||||
line-height 22px
|
||||
font-size 12px
|
||||
button
|
||||
float left
|
||||
border none
|
||||
width 33px
|
||||
height 33px
|
||||
margin-right 5px
|
||||
border 1px solid transparent
|
||||
line-height 29px
|
||||
overflow hidden
|
||||
border-radius 5px
|
||||
background-color transparent
|
||||
outline none
|
||||
transition 0.1s
|
||||
&:hover
|
||||
border-color borderColor
|
||||
&.active
|
||||
border-color iptFocusBorderColor
|
||||
.FolderMark
|
||||
transform scale(1.4)
|
||||
.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%)
|
||||
@@ -1,132 +0,0 @@
|
||||
|
||||
slideBgColor0 = #2BAC8F
|
||||
slideBgColor1 = #F68F92
|
||||
slideBgColor2 = #D6AD56
|
||||
slideBgColor3 = #26969B
|
||||
slideBgColor4 = #00B493
|
||||
|
||||
.Tutorial.modal
|
||||
background-color slideBgColor0
|
||||
color white !important
|
||||
width 720px
|
||||
height 480px
|
||||
margin-top 75px
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
|
||||
.priorBtn, .nextBtn
|
||||
font-size 72px
|
||||
position absolute
|
||||
background-color transparent
|
||||
color transparentify(white, 50%)
|
||||
transition 0.1s
|
||||
border none
|
||||
line-height 72px
|
||||
padding 0
|
||||
width 93px
|
||||
height 72px
|
||||
z-index 2
|
||||
top 189px
|
||||
&:hover
|
||||
color white
|
||||
&.hide
|
||||
opacity 0
|
||||
.priorBtn
|
||||
left 15px
|
||||
.nextBtn
|
||||
right 15px
|
||||
.title
|
||||
text-align center
|
||||
font-size 54px
|
||||
margin 40px 0
|
||||
.content
|
||||
text-align center
|
||||
font-size 22px
|
||||
line-height 1.8
|
||||
.dots
|
||||
position absolute
|
||||
left 0
|
||||
right 0
|
||||
bottom 25px
|
||||
margin 0 auto
|
||||
color gray
|
||||
text-align center
|
||||
z-index 2
|
||||
&>i
|
||||
transition 0.3s
|
||||
&.active
|
||||
color white
|
||||
.slide
|
||||
absolute top bottom left right
|
||||
z-index 1
|
||||
.slide0
|
||||
background-color slideBgColor0
|
||||
.content
|
||||
margin-top 100px
|
||||
.slide1
|
||||
background-color slideBgColor1
|
||||
.content
|
||||
.markdown
|
||||
background-color white
|
||||
color textColor
|
||||
width 480px
|
||||
height 140px
|
||||
margin 45px auto 0
|
||||
clearfix()
|
||||
text-align left
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
.left
|
||||
float left
|
||||
width 240px
|
||||
height 140px
|
||||
box-sizing border-box
|
||||
font-size 0.5em
|
||||
padding 30px
|
||||
border-right 1px solid borderColor
|
||||
.right
|
||||
width 240px
|
||||
height 140px
|
||||
float right
|
||||
box-sizing border-box
|
||||
padding: 28px 0 0 10px
|
||||
font-size 0.45em
|
||||
marked()
|
||||
ul
|
||||
padding-left 20px
|
||||
.slide2
|
||||
background-color slideBgColor2
|
||||
.code
|
||||
border-radius 5px
|
||||
overflow hidden
|
||||
text-align left
|
||||
width 480px
|
||||
heght 140px
|
||||
margin 45px auto 0
|
||||
font-size 14px
|
||||
.ace_editor
|
||||
height 140px
|
||||
.slide3
|
||||
background-color slideBgColor3
|
||||
.title
|
||||
margin-bottom 15px
|
||||
.content
|
||||
font-size 18px
|
||||
&>img
|
||||
margin-top 25px
|
||||
.slide4
|
||||
background-color slideBgColor4
|
||||
.content
|
||||
&>button
|
||||
background-color white
|
||||
color brandColor
|
||||
font-size 60px
|
||||
width 250px
|
||||
height 250px
|
||||
border-radius 125px
|
||||
border none
|
||||
transition 0.1s
|
||||
&:hover
|
||||
transform scale(1.2)
|
||||
|
||||
|
||||
@@ -1,21 +0,0 @@
|
||||
modalZIndex= 1000
|
||||
modalBackColor = transparentify(black, 65%)
|
||||
|
||||
.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
|
||||
background-color white
|
||||
padding 15px
|
||||
color #666666
|
||||
border-radius 5px
|
||||
@@ -1,390 +0,0 @@
|
||||
// .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
|
||||
//
|
||||
// .sideNavModal
|
||||
// height 500px
|
||||
// .leftPane
|
||||
// absolute top bottom left
|
||||
// width 175px
|
||||
// padding 20px
|
||||
// border-right solid 1px borderColor
|
||||
// .modalLabel
|
||||
// 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
|
||||
// overflow-y auto
|
||||
// .tab
|
||||
// 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 5px
|
||||
// float left
|
||||
// .formRadioField
|
||||
// margin-bottom 15px
|
||||
// input
|
||||
// margin-left 25px
|
||||
// .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 320px
|
||||
// font-size 1em
|
||||
// overflow-x hidden
|
||||
// white-space nowrap
|
||||
// transition 0.1s
|
||||
// &.hide
|
||||
// width 0
|
||||
// padding 12px 0
|
||||
// .alertInfo
|
||||
// alertInfo()
|
||||
// .alertSuccess
|
||||
// alertSuccess()
|
||||
// .alertError
|
||||
// alertError()
|
||||
// .PreferencesModal
|
||||
// .settingsTab
|
||||
// .categoryLabel
|
||||
// font-size 1.5em
|
||||
// margin-bottom 25px
|
||||
// .example
|
||||
// marked()
|
||||
// .aboutTab
|
||||
// padding-top 30px
|
||||
// .about1
|
||||
// margin-bottom 25px
|
||||
// .logo
|
||||
// display block
|
||||
// margin 0 auto
|
||||
// .appInfo
|
||||
// font-size 1.5em
|
||||
// text-align center
|
||||
// .about2
|
||||
// width 200px
|
||||
// margin 0 auto
|
||||
// .externalLabel
|
||||
// font-size 1.2em
|
||||
// margin-bottom 15px
|
||||
// .externalList
|
||||
// li
|
||||
// margin-bottom 15px
|
||||
// .PlanetSettingModal
|
||||
// .planetDeleteTab
|
||||
// padding-top 65px
|
||||
// p
|
||||
// margin-bottom 25px
|
||||
// strong
|
||||
// color brandColor
|
||||
// font-size 1.1em
|
||||
// input
|
||||
// borderInput()
|
||||
// margin-right 5px
|
||||
// height 33px
|
||||
// font-size 1em
|
||||
// border-radius 10px
|
||||
// .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 320px
|
||||
// font-size 1em
|
||||
// overflow-x hidden
|
||||
// white-space nowrap
|
||||
// transition 0.1s
|
||||
// &.hide
|
||||
// width 0
|
||||
// padding 12px 0
|
||||
// .alertInfo
|
||||
// alertInfo()
|
||||
// .alertSuccess
|
||||
// alertSuccess()
|
||||
// .alertError
|
||||
// alertError()
|
||||
// .TeamSettingsModal
|
||||
// .membersTab
|
||||
// .memberTable
|
||||
// width 100%
|
||||
// margin-bottom 25px
|
||||
// th
|
||||
// border-bottom solid 2px borderColor
|
||||
// td
|
||||
// border-bottom solid 1px borderColor
|
||||
// height 38px
|
||||
// button
|
||||
// btnDefault()
|
||||
// padding 5px
|
||||
// border-radius 5px
|
||||
// .roleSelect
|
||||
// height 33px
|
||||
// border solid 1px borderColor
|
||||
// background-color backgroundColor
|
||||
// th, td
|
||||
// padding 5px 0
|
||||
// .addMemberForm
|
||||
// .formLabel
|
||||
// margin-bottom 5px
|
||||
// .formGroup
|
||||
// clearfix()
|
||||
// .userNameSelect
|
||||
// display block
|
||||
// width 200px
|
||||
// margin-right 5px
|
||||
// float left
|
||||
// .roleSelect
|
||||
// display block
|
||||
// height 33px
|
||||
// border solid 1px borderColor
|
||||
// background-color backgroundColor
|
||||
// float left
|
||||
// margin-right 5px
|
||||
// .confirmButton
|
||||
// display block
|
||||
// height 33px
|
||||
// btnDefault()
|
||||
// border-radius 5px
|
||||
// float left
|
||||
//
|
||||
// .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, .TeamCreateModal.modal, .AddMemberModal.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()
|
||||
// .errorAlert
|
||||
// alertError()
|
||||
// padding 12px 10px
|
||||
// border-radius 5px
|
||||
// text-align center
|
||||
// display block
|
||||
// width 360px
|
||||
// margin 0 auto 15px
|
||||
//
|
||||
// .ContactModal
|
||||
// padding 15px
|
||||
// .contactForm
|
||||
// .formField
|
||||
// width 100%
|
||||
// margin-bottom 10px
|
||||
// input, textarea
|
||||
// display block
|
||||
// width 100%
|
||||
// borderInput()
|
||||
// border-radius 5px
|
||||
// input
|
||||
// height 33px
|
||||
// font-size 1em
|
||||
// textarea
|
||||
// height 175px
|
||||
// font-size 1em
|
||||
// .formControl
|
||||
// clearfix()
|
||||
// button
|
||||
// float right
|
||||
// btnDefault()
|
||||
// height 44px
|
||||
// padding 0 15px
|
||||
// border-radius 5px
|
||||
// margin-left 5px
|
||||
// font-size 1em
|
||||
// button.sendButton
|
||||
// btnPrimary()
|
||||
// .confirmation
|
||||
// .confirmationMessage
|
||||
// padding 35px 0
|
||||
// text-align center
|
||||
// font-size 1.1em
|
||||
// .doneButton
|
||||
// btnDefault()
|
||||
// height 44px
|
||||
// padding 0 35px
|
||||
// border-radius 5px
|
||||
// display block
|
||||
// margin 0 auto 25px
|
||||
//
|
||||
// .LogoutModal
|
||||
// padding 65px 0 45px
|
||||
// width 350px
|
||||
// .messageLabel
|
||||
// text-align center
|
||||
// font-size 1.1em
|
||||
// margin-bottom 35px
|
||||
// .formControl
|
||||
// text-align center
|
||||
// button
|
||||
// btnDefault()
|
||||
// border-radius 5px
|
||||
// height 44px
|
||||
// margin 15px 5px
|
||||
// padding 0 15px
|
||||
// button.logoutButton
|
||||
// btnPrimary()
|
||||
Reference in New Issue
Block a user