Merge pull request #2765 from jryans/dropdown-redesign

Tweak country dropdown for redesign
This commit is contained in:
J. Ryan Stinnett 2019-03-08 10:08:45 +00:00 committed by GitHub
commit b0863768e4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 8 deletions

View file

@ -80,6 +80,10 @@ limitations under the License.
background-color: $authpage-primary-color; background-color: $authpage-primary-color;
} }
.mx_Dropdown {
color: $authpage-primary-color;
}
.mx_Dropdown_arrow { .mx_Dropdown_arrow {
background: $authpage-primary-color; background: $authpage-primary-color;
} }

View file

@ -16,6 +16,7 @@ limitations under the License.
.mx_Dropdown { .mx_Dropdown {
position: relative; position: relative;
color: $primary-fg-color;
} }
.mx_Dropdown_disabled { .mx_Dropdown_disabled {
@ -33,7 +34,7 @@ limitations under the License.
} }
.mx_Dropdown_input:focus { .mx_Dropdown_input:focus {
border-color: $accent-color; border-color: $input-focused-border-color;
} }
/* Disable dropdown highlight on focus */ /* Disable dropdown highlight on focus */
@ -76,7 +77,9 @@ limitations under the License.
vertical-align: middle; vertical-align: middle;
} }
input.mx_Dropdown_option, input.mx_Dropdown_option:focus { input.mx_Dropdown_option,
input.mx_Dropdown_option:focus {
font-weight: normal;
border: 0; border: 0;
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
@ -95,7 +98,7 @@ input.mx_Dropdown_option, input.mx_Dropdown_option:focus {
margin: 0; margin: 0;
padding: 0px; padding: 0px;
border-radius: 3px; border-radius: 3px;
border: 1px solid $accent-color; border: 1px solid $input-focused-border-color;
background-color: $primary-bg-color; background-color: $primary-bg-color;
max-height: 200px; max-height: 200px;
overflow-y: auto; overflow-y: auto;
@ -110,10 +113,6 @@ input.mx_Dropdown_option, input.mx_Dropdown_option:focus {
background-color: $focus-bg-color; background-color: $focus-bg-color;
} }
.mx_Dropdown_menu {
font-weight: bold;
}
.mx_Dropdown_searchPrompt { .mx_Dropdown_searchPrompt {
font-weight: normal; font-weight: normal;
margin-left: 5px; margin-left: 5px;

View file

@ -113,7 +113,7 @@ export default class CountryDropdown extends React.Component {
const options = displayedCountries.map((country) => { const options = displayedCountries.map((country) => {
return <div className="mx_CountryDropdown_option" key={country.iso2}> return <div className="mx_CountryDropdown_option" key={country.iso2}>
{ this._flagImgForIso2(country.iso2) } { this._flagImgForIso2(country.iso2) }
{ country.name } <span>(+{ country.prefix })</span> { country.name } (+{ country.prefix })
</div>; </div>;
}); });