public/components/location-picker/_location-picker.scss (61 lines of code) (raw):
/**
* Location picker styles.
*/
.location-picker {
position: relative;
}
.location-picker__button {
@extend %fs-data-2;
border: 0;
border-top: 1px solid $c-grey-300;
display: block;
padding: 6px 5px 6px 15px;
text-align: left;
width: 100%;
}
.location-picker__icon--show {
display: inline-block;
width: 14px;
height: 14px;
float: right;
margin-right: 5px;
}
.location-picker__menu {
@extend %fs-data-2;
width: 100%;
display: none;
position: absolute;
bottom: 100%;
padding: 0;
margin: 0;
background-color: $c-grey-100;
border: 1px solid $c-grey-300;
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);
.location-picker--open & {
display: block;
}
}
.location-picker__menuitem {
margin: 0;
padding: 0;
list-style-type: none;
}
.location-picker__menuitem-link {
padding: 5px 10px;
cursor: pointer;
display: block;
color: $c-text;
&:hover, &:focus {
color: $c-text;
background-color: $c-grey-300;
text-decoration: none;
}
}
.location-picker__localtime {
color: #666;
margin-right: 6px;
float: right;
}
.location-picker__menuitem-localtime {
color: #666;
line-height: 1em;
padding-top: 1px;
float: right;
}