mirror of
https://gitcode.com/gh_mirrors/hy/Hydro.git
synced 2026-10-20 01:38:19 +08:00
ui: init windows 98 theme
This commit is contained in:
1 parent
6cae5cb7d1
commit
9524e56d01
12 files changed
+731
-58
No files matched your search
@@ -0,0 +1,32 @@
|
||||
@import './var.inc.styl'
|
||||
|
||||
.button
|
||||
box-sizing: border-box
|
||||
border: none
|
||||
background: #c0c0c0
|
||||
border-radius: 0
|
||||
min-width: 75px;
|
||||
min-height: 23px;
|
||||
padding: 0 12px;
|
||||
|
||||
&:not(:disabled)
|
||||
&:active
|
||||
box-shadow: --border-sunken-outer, --border-sunken-inner
|
||||
padding: 2px 11px 0 13px;
|
||||
|
||||
.button.inverse
|
||||
line-height: rem($form-control-height - 4)
|
||||
border: 2px solid #FFF
|
||||
background: none
|
||||
|
||||
&, &:visited
|
||||
&, .typo &
|
||||
color: #FFF
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover, &:focus
|
||||
border-color: $immersive-primary-color
|
||||
background: none
|
||||
box-shadow: none
|
||||
&, .typo &
|
||||
color: $immersive-primary-color
|
||||
@@ -0,0 +1,58 @@
|
||||
@import './var.inc.styl'
|
||||
|
||||
.button
|
||||
background-color: lighten($default-color, 50%)
|
||||
border: 1px solid $default-color
|
||||
transition: background-color .2s, box-shadow .5s
|
||||
transition-timing-function: ease-out-sine
|
||||
|
||||
&, &:visited, &:hover
|
||||
&, .typo &
|
||||
color: $text-1-color
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover, &:focus
|
||||
background-color: darken($default-color, 5%)
|
||||
border-color: darken($default-color, 5%)
|
||||
box-shadow: 0 4px 15px rgba(darken($default-color, 10%), 0.5)
|
||||
|
||||
&:focus
|
||||
border-color: $input-focus-color
|
||||
|
||||
&.rounded
|
||||
border-radius: rem($form-control-height / 2)
|
||||
|
||||
&.primary
|
||||
border-color: $primary-color
|
||||
background-color: $primary-color
|
||||
|
||||
&, &:visited, &:hover
|
||||
&, .typo &
|
||||
color: #FFF
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover
|
||||
background-color: lighten(saturate($primary-color, 30%), 10%)
|
||||
border-color: saturate($primary-color, 70%)
|
||||
box-shadow: 0 4px 15px rgba(saturate($primary-color, 70%), 0.3)
|
||||
|
||||
&.disabled
|
||||
cursor: default
|
||||
opacity: 0.5
|
||||
|
||||
.button.inverse
|
||||
line-height: rem($form-control-height - 4)
|
||||
border: 2px solid #FFF
|
||||
background: none
|
||||
|
||||
&, &:visited
|
||||
&, .typo &
|
||||
color: #FFF
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover, &:focus
|
||||
border-color: $immersive-primary-color
|
||||
background: none
|
||||
box-shadow: none
|
||||
&, .typo &
|
||||
color: $immersive-primary-color
|
||||
@@ -3,61 +3,22 @@
|
||||
.button
|
||||
font-size: rem($font-size-secondary)
|
||||
line-height: rem($form-control-height - 2)
|
||||
background-color: lighten($default-color, 50%)
|
||||
border: 1px solid $default-color
|
||||
height: rem($form-control-height)
|
||||
padding: rem(0 25px)
|
||||
display: inline-block
|
||||
outline: 0
|
||||
margin: 0 0 1rem
|
||||
transition: background-color .2s, box-shadow .5s
|
||||
transition-timing-function: ease-out-sine
|
||||
cursor: pointer
|
||||
user-select: none
|
||||
|
||||
&, &:visited, &:hover
|
||||
&, .typo &
|
||||
color: $text-1-color
|
||||
|
||||
&:hover, &:focus
|
||||
text-decoration: none
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover, &:focus
|
||||
background-color: darken($default-color, 5%)
|
||||
border-color: darken($default-color, 5%)
|
||||
box-shadow: 0 4px 15px rgba(darken($default-color, 10%), 0.5)
|
||||
|
||||
&:focus
|
||||
border-color: $input-focus-color
|
||||
|
||||
&.expanded
|
||||
padding-left: 0
|
||||
padding-right: 0
|
||||
text-align: center
|
||||
width: 100%
|
||||
|
||||
&.rounded
|
||||
border-radius: rem($form-control-height / 2)
|
||||
|
||||
&.primary
|
||||
border-color: $primary-color
|
||||
background-color: $primary-color
|
||||
|
||||
&, &:visited, &:hover
|
||||
&, .typo &
|
||||
color: #FFF
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover
|
||||
background-color: lighten(saturate($primary-color, 30%), 10%)
|
||||
border-color: saturate($primary-color, 70%)
|
||||
box-shadow: 0 4px 15px rgba(saturate($primary-color, 70%), 0.3)
|
||||
|
||||
&.disabled
|
||||
cursor: default
|
||||
opacity: 0.5
|
||||
|
||||
&.compact
|
||||
margin-bottom: 0
|
||||
height: rem($compact-control-height)
|
||||
@@ -72,11 +33,3 @@
|
||||
&, &:visited
|
||||
&, .typo &
|
||||
color: #FFF
|
||||
|
||||
&:not(.disabled)
|
||||
&:hover, &:focus
|
||||
border-color: $immersive-primary-color
|
||||
background: none
|
||||
box-shadow: none
|
||||
&, .typo &
|
||||
color: $immersive-primary-color
|
||||
Reference in new issue
Block a user