Qml theme

src/gui/qml2/DissolveDark/Button.qml

@@ -0,0 +1,41 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+import QtQuick.Controls.impl
+
+T.Button {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            implicitContentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             implicitContentHeight + topPadding + bottomPadding)
+
+    padding: 4
+    spacing: 6
+
+    icon.width: 16
+    icon.height: 16
+
+    contentItem: IconLabel {
+        spacing: control.spacing
+        mirrored: control.mirrored
+        display: control.display
+
+        icon: control.icon
+        text: control.text
+        font: Theme.normalFont
+        color: Theme.getForegroundColour(control)
+    }
+
+    background: ButtonPanel {
+        implicitWidth: 80
+        implicitHeight: 24
+
+        control: control
+        visible: !control.flat || control.down || control.checked || control.highlighted || control.visualFocus
+            || (enabled && control.hovered)
+    }
+}

src/gui/qml2/DissolveDark/ButtonPanel.qml

@@ -0,0 +1,31 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+
+Rectangle {
+    id: panel
+
+    property Item control
+    property bool highlighted: control.highlighted
+
+    visible: !control.flat || control.down || control.checked
+
+    gradient: {
+        if (!control.enabled) { Theme.disabledGradient }
+        else (control.down || control.checked ? Theme.controlBackgroundGradient : Theme.controlForegroundGradient)
+    }
+
+    radius: 2
+    border.color: Theme.colours.mid
+
+    Rectangle {
+        x: 1; y: 1
+        width: parent.width - 2
+        height: parent.height - 2
+        border.color: Theme.colours.background
+        color: "transparent"
+
+        radius: 2
+    }
+}

src/gui/qml2/DissolveDark/CheckBox.qml

@@ -0,0 +1,35 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+
+T.CheckBox {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            implicitContentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             implicitContentHeight + topPadding + bottomPadding,
+                             implicitIndicatorHeight + topPadding + bottomPadding)
+
+    padding: 6
+    spacing: 6
+
+    indicator: CheckIndicator {
+        x: control.text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2
+        y: control.topPadding + (control.availableHeight - height) / 2
+        control: control
+    }
+
+    contentItem: Text {
+        leftPadding: control.indicator && !control.mirrored ? control.indicator.width + control.spacing : 0
+        rightPadding: control.indicator && control.mirrored ? control.indicator.width + control.spacing : 0
+
+        text: control.text
+        font: Theme.normalFont
+        color: Theme.getForegroundColour(control)
+        elide: Text.ElideRight
+        verticalAlignment: Text.AlignVCenter
+    }
+}

src/gui/qml2/DissolveDark/CheckIndicator.qml

@@ -0,0 +1,43 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+
+Rectangle {
+    id: indicator
+
+    property Item control
+
+    implicitWidth: 16
+    implicitHeight: 16
+
+    gradient: Theme.controlBackgroundGradient
+    border.color: Theme.colours.mid
+
+    Rectangle {
+        x: 1; y: 1
+        width: parent.width - 2
+        height: parent.width - 2
+        border.color: Theme.colours.background
+        gradient: Theme.controlBackgroundGradient
+
+        Image {
+            x: 1; y: 1
+            width: parent.width - 2
+            height: parent.width - 2
+            visible: indicator.control.checkState === Qt.Checked
+            source: "assets/tick.png"
+        }
+
+        Rectangle {
+            x: 2; y: 2
+            width: parent.width - 4
+            height: parent.width - 4
+
+            visible: indicator.control.checkState === Qt.PartiallyChecked
+
+            gradient: Theme.getAccentGradient(indicator.control)
+            border.color: Theme.colours.background
+        }
+    }
+}

src/gui/qml2/DissolveDark/GroupBox.qml

@@ -0,0 +1,40 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+
+T.GroupBox {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            contentWidth + leftPadding + rightPadding,
+                            implicitLabelWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             contentHeight + topPadding + bottomPadding)
+
+    spacing: 4
+    padding: 4
+    topPadding: padding + (implicitLabelWidth > 0 ? implicitLabelHeight + spacing : 0)
+
+    label: Text {
+        x: control.leftPadding
+        width: control.availableWidth
+
+        text: control.title
+        font: Theme.normalFont
+        color: Theme.getForegroundColour(control)
+        elide: Text.ElideRight
+        verticalAlignment: Text.AlignVCenter
+    }
+
+    background: Rectangle {
+        y: control.topPadding - control.bottomPadding
+        width: parent.width
+        height: parent.height - control.topPadding + control.bottomPadding
+
+        radius: 2
+        gradient: Theme.controlBackgroundGradient
+        border.color: Theme.colours.mid
+    }
+}

src/gui/qml2/DissolveDark/Label.qml

