Fix conversations message overflow when posting code

Related issue: https://github.com/twbs/bootstrap/issues/15958

closes #7055

Changelog.md

@@ -9,6 +9,7 @@
 ## Bug fixes
 * Post comments no longer get collapsed when interacting with a post [#7040](https://github.com/diaspora/diaspora/pull/7040)
 * Closed accounts will no longer show up in the account search [#7042](https://github.com/diaspora/diaspora/pull/7042)
+* Code blocks in conversations no longer overflow the content [#7055](https://github.com/diaspora/diaspora/pull/7055)
 
 ## Features
 * Deleted comments will be removed when loading more comments [#7045](https://github.com/diaspora/diaspora/pull/7045)

app/views/conversations/_message.html.haml

@@ -0,0 +1,10 @@
+.stream_element.message{data: {guid: message.id}, id: ("first_unread" if @first_unread_message_id == message.id)}
+  .media
+    = person_image_link(message.author, size: :thumb_small, class: "img")
+    .bd
+      = person_link(message.author, class: "author from")
+      = timeago(message.created_at)
+
+      %div{class: direction_for(message.text)}
+        .message-content
+          = message.message.markdownified

app/views/conversations/_message.mobile.haml

@@ -1,15 +1,11 @@
--#   Copyright (c) 2010-2011, Diaspora Inc.  This file is
--#   licensed under the Affero General Public License version 3 or later.  See
--#   the COPYRIGHT file.
-
 .stream_element.message{data: {guid: message.id}, id: ("first_unread" if @first_unread_message_id == message.id)}
   .media
     .media-left
       = person_image_link(message.author, size: :thumb_small, class: "media-object")
     .media-body
-      = person_link(message.author, :class => 'author from')
+      = person_link(message.author, class: "author from")
       = timeago(message.created_at)
 
-      %div{ :class => direction_for(message.text) }
+      %div{class: direction_for(message.text)}
         .message-content
           = message.message.markdownified