From 01d28bc1373f1255e810109246493a23e41c8f9c Mon Sep 17 00:00:00 2001
From: "J. Ryan Stinnett" <jryans@gmail.com>
Date: Tue, 29 Jan 2019 16:53:31 -0600
Subject: [PATCH] Squeeze country dropdowns to match design

---
 res/css/structures/auth/_Login.scss          | 1 -
 res/css/views/auth/_CountryDropdown.scss     | 8 ++++++++
 src/components/views/auth/CountryDropdown.js | 2 +-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/res/css/structures/auth/_Login.scss b/res/css/structures/auth/_Login.scss
index 4b6e3cedd7..b48021c27a 100644
--- a/res/css/structures/auth/_Login.scss
+++ b/res/css/structures/auth/_Login.scss
@@ -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;
diff --git a/res/css/views/auth/_CountryDropdown.scss b/res/css/views/auth/_CountryDropdown.scss
index b27ff54a96..6fd3c0182c 100644
--- a/res/css/views/auth/_CountryDropdown.scss
+++ b/res/css/views/auth/_CountryDropdown.scss
@@ -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;
diff --git a/src/components/views/auth/CountryDropdown.js b/src/components/views/auth/CountryDropdown.js
index 56900ab968..3cbdfe818e 100644
--- a/src/components/views/auth/CountryDropdown.js
+++ b/src/components/views/auth/CountryDropdown.js
@@ -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}