Files
Iris/src/scss/components/_dropdown-field.scss
2017-02-22 08:36:17 +13:00

82 lines
1.2 KiB
SCSS
Executable File

.dropdown-field {
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
position: relative;
display: inline-block;
.label {
padding: 14px 10px;
cursor: pointer;
}
&.expanded {
.label {
background: $dark_grey;
color: #FFFFFF;
}
.options {
display: block;
}
}
.options {
color: #FFFFFF;
position: absolute;
top: 52px;
right: 0px;
z-index: 97;
background: $dark_grey;
display: none;
.option {
position: relative;
padding: 6px 14px 6px 30px;
border-top: 1px solid lighten($dark_grey, 10%);
cursor: pointer;
.fa {
position: absolute;
top: 12px;
left: 10px;
font-size: 12px;
}
&:hover {
background: lighten($dark_grey, 10%);
}
}
}
@include responsive( $bp_medium ){
&.expanded {
background: none !important;
color: inherit !important;
}
.label {
background: none !important;
color: inherit !important;
.fa {
display: none;
}
}
.options {
display: block;
position: relative;
top: 0;
background: lighten($light_grey,5%);
.option {
color: #000000;
border-color: $light_grey;
background: none !important;
}
}
}
}