diff --git a/resources/qml/MessageInputWarning.qml b/resources/qml/MessageInputWarning.qml

index c2db2daa..af65ebc1 100644
--- a/resources/qml/MessageInputWarning.qml
+++ b/resources/qml/MessageInputWarning.qml
@@ -7,27 +7,27 @@ import QtQuick.Controls 2.3
 import QtQuick.Layouts 1.2
 import im.nheko 1.0
 
-Item {
+Rectangle {
     id: warningRoot
 
     required property string text
-    required property bool isVisible
 
-    implicitHeight: isVisible ? warningDisplay.implicitHeight + 2 * Nheko.paddingSmall : 0
+    implicitHeight: visible ? warningDisplay.implicitHeight + 4 * Nheko.paddingSmall : 0
     height: implicitHeight
     Layout.fillWidth: true
-    Layout.margins: isVisible ? Nheko.paddingSmall : 0
+    color: Nheko.colors.window // required to hide the timeline behind this warning
 
     Rectangle {
         id: warningRect
 
-        visible: warningRoot.isVisible
+        visible: warningRoot.visible
         // TODO: Qt.alpha() would make more sense but it wasn't working...
         color: Qt.rgba(Nheko.theme.error.r, Nheko.theme.error.g, Nheko.theme.error.b, 0.3)
         border.width: 1
         border.color: Nheko.theme.error
         radius: 3
         anchors.fill: parent
+        anchors.margins: visible ? Nheko.paddingSmall : 0
         z: 3
 
         Label {