Don’t reverse all button icons

The ‘back/retry’ button in the connection modal should be reversed, but the others (bluetooth icon, question mark) probably shouldn’t.

src/components/connection-modal/connection-modal.css

@@ -315,6 +315,10 @@
 
 [dir="rtl"] .button-icon-left {
     margin-left: 0.5rem;
+}
+
+/* reverse back arrow icon for RTL, don't reverse other connection icons */
+[dir="rtl"] .button-icon-back {
     transform: scaleX(-1);
 }
 

src/components/connection-modal/error-step.jsx

 import {FormattedMessage} from 'react-intl';
 import PropTypes from 'prop-types';
+import classNames from 'classnames';
 import React from 'react';
 
 import Box from '../box/box.jsx';
@@ -39,7 +40,7 @@ const ErrorStep = props => (
                     onClick={props.onScanning}
                 >
                     <img
-                        className={styles.buttonIconLeft}
+                        className={classNames(styles.buttonIconLeft, styles.buttonIconBack)}
                         src={backIcon}
                     />
                     <FormattedMessage

src/components/connection-modal/unavailable-step.jsx

 import {FormattedMessage} from 'react-intl';
 import PropTypes from 'prop-types';
+import classNames from 'classnames';
 import React from 'react';
 
 import Box from '../box/box.jsx';
@@ -64,7 +65,7 @@ const UnavailableStep = props => (
                     onClick={props.onScanning}
                 >
                     <img
-                        className={styles.buttonIconLeft}
+                        className={classNames(styles.buttonIconLeft, styles.buttonIconBack)}
                         src={backIcon}
                     />
                     <FormattedMessage