shuffle around all the CSS to de-atomify it and make it match the react components

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

@@ -0,0 +1,190 @@
+/*
+Copyright 2015 OpenMarket Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+.mx_EventTile {
+    max-width: 100%;
+    clear: both;
+    margin-top: 24px;
+    margin-left: 65px;
+}
+
+.mx_EventTile_avatar {
+    padding-left: 18px;
+    padding-right: 12px;
+    margin-left: -73px;
+    margin-top: -2px;
+    float: left;
+    position: relative;
+    top: 0px;
+}
+
+.mx_EventTile_avatar img {
+    border-radius: 20px;
+    border: 0px;
+}
+
+.mx_EventTile_continuation {
+    margin-top: 8px ! important;
+}
+
+.mx_EventTile .mx_SenderProfile {
+    color: #454545;
+    opacity: 0.5;
+    font-size: 13px;
+    margin-bottom: 4px;
+    display: block;
+    overflow-y: hidden;
+}
+
+.mx_EventTile .mx_MessageTimestamp {
+    color: #acacac;
+    font-size: 11px;
+}
+
+.mx_EventTile_line {
+    position: relative;
+}
+
+.mx_EventTile_content {
+    padding-right: 100px;
+    display: block;
+}
+
+.mx_EventTile_content {
+    display: block;
+    margin-right: 100px;
+    overflow-y: hidden;
+}
+
+/* Various markdown overrides */
+
+.mx_EventTile_content .markdown-body {
+    font-family: inherit ! important;
+    white-space: normal ! important;
+    line-height: inherit ! important;
+    color: inherit;
+    font-size: 15px;
+}
+
+.mx_EventTile_content .markdown-body h1,
+.mx_EventTile_content .markdown-body h2,
+.mx_EventTile_content .markdown-body h3,
+.mx_EventTile_content .markdown-body h4,
+.mx_EventTile_content .markdown-body h5,
+.mx_EventTile_content .markdown-body h6
+{
+    font-family: inherit ! important;
+}
+
+.mx_EventTile_content .markdown-body a {
+    color: #76cfa6;
+}
+
+.mx_EventTile_content .markdown-body .hljs {
+    display: inherit ! important;
+}
+
+/* end of overrides */
+
+.mx_EventTile_searchHighlight {
+    background-color: #76cfa6;
+    color: #fff;
+    border-radius: 5px;
+    padding: 4px;
+}
+
+.mx_EventTile_searchHighlight a {
+    background-color: #76cfa6;
+    color: #fff;    
+}
+
+.mx_EventTile_sending {
+    color: #ddd;
+}
+
+.mx_EventTile_notSent {
+    color: #f44;
+}
+
+.mx_EventTile_highlight,
+.mx_EventTile_highlight .markdown-body
+ {
+    color: #FF0064;
+}
+
+.mx_EventTile_contextual {
+    opacity: 0.4;
+}
+
+.mx_EventTile_msgOption {
+    float: right;
+    text-align: right;
+    z-index: 1;
+    position: relative;
+    width: 90px;
+    margin-right: 10px;
+    margin-top: -6px;
+}
+
+.mx_EventTile .mx_MessageTimestamp {
+    display: block;
+    visibility: hidden;
+    text-align: right;
+}
+
+.mx_EventTile_last .mx_MessageTimestamp {
+    visibility: visible;
+}
+
+.mx_EventTile:hover .mx_MessageTimestamp {
+    visibility: visible;
+}
+
+.mx_EventTile_editButton {
+    position: absolute;
+    display: inline-block;
+    visibility: hidden; 
+}
+
+.mx_EventTile:hover .mx_EventTile_editButton {
+    visibility: visible;
+}
+
+.mx_EventTile.menu .mx_EventTile_editButton {
+    visibility: visible;
+}
+
+.mx_EventTile.menu .mx_MessageTimestamp {
+    visibility: visible;
+}
+
+.mx_EventTile_readAvatars {
+    position: relative;
+    display: inline-block;
+    width: 14px;
+    height: 14px;
+}
+
+.mx_EventTile_readAvatars .mx_MemberAvatar {
+    position: absolute;
+    display: inline-block;
+}
+
+.mx_EventTile_readAvatarRemainder {
+    color: #acacac;
+    font-size: 11px;
+    position: absolute;
+}