mirror of
https://github.com/hotomoe/hotomoe
synced 2024-12-18 00:28:16 +09:00
120 lines
2.0 KiB
Stylus
120 lines
2.0 KiB
Stylus
|
@import "../app"
|
||
|
|
||
|
button
|
||
|
font-family sans-serif
|
||
|
|
||
|
*
|
||
|
pointer-events none
|
||
|
|
||
|
button.ui
|
||
|
.button.ui
|
||
|
display inline-block
|
||
|
cursor pointer
|
||
|
padding 0 14px
|
||
|
margin 0
|
||
|
min-width 100px
|
||
|
line-height 38px
|
||
|
font-size 14px
|
||
|
color #888
|
||
|
text-decoration none
|
||
|
background linear-gradient(to bottom, #ffffff 0%, #f5f5f5 100%)
|
||
|
border solid 1px #e2e2e2
|
||
|
border-radius 4px
|
||
|
outline none
|
||
|
|
||
|
&:focus
|
||
|
&:after
|
||
|
content ""
|
||
|
pointer-events none
|
||
|
position absolute
|
||
|
top -5px
|
||
|
right -5px
|
||
|
bottom -5px
|
||
|
left -5px
|
||
|
border 2px solid rgba($theme-color, 0.3)
|
||
|
border-radius 8px
|
||
|
|
||
|
&:disabled
|
||
|
opacity 0.7
|
||
|
cursor default
|
||
|
|
||
|
&:hover
|
||
|
background linear-gradient(to bottom, #f9f9f9 0%, #ececec 100%)
|
||
|
border-color #dcdcdc
|
||
|
|
||
|
&:active
|
||
|
background #ececec
|
||
|
border-color #dcdcdc
|
||
|
|
||
|
&.primary
|
||
|
color $theme-color-foreground
|
||
|
background linear-gradient(to bottom, lighten($theme-color, 25%) 0%, lighten($theme-color, 10%) 100%)
|
||
|
border solid 1px lighten($theme-color, 15%)
|
||
|
|
||
|
&:not(:disabled)
|
||
|
font-weight bold
|
||
|
|
||
|
&:hover:not(:disabled)
|
||
|
background linear-gradient(to bottom, lighten($theme-color, 8%) 0%, darken($theme-color, 8%) 100%)
|
||
|
border-color $theme-color
|
||
|
|
||
|
&:active:not(:disabled)
|
||
|
background $theme-color
|
||
|
border-color $theme-color
|
||
|
|
||
|
input:not([type]).ui
|
||
|
input[type='text'].ui
|
||
|
input[type='password'].ui
|
||
|
input[type='email'].ui
|
||
|
input[type='date'].ui
|
||
|
input[type='number'].ui
|
||
|
textarea.ui
|
||
|
display block
|
||
|
padding 10px
|
||
|
width 100%
|
||
|
height 40px
|
||
|
font-family sans-serif
|
||
|
font-size 16px
|
||
|
color #55595c
|
||
|
border solid 1px #dadada
|
||
|
border-radius 4px
|
||
|
|
||
|
&:hover
|
||
|
border-color #b0b0b0
|
||
|
|
||
|
&:focus
|
||
|
border-color $theme-color
|
||
|
|
||
|
textarea.ui
|
||
|
min-width 100%
|
||
|
max-width 100%
|
||
|
min-height 64px
|
||
|
|
||
|
.ui.info
|
||
|
display block
|
||
|
margin 1em 0
|
||
|
padding 0 1em
|
||
|
font-size 90%
|
||
|
color rgba(#000, 0.87)
|
||
|
background #f8f8f9
|
||
|
border solid 1px rgba(34, 36, 38, 0.22)
|
||
|
border-radius 4px
|
||
|
|
||
|
> p
|
||
|
opacity 0.8
|
||
|
|
||
|
&.warn
|
||
|
color #573a08
|
||
|
background #FFFAF3
|
||
|
border-color #C9BA9B
|
||
|
|
||
|
.ui.from.group
|
||
|
display block
|
||
|
margin 16px 0
|
||
|
|
||
|
> p:first-child
|
||
|
margin 0 0 6px 0
|
||
|
font-size 90%
|
||
|
font-weight bold
|
||
|
color rgba(#373a3c, 0.9)
|