Use new arrow for all dropdowns

This commit is contained in:
J. Ryan Stinnett 2019-01-29 16:38:41 -06:00
parent 92394ba601
commit 16b4f8fb6d
2 changed files with 16 additions and 30 deletions

View file

@ -25,22 +25,6 @@ limitations under the License.
color: $authpage-lang-color; color: $authpage-lang-color;
} }
/* TODO: Consider using this new arrow for all dropdowns */
.mx_Auth_language .mx_Dropdown_arrow {
width: 10px;
height: 6px;
border: none;
right: 6px;
}
.mx_Auth_language .mx_Dropdown_arrow::before { .mx_Auth_language .mx_Dropdown_arrow::before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
mask: url('$(res)/img/feather-icons/dropdown-arrow.svg');
mask-repeat: no-repeat;
background: $authpage-lang-color; background: $authpage-lang-color;
} }

View file

@ -23,6 +23,8 @@ limitations under the License.
} }
.mx_Dropdown_input { .mx_Dropdown_input {
display: flex;
align-items: center;
position: relative; position: relative;
border-radius: 3px; border-radius: 3px;
border: 1px solid $strong-input-border-color; border: 1px solid $strong-input-border-color;
@ -41,19 +43,23 @@ limitations under the License.
} }
.mx_Dropdown_arrow { .mx_Dropdown_arrow {
border-color: $primary-fg-color transparent transparent;
border-style: solid;
border-width: 5px 5px 0;
display: block; display: block;
height: 0; position: relative;
position: absolute; width: 10px;
right: 10px; height: 6px;
top: 14px; padding-right: 8px;
width: 0
} }
.mx_Dropdown.left_aligned .mx_Dropdown_arrow { .mx_Dropdown_arrow::before {
left: 10px; content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
mask: url('$(res)/img/feather-icons/dropdown-arrow.svg');
mask-repeat: no-repeat;
background: $primary-fg-color;
} }
.mx_Dropdown_input > .mx_Dropdown_option { .mx_Dropdown_input > .mx_Dropdown_option {
@ -62,10 +68,6 @@ limitations under the License.
white-space: nowrap; white-space: nowrap;
} }
.mx_Dropdown.left_aligned .mx_Dropdown_input > .mx_Dropdown_option {
padding-left: 25px;
}
.mx_Dropdown_option { .mx_Dropdown_option {
height: 35px; height: 35px;
line-height: 35px; line-height: 35px;