Adopt style from devin fork

It looks nicer and will make it easier to merge the two project
together :)

Signed-off-by: Carl Schwan <carl@carlschwan.eu>

src/mail/qml/ConversationViewer.qml

 // SPDX-FileCopyrightText: 2016 Michael Bohlender <michael.bohlender@kdemail.net>
+// SPDX-FileCopyrightText: 2022 Devin Lin <espidev@gmail.com>
 // SPDX-License-Identifier: LGPL-2.1-only OR LGPL-3.0-only OR LicenseRef-KDE-Accepted-LGPL
 
 import QtQuick 2.15
 import QtQuick.Layouts 1.15
-import org.kde.kirigami 2.14 as Kirigami
 import QtQuick.Controls 2.15 as QQC2
+
 import org.kde.kalendar 1.0
 import org.kde.kalendar.mail 1.0
+import org.kde.kirigami 2.14 as Kirigami
 import org.kde.kitemmodels 1.0 as KItemModels
+
 import './mailpartview'
 
 Kirigami.ScrollablePage {
     id: root
-
-    title: props.title
     readonly property int mode: KalendarApplication.Mail
+
     property var item
     property var props
 
+    leftPadding: 0
+    rightPadding: 0
+    topPadding: 0
+    bottomPadding: 0
+
+    contextualActions: [
+        Kirigami.Action {
+            text: i18n("Move to trash")
+            iconName: "albumfolder-user-trash"
+            // TODO implement move to trash
+        }
+    ]
+
     ColumnLayout {
+        spacing: 0
+
+        QQC2.Label {
+            Layout.leftMargin: Kirigami.Units.largeSpacing * 2
+            Layout.rightMargin: Kirigami.Units.largeSpacing * 2
+            Layout.topMargin: Kirigami.Units.gridUnit
+            Layout.bottomMargin: Kirigami.Units.gridUnit
+            Layout.fillWidth: true
+
+            text: props.title
+            maximumLineCount: 2
+            wrapMode: Text.Wrap
+            elide: Text.ElideRIght
+
+            font.pointSize: Kirigami.Theme.defaultFont.pointSize * 1.2
+        }
+
         // TODO use repeater to see the full conversation
         MailViewer {
             Layout.fillWidth: true

src/mail/qml/MailViewer.qml

 // SPDX-FileCopyrightText: 2022 Carl Schwan <carl@carlschwan.eu>
+// SPDX-FileCopyrightText: 2022 Devin Lin <espidev@gmail.com>
 // SPDX-License-Identifier: LGPL-2.1-only OR LGPL-3.0-only OR LicenseRef-KDE-Accepted-LGPL
 
 import QtQuick 2.15
 import QtQuick.Layouts 1.15
-import org.kde.kirigami 2.14 as Kirigami
 import QtQuick.Controls 2.15 as QQC2
 import QtGraphicalEffects 1.15
+
 import org.kde.kalendar 1.0
 import org.kde.kalendar.mail 1.0
+import org.kde.kirigami 2.14 as Kirigami
 import org.kde.kitemmodels 1.0 as KItemModels
+
 import './mailpartview'
 import './private'
 
@@ -26,111 +29,83 @@ QQC2.Page {
 
     padding: Kirigami.Units.largeSpacing * 2
 
-    background: Kirigami.ShadowedRectangle {
-        id: mailBackground
-        color: Kirigami.Theme.backgroundColor
-        radius: Kirigami.Units.largeSpacing
-
-        shadow.size: Kirigami.Units.largeSpacing
-        shadow.color: Qt.rgba(0.0, 0.0, 0.0, 0.2)
-        shadow.yOffset: 2
-
-        border.width: 1
-        border.color: Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.2)
-    }
-
     header: QQC2.ToolBar {
         id: mailHeader
         padding: root.padding
 
         Kirigami.Theme.inherit: false
-        Kirigami.Theme.colorSet: Kirigami.Theme.Header
+        Kirigami.Theme.colorSet: Kirigami.Theme.View
 
         background: Item {
             Rectangle {
-                id: mailHeaderBackgroundTop
-                anchors.top: parent.top
-                anchors.left: parent.left
-                anchors.right: parent.right
-                anchors.bottom: mailHeaderBackgroundCenter.bottom
-                height: parent.height * 0.5
-                color: Kirigami.Theme.backgroundColor
-                radius: mailBackground.radius
-                border.width: mailBackground.border.width
-                border.color: Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.2)
+                anchors.fill: parent
+                color: Kirigami.Theme.alternateBackgroundColor
             }
 
-            Rectangle {
-                id: mailHeaderBackgroundBottom
-                anchors.top: mailHeaderBackgroundCenter.verticalCenter
+            Kirigami.Separator {
+                anchors.top: parent.top
                 anchors.left: parent.left
                 anchors.right: parent.right
-                anchors.bottom: parent.bottom
-                color: Kirigami.Theme.backgroundColor
-                border.width: mailHeaderBackgroundTop.border.width
-                border.color: Kirigami.ColorUtils.tintWithAlpha(color, Kirigami.Theme.textColor, 0.2)
-
-                Kirigami.Separator {
-                    anchors {
-                        left: parent.left
-                        right: parent.right
-                        top: undefined
-                        bottom:  parent.bottom
-                    }
-                }
             }
 
-            Rectangle {
-                id: mailHeaderBackgroundCenter
+            Kirigami.Separator {
+                anchors.bottom: parent.bottom
                 anchors.left: parent.left
                 anchors.right: parent.right
-                anchors.margins: mailHeaderBackgroundTop.border.width
-                anchors.verticalCenter: parent.verticalCenter
-                height: parent.height / 2
-                color: Kirigami.Theme.backgroundColor
             }
         }
 
-        GridLayout {
-            anchors.fill: parent
-            columns: 3
-            QQC2.Label {
-                text: i18n('From:')
-                font.bold: true
-                Layout.rightMargin: Kirigami.Units.largeSpacing
-            }
+        ColumnLayout {
+            width: mailHeader.width - mailHeader.leftPadding - mailHeader.rightPadding
+            spacing: Kirigami.Units.smallSpacing
 
-            QQC2.Label {
-                text: root.from
+            RowLayout {
+                Layout.fillWidth: true
+
+                QQC2.Label {
+                    text: root.from
+                    elide: Text.ElideRight
+                    Layout.fillWidth: true
+                }
+
+                QQC2.Label {
+                    text: root.dateTime.toLocaleString(Qt.locale(), Locale.ShortFormat)
+                    horizontalAlignment: Text.AlignRight
+                }
             }
 
-            QQC2.Label {
-                text: root.dateTime.toLocaleString()
+            RowLayout {
                 Layout.fillWidth: true
-                horizontalAlignment: Text.AlignRight
-            }
 
-            QQC2.Label {
-                text: i18n('Sender:')
-                font.bold: true
-                visible: root.sender.length > 0 && root.sender !== root.from
-                Layout.rightMargin: Kirigami.Units.largeSpacing
-            }
+                QQC2.Label {
+                    text: i18n('Sender:')
+                    font.bold: true
+                    visible: root.sender.length > 0 && root.sender !== root.from
+                    Layout.rightMargin: Kirigami.Units.largeSpacing
+                }
 
-            QQC2.Label {
-                visible: root.sender.length > 0 && root.sender !== root.from
-                text: root.sender
-                Layout.columnSpan: 2
+                QQC2.Label {
+                    visible: root.sender.length > 0 && root.sender !== root.from
+                    text: root.sender
+                    elide: Text.ElideRight
+                    Layout.fillWidth: true
+                }
             }
 
-            QQC2.Label {
-                text: i18n('To:')
-                font.bold: true
-                Layout.rightMargin: Kirigami.Units.largeSpacing
-            }
+            RowLayout {
+                Layout.fillWidth: true
+
+                QQC2.Label {
+                    text: i18n('To:')
+                    font.bold: true
+                    Layout.rightMargin: Kirigami.Units.largeSpacing
+                }
 
-            QQC2.Label {
-                text: root.to
+                QQC2.Label {
+                    text: root.to
+                    elide: Text.ElideRight
+                    Layout.fillWidth: true
+                }
             }
         }
     }

src/mail/qml/mailpartview/TextPart.qml

@@ -34,12 +34,12 @@ Item {
         padding: 0
 
         anchors {
-            top: parent.top
             left: parent.left
             right: parent.right
+            top: parent.top
         }
 
-        text: content.substring(0, 100000) //The TextEdit deals poorly with messages that are too large.
+        text: content.substring(0, 100000).replace(/\u00A0/g,' ') //The TextEdit deals poorly with messages that are too large.
         color: embedded ? Kirigami.Theme.disabledTextColor : Kirigami.Theme.textColor
         onLinkActivated: Qt.openUrlExternally(link)