Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/wlh320/hugo-theme-hulga.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat (limited to 'assets/sass/form/select.sass')
-rw-r--r--assets/sass/form/select.sass87
1 files changed, 87 insertions, 0 deletions
diff --git a/assets/sass/form/select.sass b/assets/sass/form/select.sass
new file mode 100644
index 0000000..07fe98c
--- /dev/null
+++ b/assets/sass/form/select.sass
@@ -0,0 +1,87 @@
+$select-colors: $form-colors !default
+
+.select
+ display: inline-block
+ max-width: 100%
+ position: relative
+ vertical-align: top
+ &:not(.is-multiple)
+ height: $input-height
+ &:not(.is-multiple):not(.is-loading)
+ &::after
+ @extend %arrow
+ border-color: $input-arrow
+ +ltr-position(1.125em)
+ z-index: 4
+ &.is-rounded
+ select
+ border-radius: $radius-rounded
+ +ltr-property("padding", 1em, false)
+ select
+ @extend %input
+ cursor: pointer
+ display: block
+ font-size: 1em
+ max-width: 100%
+ outline: none
+ &::-ms-expand
+ display: none
+ &[disabled]:hover,
+ fieldset[disabled] &:hover
+ border-color: $input-disabled-border-color
+ &:not([multiple])
+ +ltr-property("padding", 2.5em)
+ &[multiple]
+ height: auto
+ padding: 0
+ option
+ padding: 0.5em 1em
+ // States
+ &:not(.is-multiple):not(.is-loading):hover
+ &::after
+ border-color: $input-hover-color
+ // Colors
+ @each $name, $pair in $select-colors
+ $color: nth($pair, 1)
+ &.is-#{$name}
+ &:not(:hover)::after
+ border-color: $color
+ select
+ border-color: $color
+ &:hover,
+ &.is-hovered
+ border-color: bulmaDarken($color, 5%)
+ &:focus,
+ &.is-focused,
+ &:active,
+ &.is-active
+ box-shadow: $input-focus-box-shadow-size bulmaRgba($color, 0.25)
+ // Sizes
+ &.is-small
+ +control-small
+ &.is-medium
+ +control-medium
+ &.is-large
+ +control-large
+ // Modifiers
+ &.is-disabled
+ &::after
+ border-color: $input-disabled-color
+ &.is-fullwidth
+ width: 100%
+ select
+ width: 100%
+ &.is-loading
+ &::after
+ @extend %loader
+ margin-top: 0
+ position: absolute
+ +ltr-position(0.625em)
+ top: 0.625em
+ transform: none
+ &.is-small:after
+ font-size: $size-small
+ &.is-medium:after
+ font-size: $size-medium
+ &.is-large:after
+ font-size: $size-large