recommended RTL changes

ui/app/components/app/gas-customization/advanced-gas-inputs/index.scss

@@ -47,6 +47,8 @@
     }
 
     &__input {
+      /*rtl:ignore*/
+      direction: ltr;
       border: 1px solid $dusty-gray;
       border-radius: 4px;
       color: $mid-gray;
@@ -69,6 +71,7 @@
     &__input-arrows {
       position: absolute;
       top: 7px;
+      /*rtl:ignore*/
       right: 0px;
       width: 17px;
       height: 24px;

ui/app/components/app/gas-customization/gas-modal-page-container/advanced-tab-content/index.scss

@@ -139,6 +139,8 @@
     }
 
     &__input {
+      /*rtl:ignore*/
+      direction: ltr;
       border: 1px solid $dusty-gray;
       border-radius: 4px;
       color: $mid-gray;
@@ -161,6 +163,7 @@
     &__input-arrows {
       position: absolute;
       top: 7px;
+      /*rtl:ignore*/
       right: 0px;
       width: 17px;
       height: 24px;

ui/app/pages/add-token/token-search/token-search.component.js

@@ -74,6 +74,7 @@ export default class TokenSearch extends Component {
         id="search-tokens"
         placeholder={this.context.t('searchTokens')}
         type="text"
+        dir="auto"
         value={searchQuery}
         onChange={e => this.handleSearch(e.target.value)}
         error={error}

ui/app/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js

@@ -240,6 +240,7 @@ export default class ImportWithSeedPhrase extends PureComponent {
           label={t('newPassword')}
           type="password"
           className="first-time-flow__input"
+          dir="auto"
           value={this.state.password}
           onChange={event => this.handlePasswordChange(event.target.value)}
           error={passwordError}
@@ -252,6 +253,7 @@ export default class ImportWithSeedPhrase extends PureComponent {
           label={t('confirmPassword')}
           type="password"
           className="first-time-flow__input"
+          dir="auto"
           value={this.state.confirmPassword}
           onChange={event => this.handleConfirmPasswordChange(event.target.value)}
           error={confirmPasswordError}

ui/app/pages/first-time-flow/create-password/new-account/new-account.component.js

@@ -172,6 +172,7 @@ export default class NewAccount extends PureComponent {
             label={t('newPassword')}
             type="password"
             className="first-time-flow__input"
+            dir="auto"
             value={password}
             onChange={event => this.handlePasswordChange(event.target.value)}
             error={passwordError}
@@ -186,6 +187,7 @@ export default class NewAccount extends PureComponent {
             label={t('confirmPassword')}
             type="password"
             className="first-time-flow__input"
+            dir="auto"
             value={confirmPassword}
             onChange={event => this.handleConfirmPasswordChange(event.target.value)}
             error={confirmPasswordError}

ui/app/pages/send/send-content/add-recipient/ens-input.component.js

@@ -155,6 +155,7 @@ export default class EnsInput extends Component {
           <input
             className="ens-input__wrapper__input"
             type="text"
+            dir="auto"
             placeholder={t('recipientAddressPlaceholder')}
             onChange={this.onChange}
             onPaste={this.onPaste}

ui/app/pages/send/send.scss

@@ -60,6 +60,10 @@
         width: 18px;
         height: 18px;
         margin-right: .5rem;
+
+        [dir='rtl'] & {
+          transform: rotate(180deg);
+        }
       }
     }
 

ui/app/pages/settings/connections-tab/connections-tab.component.js

@@ -52,6 +52,7 @@ export default class ConnectionsTab extends PureComponent {
           <div className="settings-page__content-item-col">
             <TextField
               type="text"
+              dir="auto"
               value={this.state.input}
               onChange={e => this.setState({ input: e.target.value })}
               fullWidth

ui/app/pages/settings/contact-list-tab/index.scss

@@ -197,6 +197,10 @@
       width: 30px;
       opacity: .5;
       background-repeat: no-repeat;
+
+      [dir='rtl'] & {
+        transform: rotate(180deg);
+      }
     }
   }
 }

ui/app/pages/settings/index.scss

@@ -243,4 +243,9 @@
       }
     }
   }
+
+  .toggle-button {
+    /*rtl:ignore*/
+    direction: ltr;
+  }
 }

ui/app/pages/settings/networks-tab/index.scss

@@ -20,6 +20,11 @@
     @media screen and (max-width: 575px) {
       padding: 0;
     }
+
+    input {
+      /*rtl:ignore*/
+      direction: ltr;
+    }
   }
 
   &__back-button {
@@ -38,6 +43,10 @@
       cursor: pointer;
       position: absolute;
       margin-left: 10px;
+
+      [dir='rtl'] & {
+        transform: rotate(180deg);
+      }
     }
   }
 
@@ -190,6 +199,10 @@
       position: absolute;
       width: 24px;
       height: 24px;
+
+      [dir='rtl'] & {
+        transform: rotate(180deg);
+      }
     }
   }