Merge pull request #581 from vector-im/matthew/css-refactor

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

src/skins/vector/css/matrix-react-sdk/views/messages/MImageBody.css

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_MImageTile_thumbnail {
+.mx_MImageBody_thumbnail {
 /*
     background-color: #fff;
     border: 2px solid #fff;
@@ -22,16 +22,16 @@ limitations under the License.
 */
 }
 
-.mx_MImageTile_download {
+.mx_MImageBody_download {
     color: #76cfa6;
     cursor: pointer;
 }
 
-.mx_MImageTile_download a {
+.mx_MImageBody_download a {
     color: #76cfa6;
     text-decoration: none;
 }
 
-.mx_MImageTile_download img {
+.mx_MImageBody_download img {
     padding-right: 8px;
-}
+}

src/skins/vector/css/matrix-react-sdk/views/messages/MNoticeBody.css

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_MNoticeTile {
+.mx_MNoticeBody {
     white-space: pre-wrap;
     opacity: 0.6;
 }

src/skins/vector/css/matrix-react-sdk/views/messages/MTextBody.css

@@ -14,6 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_MTextTile {
+.mx_MTextBody {
     white-space: pre-wrap;
 }

src/skins/vector/css/matrix-react-sdk/views/messages/TextualEvent.css

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-.mx_EventAsTextTile {
+.mx_TextualEvent {
     opacity: 0.5;
     overflow-y: hidden;
 }

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

@@ -63,7 +63,7 @@ limitations under the License.
     display: block;
 }
 
-.mx_MessageTile_content {
+.mx_EventTile_content {
     display: block;
     margin-right: 100px;
     overflow-y: hidden;
@@ -71,7 +71,7 @@ limitations under the License.
 
 /* Various markdown overrides */
 
-.mx_MessageTile_content .markdown-body {
+.mx_EventTile_content .markdown-body {
     font-family: inherit ! important;
     white-space: normal ! important;
     line-height: inherit ! important;
@@ -79,34 +79,34 @@ limitations under the License.
     font-size: 15px;
 }
 
-.mx_MessageTile_content .markdown-body h1,
-.mx_MessageTile_content .markdown-body h2,
-.mx_MessageTile_content .markdown-body h3,
-.mx_MessageTile_content .markdown-body h4,
-.mx_MessageTile_content .markdown-body h5,
-.mx_MessageTile_content .markdown-body h6
+.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_MessageTile_content .markdown-body a {
+.mx_EventTile_content .markdown-body a {
     color: #76cfa6;
 }
 
-.mx_MessageTile_content .markdown-body .hljs {
+.mx_EventTile_content .markdown-body .hljs {
     display: inherit ! important;
 }
 
 /* end of overrides */
 
-.mx_MessageTile_searchHighlight {
+.mx_EventTile_searchHighlight {
     background-color: #76cfa6;
     color: #fff;
     border-radius: 5px;
     padding: 4px;
 }
 
-.mx_MessageTile_searchHighlight a {
+.mx_EventTile_searchHighlight a {
     background-color: #76cfa6;
     color: #fff;    
 }
@@ -139,7 +139,7 @@ limitations under the License.
     margin-top: -6px;
 }
 
-.mx_MessageTimestamp {
+.mx_EventTile .mx_MessageTimestamp {
     display: block;
     visibility: hidden;
     text-align: right;