From e49691fe3be0293a0d375a26e7f0941a44d8bd4c Mon Sep 17 00:00:00 2001
From: Jussi Kuokkanen <jussi.kuokkanen@protonmail.com>
Date: Thu, 17 Sep 2020 16:49:56 +0300
Subject: [PATCH] use Rectangle for typing users so it doesn't overlap with the
 timeline

---
 resources/qml/TimelineView.qml | 39 +++++++++++++++++++++++-----------
 1 file changed, 27 insertions(+), 12 deletions(-)

diff --git a/resources/qml/TimelineView.qml b/resources/qml/TimelineView.qml
index dd9c4029..1c16ddc6 100644
--- a/resources/qml/TimelineView.qml
+++ b/resources/qml/TimelineView.qml
@@ -324,18 +324,33 @@ Page {
 				id: footerContent
 				anchors.left: parent.left
 				anchors.right: parent.right
-
-				Label {
-					id: typingDisplay
-					anchors.left: parent.left
-					anchors.right: parent.right
-					anchors.leftMargin: 10
-					anchors.rightMargin: 10
-
-					color: colors.text
-					text: chat.model ? chat.model.formatTypingUsers(chat.model.typingUsers, colors.window) : ""
-					textFormat: Text.RichText
-				}
+                Rectangle {
+                    id: typingRect
+                    Connections {
+                        target: chat.model
+                        onTypingUsersChanged: {
+                            if (chat.model && chat.model.formatTypingUsers(chat.model.typingUsers,
+                                                                           colors.window) === "")
+                                typingRect.color = "transparent"
+                            else
+                                typingRect.color = colors.window
+                        }
+                    }
+                    anchors.left: parent.left
+                    anchors.right: parent.right
+                    anchors.leftMargin: 10
+                    anchors.rightMargin: 10
+                    color: "transparent"
+                    height: fontMetrics.height
+                    Label {
+                        id: typingDisplay
+                        anchors.left: parent.left
+                        anchors.right: parent.right
+                        color: colors.text
+                        text: chat.model ? chat.model.formatTypingUsers(chat.model.typingUsers, colors.window) : ""
+                        textFormat: Text.RichText
+                    }
+                }
 
 				Rectangle {
 					anchors.left: parent.left