From 07f29ebcb94dbb71c420dcac0f9ba3d3b88ed8e6 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sun, 6 Sep 2020 14:15:06 -0500
Subject: [PATCH] Chats: put attachment above content

---
 app/soapbox/features/chats/components/chat_message_list.js | 2 +-
 app/styles/chats.scss                                      | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js
index d6acefe2f..2ff423143 100644
--- a/app/soapbox/features/chats/components/chat_message_list.js
+++ b/app/soapbox/features/chats/components/chat_message_list.js
@@ -173,11 +173,11 @@ class ChatMessageList extends ImmutablePureComponent {
               className='chat-message__bubble'
               ref={this.setBubbleRef}
             >
+              {this.maybeRenderMedia(chatMessage)}
               <span
                 className='chat-message__content'
                 dangerouslySetInnerHTML={{ __html: this.parseContent(chatMessage) }}
               />
-              {this.maybeRenderMedia(chatMessage)}
             </div>
           </div>
         ))}
diff --git a/app/styles/chats.scss b/app/styles/chats.scss
index 7af2fb5f8..e15dd9e90 100644
--- a/app/styles/chats.scss
+++ b/app/styles/chats.scss
@@ -308,6 +308,7 @@
 
 .chat-message .media-gallery {
   height: 120px !important;
+  margin: 4px 0 8px;
 
   .spoiler-button {
     display: none;