diff --git a/resources/qml/Avatar.qml b/resources/qml/Avatar.qml
index 076e84c0d7dc70f7053f1344fd971210292fe7fe..aa873ffea549f6416a7cd5d04a294576763d0a01 100644
--- a/resources/qml/Avatar.qml
+++ b/resources/qml/Avatar.qml
@@ -38,6 +38,13 @@ Rectangle {
         sourceSize.height: avatar.height
         layer.enabled: true
 
+        MouseArea {
+            id: mouseArea
+
+            anchors.fill: parent
+            onClicked: TimelineManager.openImageOverlay(TimelineManager.timeline.avatarUrl(userid), TimelineManager.timeline.data.id)
+        }
+
         layer.effect: OpacityMask {
 
             maskSource: Rectangle {
@@ -49,12 +56,6 @@ Rectangle {
 
         }
 
-        MouseArea {
-            id: mouseArea
-
-            anchors.fill: parent
-            onClicked: TimelineManager.openImageOverlay(TimelineManager.timeline.avatarUrl(userid), TimelineManager.timeline.data.id)
-        }
     }
 
     Rectangle {
diff --git a/resources/qml/delegates/TextMessage.qml b/resources/qml/delegates/TextMessage.qml
index 8a1c116e775936b88ad389e0a88d58b3b9b32aa4..3ff771dcdb5b62f56523a9732e208ed5dffcb9a4 100644
--- a/resources/qml/delegates/TextMessage.qml
+++ b/resources/qml/delegates/TextMessage.qml
@@ -4,7 +4,7 @@ import im.nheko 1.0
 MatrixText {
     property string formatted: model.data.formattedBody
 
-    text: "<style type=\"text/css\">a { color:" + colors.link + ";}</style>" + formatted.replace("<pre>", "<pre style='white-space: pre-wrap'>")
+    text: "<span style='white-space: pre-wrap'><style type=\"text/css\">a { color:" + colors.link + ";}\ncode { background-color: " + colors.alternateBase + ";}</style>" + formatted.replace("<pre>", "<pre style='white-space: pre-wrap; background-color: " + colors.alternateBase + "'>") + "</span>"
     width: parent ? parent.width : undefined
     height: isReply ? Math.round(Math.min(timelineRoot.height / 8, implicitHeight)) : undefined
     clip: isReply