@@ -0,0 +1,12 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+
+T.Label {
+    id: control
+
+    font: Theme.normalFont
+    color: Theme.getForegroundColour(control)
+}

src/gui/qml2/DissolveDark/Pane.qml

@@ -0,0 +1,28 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+
+T.Pane {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            contentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             contentHeight + topPadding + bottomPadding)
+
+    topPadding: background ? background.topPadding : 0
+    leftPadding: background ? background.leftPadding : 0
+    rightPadding: background ? background.rightPadding : 0
+    bottomPadding: background ? background.bottomPadding : 0
+
+    topInset: background ? -background.topInset || 0 : 0
+    leftInset: background ? -background.leftInset || 0 : 0
+    rightInset: background ? -background.rightInset || 0 : 0
+    bottomInset: background ? -background.bottomInset || 0 : 0
+
+    background: Rectangle {
+        gradient: Theme.mainGradient
+    }
+}

src/gui/qml2/DissolveDark/SquareButton.qml

@@ -0,0 +1,46 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+import QtQuick.Controls.impl
+
+T.Button {
+    id: control
+
+    property int size: 32
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            implicitContentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             implicitContentHeight + topPadding + bottomPadding)
+
+    width: size
+    height: size
+    padding: 4
+    spacing: 4
+
+    icon.width: size
+    icon.height: size
+
+    contentItem: IconLabel {
+        width: 50
+        height: 50
+        spacing: control.spacing
+        mirrored: control.mirrored
+        display: control.display
+
+        icon: control.icon
+        font: Theme.normalFont
+        color: Theme.getForegroundColour(control)
+    }
+
+    background: ButtonPanel {
+        implicitWidth: parent.width
+        implicitHeight: parent.height
+
+        control: control
+        visible: !control.flat || control.down || control.checked || control.highlighted || control.visualFocus
+            || (enabled && control.hovered)
+    }
+}

src/gui/qml2/DissolveDark/Switch.qml

@@ -0,0 +1,35 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+
+T.Switch {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            implicitContentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             implicitContentHeight + topPadding + bottomPadding,
+                             implicitIndicatorHeight + topPadding + bottomPadding)
+
+    padding: 6
+    spacing: 6
+
+    indicator: SwitchIndicator {
+        x: control.text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2
+        y: control.topPadding + (control.availableHeight - height) / 2
+        control: control
+    }
+
+    contentItem: Text {
+        leftPadding: control.indicator && !control.mirrored ? control.indicator.width + control.spacing : 0
+        rightPadding: control.indicator && control.mirrored ? control.indicator.width + control.spacing : 0
+
+        font: Theme.normalFont
+        text: control.text
+        color: Theme.getForegroundColour(control)
+        elide: Text.ElideRight
+        verticalAlignment: Text.AlignVCenter
+    }
+}

src/gui/qml2/DissolveDark/SwitchIndicator.qml

@@ -0,0 +1,72 @@
+// SPDX-License-Identifier: GPL-3.0-or-later
+// Copyright (c) 2024 Team Dissolve and contributors
+
+import QtQuick
+import QtQuick.Templates as T
+
+Rectangle {
+    id: indicator
+
+    property T.AbstractButton control
+
+    implicitWidth: 40
+    implicitHeight: 16
+
+    radius: 2
+    border.color: Theme.colours.mid
+
+    gradient: Theme.controlBackgroundGradient
+
+    Rectangle {
+        x: indicator.control.mirrored ? handle.x : 0
+        width: indicator.control.mirrored ? parent.width - handle.x : handle.x + handle.width
+        height: parent.height
+
+        opacity: indicator.control.checked ? 1 : 0
+        Behavior on opacity {
+            enabled: !indicator.control.down
+            NumberAnimation { duration: 80 }
+        }
+
+        radius: 2
+        border.color: Theme.colours.background
+        //border.width: indicator.control.enabled ? 1 : 0
+
+        gradient: Theme.getAccentGradient(indicator.control)
+    }
+
+    Rectangle {
+        id: handle
+        x: Math.max(0, Math.min(parent.width - width, indicator.control.visualPosition * parent.width - (width / 2)))
+        y: (parent.height - height) / 2
+        width: 20
+        height: 16
+        radius: 2
+
+        gradient: Theme.getForegroundGradient(control)
+        border.width: 1
+        border.color: "transparent"
+
+        Rectangle {
+            width: parent.width
+            height: parent.height
+            border.color: Theme.getForegroundColour(control)
+            color: "transparent"
+            radius: 2
+
+            Rectangle {
+                x: 1; y: 1
+                width: parent.width - 2
+                height: parent.height - 2
+                border.color: Theme.colours.mid
+                color: "transparent"
+                radius: 2
+            }
+        }
+
+        Behavior on x {
+            enabled: !indicator.control.down
+            SmoothedAnimation { velocity: 200 }
+        }
+    }
+}