diff --git a/src/app/qml/HoverLinkIndicator.qml b/src/app/qml/HoverLinkIndicator.qml index ed8084738..2f1c28f8c 100644 --- a/src/app/qml/HoverLinkIndicator.qml +++ b/src/app/qml/HoverLinkIndicator.qml @@ -3,29 +3,55 @@ // SPDX-License-Identifier: LGPL-2.0-or-later import QtQuick +import QtQuick.Layouts import QtQuick.Controls as QQC2 import org.kde.kirigami as Kirigami -QQC2.Control { +RowLayout { id: root property string text - visible: !root.text.startsWith("https://matrix.to/") && root.text.length > 0 - Kirigami.Theme.colorSet: Kirigami.Theme.View - - z: 20 - - Accessible.ignored: true - - contentItem: QQC2.Label { - text: root.text.startsWith("https://matrix.to/") ? "" : root.text - elide: Text.ElideRight - Accessible.description: i18nc("@info screenreader", "The currently selected link") + onTextChanged: { + // This is done so the text doesn't disappear for a split second while in the opacity transition + if (root.text.length > 0) { + urlLabel.text = root.text + } } - background: Rectangle { - color: Kirigami.Theme.backgroundColor + Kirigami.OverlayZStacking.layer: Kirigami.OverlayZStacking.ToolTip + z: Kirigami.OverlayZStacking.z + spacing: 0 + + opacity: (!root.text.startsWith("https://matrix.to/") && root.text.length > 0) ? 1 : 0 + visible: opacity > 0 + + Behavior on opacity { + OpacityAnimator { + duration: Kirigami.Units.shortDuration + easing.type: Easing.InOutQuad + } + } + + QQC2.Control { + Kirigami.Theme.colorSet: Kirigami.Theme.View + + Accessible.ignored: true + + contentItem: QQC2.Label { + id: urlLabel + + elide: Text.ElideRight + } + + background: Kirigami.ShadowedRectangle { + corners.topRightRadius: Kirigami.Units.cornerRadius + color: Kirigami.Theme.backgroundColor + border { + color: Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, Kirigami.Theme.frameContrast) + width: 1 + } + } } }