Use new arrow for all dropdowns
This commit is contained in:
parent
92394ba601
commit
16b4f8fb6d
2 changed files with 16 additions and 30 deletions
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
|
|
Loading…
Reference in a new issue