Use classNames instead of inline style

Theres no benefit to using inline styles

src/components/views/rooms/DNDRoomTile.js

@@ -18,18 +18,19 @@ import React from 'react';
 import { Draggable } from 'react-beautiful-dnd';
 import RoomTile from 'matrix-react-sdk/lib/components/views/rooms/RoomTile';
 
+import classNames from 'classnames';
+
 export default class DNDRoomTile extends React.Component {
     constructor() {
         super();
-        this.getStyle = this.getStyle.bind(this);
+        this.getClassName = this.getClassName.bind(this);
     }
 
-    getStyle(isDragging) {
+    getClassName(isDragging) {
-        const result = {
+        return classNames({
-            transform: isDragging ? "scale(1.05, 1.05)" : "none",
+            "mx_DNDRoomTile": true,
-            transition: "transform 0.2s",
+            "mx_DNDRoomTile_dragging": isDragging,
-        };
+        });
-        return result;
     }
 
     render() {
@@ -49,7 +50,7 @@ export default class DNDRoomTile extends React.Component {
                                 {...provided.draggableProps}
                                 {...provided.dragHandleProps}
                             >
-                                <div style={this.getStyle(snapshot.isDragging)}>
+                                <div className={this.getClassName(snapshot.isDragging)}>
                                     <RoomTile {...props} />
                                 </div>
                             </div>

src/skins/vector/css/matrix-react-sdk/views/rooms/_RoomTile.scss

@@ -157,6 +157,15 @@ limitations under the License.
     background-color: $roomtile-selected-bg-color;
 }
 
+.mx_DNDRoomTile {
+    transform: none;
+    transition: transform 0.2s;
+}
+
+.mx_DNDRoomTile_dragging {
+    transform: scale(1.05, 1.05);
+}
+
 .mx_RoomTile:focus {
     filter: none ! important;
     background-color: $roomtile-focused-bg-color;