swarmdetailspanel: improve about buttons

Change-Id: I4b8e162f8a39363eae614545047056eb4b0ea55a

qml.qrc

@@ -115,6 +115,7 @@
         <file>src/app/mainview/components/CallViewContextMenu.qml</file>
         <file>src/app/mainview/components/UserProfile.qml</file>
         <file>src/app/mainview/components/SwarmDetailsPanel.qml</file>
+        <file>src/app/mainview/components/SwarmDetailsItem.qml</file>
         <file>src/app/mainview/components/AddMemberPanel.qml</file>
         <file>src/app/mainview/components/SelectScreen.qml</file>
         <file>src/app/mainview/components/ScreenRubberBand.qml</file>

src/app/mainview/components/SwarmDetailsItem.qml

@@ -0,0 +1,39 @@
+/*
+ * Copyright (C) 2022 Savoir-faire Linux Inc.
+ * Author: Sébastien Blin <sebastien.blin@savoirfairelinux.com>
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+import net.jami.Models 1.1
+import net.jami.Adapters 1.1
+import net.jami.Constants 1.1
+
+Rectangle {
+    id: root
+
+    color: "transparent"
+
+    HoverHandler {
+        target: parent
+        enabled: parent.visible
+        onHoveredChanged: {
+            parent.color = hovered ? Qt.darker(JamiTheme.selectedColor, 1.05) : "transparent"
+        }
+    }
+}

src/app/mainview/components/SwarmDetailsPanel.qml

@@ -227,16 +227,18 @@ Rectangle {
                 anchors.left: parent.left
                 anchors.right: parent.right
                 anchors.rightMargin: JamiTheme.settingsMarginSize
-                spacing: JamiTheme.preferredMarginSize
                 visible: tabBar.currentIndex === 0
                 Layout.alignment: Qt.AlignTop
 
+                SwarmDetailsItem {
+                    Layout.fillWidth: true
+                    Layout.preferredHeight: JamiTheme.settingsFontSize + 2 * JamiTheme.preferredMarginSize + 4
+
                     ToggleSwitch {
                         id: ignoreSwarm
 
-                    Layout.fillWidth: true
+                        anchors.fill: parent
-                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                        anchors.leftMargin: JamiTheme.preferredMarginSize
-                    Layout.topMargin: JamiTheme.preferredMarginSize
 
                         checked: false // TODO
 
@@ -249,8 +251,9 @@ Rectangle {
                             // TODO
                         }
                     }
+                }
 
-                Rectangle {
+                SwarmDetailsItem {
                     Layout.fillWidth: true
                     Layout.preferredHeight: JamiTheme.settingsFontSize + 2 * JamiTheme.preferredMarginSize + 4
 
@@ -268,16 +271,6 @@ Rectangle {
                         color: JamiTheme.textColor
                     }
 
-                    color: "transparent"
-
-                    HoverHandler {
-                        target: parent
-                        enabled: parent.visible
-                        onHoveredChanged: {
-                            parent.color = hovered ? Qt.darker(JamiTheme.selectedColor, 1.05) : "transparent"
-                        }
-                    }
-
                     TapHandler {
                         target: parent
                         enabled: parent.visible
@@ -287,8 +280,13 @@ Rectangle {
                     }
                 }
 
+                SwarmDetailsItem {
+                    Layout.fillWidth: true
+                    Layout.preferredHeight: JamiTheme.settingsFontSize + 2 * JamiTheme.preferredMarginSize + 4
+
                     RowLayout {
-                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                        anchors.fill: parent
+                        anchors.leftMargin: JamiTheme.preferredMarginSize
 
                         Text {
                             Layout.fillWidth: true
@@ -315,12 +313,14 @@ Rectangle {
                             radius: JamiTheme.aboutBtnSize / 2
 
                             color: CurrentConversation.color
+                        }
+                    }
 
-                        MouseArea {
+                    TapHandler {
-                            id: mouseArea
+                        target: parent
-                            anchors.fill: parent
+                        enabled: parent.visible
-                            hoverEnabled: true
+                        onTapped: function onTapped(eventPoint) {
-                            onClicked: colorDialog.open()
+                            colorDialog.open()
                         }
                     }
                 }

src/app/settingsview/components/ToggleSwitch.qml

@@ -70,4 +70,12 @@ RowLayout {
 
         onToggled: switchToggled()
     }
+
+    TapHandler {
+        target: parent
+        enabled: parent.visible
+        onTapped: function onTapped(eventPoint) {
+            switchOfLayout.checked = !switchOfLayout.checked
+        }
+    }
 }