From fbd81b4eda37b4f7eb337c70846b6349aabb3db9 Mon Sep 17 00:00:00 2001
From: Carl Schwan <carl@carlschwan.eu>
Date: Sat, 17 Jun 2023 21:24:24 +0200
Subject: [PATCH] Redesign timeline

Remove border von bubbles and only hilight the bubble on hover
---
 src/qml/Component/Timeline/ReactionDelegate.qml  |  8 ++++----
 src/qml/Component/Timeline/TimelineContainer.qml | 16 +++++++++-------
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/qml/Component/Timeline/ReactionDelegate.qml b/src/qml/Component/Timeline/ReactionDelegate.qml
index 8d8d503bf..2908a7280 100644
--- a/src/qml/Component/Timeline/ReactionDelegate.qml
+++ b/src/qml/Component/Timeline/ReactionDelegate.qml
@@ -50,10 +50,10 @@ Flow {
                 Kirigami.Theme.inherit: false
                 Kirigami.Theme.colorSet: Kirigami.Theme.View
                 radius: height / 2
-                shadow.size: Kirigami.Units.smallSpacing
-                shadow.color: !model.hasLocalUser ? Qt.rgba(0.0, 0.0, 0.0, 0.10) : Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.10)
-                border.color: Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.15)
-                border.width: 1
+                shadow {
+                    size: Kirigami.Units.smallSpacing
+                    color: !model.hasLocalUser ? Qt.rgba(0.0, 0.0, 0.0, 0.10) : Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.10)
+                }
             }
 
             onClicked: reactionClicked(model.reaction)
diff --git a/src/qml/Component/Timeline/TimelineContainer.qml b/src/qml/Component/Timeline/TimelineContainer.qml
index 969c78587..ac242c837 100644
--- a/src/qml/Component/Timeline/TimelineContainer.qml
+++ b/src/qml/Component/Timeline/TimelineContainer.qml
@@ -520,7 +520,9 @@ ColumnLayout {
                     anchors.fill: parent
                     Kirigami.Theme.colorSet: Kirigami.Theme.View
                     color: {
-                        if (root.author.isLocalUser) {
+                        if (mainContainer.hovered) {
+                            return Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.highlightColor, 0.15)
+                        } else if (root.author.isLocalUser) {
                             return Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.highlightColor, 0.15)
                         } else if (root.showHighlight) {
                             return Kirigami.Theme.positiveBackgroundColor
@@ -528,11 +530,11 @@ ColumnLayout {
                             return Kirigami.Theme.backgroundColor
                         }
                     }
-                    radius: Kirigami.Units.smallSpacing
-                    shadow.size: Kirigami.Units.smallSpacing
-                    shadow.color: root.showHighlight ? Qt.rgba(0.0, 0.0, 0.0, 0.10) : Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.10)
-                    border.color: Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.15)
-                    border.width: 1
+                    radius: Kirigami.Units.largeSpacing
+                    shadow {
+                        size: Kirigami.Units.smallSpacing
+                        color: root.isHighlighted ? Qt.rgba(0.0, 0.0, 0.0, 0.10) : Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.10)
+                    }
 
                     Behavior on color {
                         enabled: isTemporaryHighlighted
@@ -543,7 +545,7 @@ ColumnLayout {
         }
 
         background: Rectangle {
-            visible: mainContainer.hovered
+            visible: mainContainer.hovered && Config.compactLayout
             color: Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.highlightColor, 0.15)
             radius: Kirigami.Units.smallSpacing
         }