GODT-22: Frontend-backend

- GODT-1246 Implement settings view.
- GODT-1257 GODT-1246: Account and Help view
- GODT-1298: Minimal working build (panics)
- GODT-1298: loading QML (needs Popup window)
- GODT-1298: WARN: Adding PopupWindow not possible!
    In therecipe qt the `quickwidgets` classes are within `quick` module, but
    forgot to add library and include paths into cgo flags. Therefore
    compilation fails and it would be hard to patch therecipe in order to
    fix it.

    I am not sure if rewrite PopupWindow into go would make any difference,
    therefore I decided to use normal QML Window without borders.
- GODT-1298: Rework status window, add backend props, slots and signals.
- GODT-1298: Users
- GODT-1298: Login
- GODT-1298: WIP Help and bug report
- GODT-1178: MacOS dock icon control
- GODT-1298: Help, bug report, update and events
- GODT-1298: Apple Mail config and Settings (without cache on disk)

internal/frontend/qml/Proton/Toggle.qml

@@ -0,0 +1,107 @@
+// Copyright (c) 2021 Proton Technologies AG
+//
+// This file is part of ProtonMail Bridge.
+//
+// ProtonMail Bridge 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.
+//
+// ProtonMail Bridge 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 ProtonMail Bridge.  If not, see <https://www.gnu.org/licenses/>.
+
+import QtQuick 2.13
+import QtQuick.Layouts 1.12
+import QtQuick.Controls 2.13
+import QtQuick.Controls.impl 2.13
+
+RowLayout{
+    id: root
+    property var colorScheme
+    property bool checked
+    property bool disabled
+    property bool hovered
+    property bool loading
+
+    signal clicked
+
+    Rectangle {
+        id: indicator
+        implicitWidth: 40
+        implicitHeight: 24
+
+        radius: 20
+        color: {
+            if (root.loading) return "transparent"
+            if (root.disabled) return root.colorScheme.background_strong
+            return root.colorScheme.background_norm
+        }
+        border {
+            width: 1
+            color: (root.disabled || root.loading) ? "transparent" : colorScheme.field_norm
+        }
+
+        Rectangle {
+            anchors.verticalCenter: indicator.verticalCenter
+            anchors.left: indicator.left
+            anchors.leftMargin: root.checked ? 16 : 0
+            width: 24
+            height: 24
+            radius: 12
+            color: {
+                if (root.loading) return "transparent"
+                if (root.disabled) return root.colorScheme.field_disabled
+
+                if (root.checked) {
+                    if (root.hovered) return root.colorScheme.interaction_norm_hover
+                    return root.colorScheme.interaction_norm
+                } else {
+                    if (root.hovered) return root.colorScheme.field_hover
+                    return root.colorScheme.field_norm
+                }
+            }
+
+            ColorImage {
+                anchors.centerIn: parent
+                source: "../icons/ic-check.svg"
+                color: root.colorScheme.background_norm
+                height: root.colorScheme.body_font_size
+                visible: root.checked
+            }
+        }
+
+        ColorImage {
+            id: loader
+            anchors.centerIn: parent
+            source: "../icons/Loader_16.svg"
+            color: root.colorScheme.text_norm
+            height: root.colorScheme.body_font_size
+            visible: root.loading
+
+            RotationAnimation {
+                target: loader
+                loops: Animation.Infinite
+                duration: 1000
+                from: 0
+                to: 360
+                direction: RotationAnimation.Clockwise
+                running: root.loading
+            }
+        }
+
+        MouseArea {
+            anchors.fill: indicator
+            hoverEnabled: true
+            onEntered: {root.hovered = true }
+            onExited: {root.hovered = false }
+            onClicked: { root.clicked();}
+            onPressed: {root.hovered = true }
+            onReleased: { root.hovered = containsMouse }
+        }
+    }
+}