mirror of
https://github.com/jgthms/bulma
synced 2026-03-20 20:24:30 -07:00
Add select
This commit is contained in:
@@ -97,16 +97,17 @@ $input-radius: $radius !default
|
||||
|
||||
.select
|
||||
display: inline-block
|
||||
height: 2.25em
|
||||
max-width: 100%
|
||||
position: relative
|
||||
vertical-align: top
|
||||
&:after
|
||||
+arrow($input-arrow)
|
||||
margin-top: -0.375em
|
||||
right: 1.125em
|
||||
top: 50%
|
||||
z-index: 4
|
||||
&:not(.is-multiple)
|
||||
height: 2.25em
|
||||
&::after
|
||||
+arrow($input-arrow)
|
||||
margin-top: -0.375em
|
||||
right: 1.125em
|
||||
top: 50%
|
||||
z-index: 4
|
||||
select
|
||||
+input
|
||||
cursor: pointer
|
||||
@@ -114,16 +115,27 @@ $input-radius: $radius !default
|
||||
font-size: 1em
|
||||
max-width: 100%
|
||||
outline: none
|
||||
padding-right: 2.5em
|
||||
&:hover
|
||||
border-color: $input-hover-border
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
border-color: $input-focus-border
|
||||
&::-ms-expand
|
||||
display: none
|
||||
&[disabled]:hover
|
||||
border-color: $input-disabled-border
|
||||
&:not([multiple])
|
||||
padding-right: 2.5em
|
||||
&[multiple]
|
||||
height: unset
|
||||
padding: 0
|
||||
option
|
||||
padding: 0.5em 1em
|
||||
// States
|
||||
&:hover
|
||||
&:after
|
||||
&::after
|
||||
border-color: $input-hover
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
@@ -139,14 +151,14 @@ $input-radius: $radius !default
|
||||
+control-large
|
||||
// Modifiers
|
||||
&.is-disabled
|
||||
&:after
|
||||
&::after
|
||||
border-color: $input-disabled
|
||||
&.is-fullwidth
|
||||
width: 100%
|
||||
select
|
||||
width: 100%
|
||||
&.is-loading
|
||||
&:after
|
||||
&::after
|
||||
+loader
|
||||
margin-top: 0
|
||||
position: absolute
|
||||
@@ -332,7 +344,7 @@ $input-radius: $radius !default
|
||||
&.has-icons-left,
|
||||
&.has-icons-right
|
||||
.input,
|
||||
.select select
|
||||
.select
|
||||
&:focus
|
||||
& ~ .icon
|
||||
color: $input-icon-active
|
||||
@@ -363,7 +375,7 @@ $input-radius: $radius !default
|
||||
.icon.is-right
|
||||
right: 0
|
||||
&.is-loading
|
||||
&:after
|
||||
&::after
|
||||
+loader
|
||||
position: absolute !important
|
||||
right: 0.625em
|
||||
|
||||
Reference in New Issue
Block a user