From 015093b371074c1318fa140c166585c4c68b6778 Mon Sep 17 00:00:00 2001
From: Luke Barnard <luke@matrix.org>
Date: Fri, 18 May 2018 11:33:33 +0100
Subject: [PATCH] Move inline style to stylesheet

---
 res/css/views/messages/_MImageBody.scss     | 10 ++++++++++
 src/components/views/messages/MImageBody.js | 10 ++--------
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/res/css/views/messages/_MImageBody.scss b/res/css/views/messages/_MImageBody.scss
index 5eef236b26..64821434dd 100644
--- a/res/css/views/messages/_MImageBody.scss
+++ b/res/css/views/messages/_MImageBody.scss
@@ -35,3 +35,13 @@ limitations under the License.
     // Make sure the _thumbnail is positioned relative to the _container
     position: relative;
 }
+
+.mx_MImageBody_thumbnail_spinner {
+    display: flex;
+    align-items: center;
+    width: 100%;
+}
+
+.mx_MImageBody_thumbnail_spinner img {
+    margin: auto;
+}
diff --git a/src/components/views/messages/MImageBody.js b/src/components/views/messages/MImageBody.js
index 656bd02840..d9108a2fe1 100644
--- a/src/components/views/messages/MImageBody.js
+++ b/src/components/views/messages/MImageBody.js
@@ -239,14 +239,8 @@ export default class extends React.Component {
         let img = null;
         // e2e image hasn't been decrypted yet
         if (content.file !== undefined && this.state.decryptedUrl === null) {
-            img = <div className="mx_MImageBody_thumbnail" ref="image" style={{
-                "display": "flex",
-                "alignItems": "center",
-                "width": "100%",
-            }}>
-                <img src="img/spinner.gif" alt={content.body} width="32" height="32" style={{
-                    "margin": "auto",
-                }} />
+            img = <div className="mx_MImageBody_thumbnail mx_MImageBody_thumbnail_spinner" ref="image">
+                <img src="img/spinner.gif" alt={content.body} width="32" height="32" />
             </div>;
         } else if (thumbUrl && !this.state.imgError) {
             // Restrict the width of the thumbnail here, otherwise it will fill the container