Squeeze country dropdowns to match design

This commit is contained in:
J. Ryan Stinnett 2019-01-29 16:53:31 -06:00
parent 16b4f8fb6d
commit 01d28bc137
3 changed files with 9 additions and 2 deletions

View file

@ -118,7 +118,6 @@ limitations under the License.
.mx_Login_phoneCountry {
margin-bottom: 14px;
width: 150px;
/* To override mx_Login_field_prefix */
text-align: left;

View file

@ -14,6 +14,14 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CountryDropdown .mx_Dropdown_input .mx_Dropdown_option {
padding: 0 3px;
}
.mx_CountryDropdown .mx_Dropdown_arrow {
padding-right: 3px;
}
.mx_CountryDropdown_shortOption {
display: inline-flex;
align-items: center;

View file

@ -121,7 +121,7 @@ export default class CountryDropdown extends React.Component {
// values between mounting and the initial value propgating
const value = this.props.value || COUNTRIES[0].iso2;
return <Dropdown className={this.props.className}
return <Dropdown className={this.props.className + " mx_CountryDropdown"}
onOptionChange={this._onOptionChange} onSearchChange={this._onSearchChange}
menuWidth={298} getShortOption={this._getShortOption}
value={value} searchEnabled={true} disabled={this.props.disabled}