controlcenter: remove qt5compat dep

This commit is contained in:
2 * r + 2 * t 2026-01-28 19:20:12 +11:00
parent 7097cdcab8
commit 6c1765c2e1
2 changed files with 166 additions and 97 deletions

View file

@ -12,7 +12,6 @@ import qs.utils
import QtQuick import QtQuick
import QtQuick.Controls import QtQuick.Controls
import QtQuick.Layouts import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
DeviceDetails { DeviceDetails {
id: root id: root
@ -20,11 +19,12 @@ DeviceDetails {
required property Session session required property Session session
readonly property var vpnProvider: root.session.vpn.active readonly property var vpnProvider: root.session.vpn.active
readonly property bool providerEnabled: { readonly property bool providerEnabled: {
if (!vpnProvider || vpnProvider.index === undefined) return false; if (!vpnProvider || vpnProvider.index === undefined)
return false;
const provider = Config.utilities.vpn.provider[vpnProvider.index]; const provider = Config.utilities.vpn.provider[vpnProvider.index];
return provider && typeof provider === "object" && provider.enabled === true; return provider && typeof provider === "object" && provider.enabled === true;
} }
device: vpnProvider device: vpnProvider
headerComponent: Component { headerComponent: Component {
@ -49,10 +49,11 @@ DeviceDetails {
label: qsTr("Enable this provider") label: qsTr("Enable this provider")
checked: root.providerEnabled checked: root.providerEnabled
toggle.onToggled: { toggle.onToggled: {
if (!root.vpnProvider) return; if (!root.vpnProvider)
return;
const providers = []; const providers = [];
const index = root.vpnProvider.index; const index = root.vpnProvider.index;
// Copy providers and update enabled state // Copy providers and update enabled state
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) { for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
const p = Config.utilities.vpn.provider[i]; const p = Config.utilities.vpn.provider[i];
@ -62,7 +63,7 @@ DeviceDetails {
displayName: p.displayName, displayName: p.displayName,
interface: p.interface interface: p.interface
}; };
if (checked) { if (checked) {
// Enable this one, disable others // Enable this one, disable others
newProvider.enabled = (i === index); newProvider.enabled = (i === index);
@ -70,13 +71,13 @@ DeviceDetails {
// Just disable this one // Just disable this one
newProvider.enabled = (i === index) ? false : (p.enabled !== false); newProvider.enabled = (i === index) ? false : (p.enabled !== false);
} }
providers.push(newProvider); providers.push(newProvider);
} else { } else {
providers.push(p); providers.push(p);
} }
} }
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
} }
@ -86,7 +87,7 @@ DeviceDetails {
Layout.fillWidth: true Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.normal Layout.topMargin: Appearance.spacing.normal
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
TextButton { TextButton {
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2 Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
@ -171,9 +172,12 @@ DeviceDetails {
showTopMargin: true showTopMargin: true
label: qsTr("Status") label: qsTr("Status")
value: { value: {
if (!root.providerEnabled) return qsTr("Disabled"); if (!root.providerEnabled)
if (VPN.connecting) return qsTr("Connecting..."); return qsTr("Disabled");
if (VPN.connected) return qsTr("Connected"); if (VPN.connecting)
return qsTr("Connecting...");
if (VPN.connected)
return qsTr("Connected");
return qsTr("Enabled (Not connected)"); return qsTr("Enabled (Not connected)");
} }
} }
@ -191,62 +195,80 @@ DeviceDetails {
// Edit VPN Dialog // Edit VPN Dialog
Popup { Popup {
id: editVpnDialog id: editVpnDialog
property int editIndex: -1 property int editIndex: -1
property string providerName: "" property string providerName: ""
property string displayName: "" property string displayName: ""
property string interfaceName: "" property string interfaceName: ""
parent: Overlay.overlay parent: Overlay.overlay
anchors.centerIn: parent anchors.centerIn: parent
width: Math.min(400, parent.width - Appearance.padding.large * 2) width: Math.min(400, parent.width - Appearance.padding.large * 2)
padding: Appearance.padding.large * 1.5 padding: Appearance.padding.large * 1.5
modal: true modal: true
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
opacity: 0 opacity: 0
scale: 0.7 scale: 0.7
enter: Transition { enter: Transition {
ParallelAnimation { Anim {
NumberAnimation { property: "opacity"; from: 0; to: 1; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial } property: "opacity"
NumberAnimation { property: "scale"; from: 0.7; to: 1; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial } from: 0
to: 1
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
}
Anim {
property: "scale"
from: 0.7
to: 1
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
} }
} }
exit: Transition { exit: Transition {
ParallelAnimation { Anim {
NumberAnimation { property: "opacity"; from: 1; to: 0; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial } property: "opacity"
NumberAnimation { property: "scale"; from: 1; to: 0.7; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial } from: 1
to: 0
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
}
Anim {
property: "scale"
from: 1
to: 0.7
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
} }
} }
function closeWithAnimation(): void { function closeWithAnimation(): void {
close(); close();
} }
Overlay.modal: Rectangle { Overlay.modal: Rectangle {
color: Qt.rgba(0, 0, 0, 0.4 * editVpnDialog.opacity) color: Qt.rgba(0, 0, 0, 0.4 * editVpnDialog.opacity)
} }
background: StyledRect { background: StyledRect {
color: Colours.palette.m3surfaceContainerHigh color: Colours.palette.m3surfaceContainerHigh
radius: Appearance.rounding.large radius: Appearance.rounding.large
layer.enabled: true Elevation {
layer.effect: DropShadow { anchors.fill: parent
color: Qt.rgba(0, 0, 0, 0.3) radius: parent.radius
radius: 16 level: 3
samples: 33 z: -1
verticalOffset: 4
} }
} }
contentItem: ColumnLayout { contentItem: ColumnLayout {
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
StyledText { StyledText {
text: qsTr("Edit VPN Provider") text: qsTr("Edit VPN Provider")
font.pointSize: Appearance.font.size.large font.pointSize: Appearance.font.size.large
@ -271,8 +293,12 @@ DeviceDetails {
border.width: 1 border.width: 1
border.color: displayNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3) border.color: displayNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} } Behavior on color {
Behavior on border.color { CAnim {} } CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField { StyledTextField {
id: displayNameField id: displayNameField
@ -303,8 +329,12 @@ DeviceDetails {
border.width: 1 border.width: 1
border.color: interfaceNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3) border.color: interfaceNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} } Behavior on color {
Behavior on border.color { CAnim {} } CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField { StyledTextField {
id: interfaceNameField id: interfaceNameField
@ -316,13 +346,12 @@ DeviceDetails {
} }
} }
} }
Item { Layout.preferredHeight: Appearance.spacing.normal }
RowLayout { RowLayout {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true Layout.fillWidth: true
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
TextButton { TextButton {
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("Cancel") text: qsTr("Cancel")
@ -330,19 +359,19 @@ DeviceDetails {
inactiveOnColour: Colours.palette.m3onSurface inactiveOnColour: Colours.palette.m3onSurface
onClicked: editVpnDialog.closeWithAnimation() onClicked: editVpnDialog.closeWithAnimation()
} }
TextButton { TextButton {
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("Save") text: qsTr("Save")
enabled: editVpnDialog.interfaceName.length > 0 enabled: editVpnDialog.interfaceName.length > 0
inactiveColour: Colours.palette.m3primaryContainer inactiveColour: Colours.palette.m3primaryContainer
inactiveOnColour: Colours.palette.m3onPrimaryContainer inactiveOnColour: Colours.palette.m3onPrimaryContainer
onClicked: { onClicked: {
const providers = []; const providers = [];
const oldProvider = Config.utilities.vpn.provider[editVpnDialog.editIndex]; const oldProvider = Config.utilities.vpn.provider[editVpnDialog.editIndex];
const wasEnabled = typeof oldProvider === "object" ? (oldProvider.enabled !== false) : true; const wasEnabled = typeof oldProvider === "object" ? (oldProvider.enabled !== false) : true;
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) { for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
if (i === editVpnDialog.editIndex) { if (i === editVpnDialog.editIndex) {
providers.push({ providers.push({
@ -355,7 +384,7 @@ DeviceDetails {
providers.push(Config.utilities.vpn.provider[i]); providers.push(Config.utilities.vpn.provider[i]);
} }
} }
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
editVpnDialog.closeWithAnimation(); editVpnDialog.closeWithAnimation();

View file

@ -3,16 +3,13 @@ pragma ComponentBehavior: Bound
import ".." import ".."
import qs.components import qs.components
import qs.components.controls import qs.components.controls
import qs.components.containers
import qs.components.effects import qs.components.effects
import qs.services import qs.services
import qs.config import qs.config
import qs.utils
import Quickshell import Quickshell
import QtQuick import QtQuick
import QtQuick.Controls import QtQuick.Controls
import QtQuick.Layouts import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
ColumnLayout { ColumnLayout {
id: root id: root
@ -29,7 +26,7 @@ ColumnLayout {
if (!VPN.connected && root.pendingSwitchIndex >= 0) { if (!VPN.connected && root.pendingSwitchIndex >= 0) {
const targetIndex = root.pendingSwitchIndex; const targetIndex = root.pendingSwitchIndex;
root.pendingSwitchIndex = -1; root.pendingSwitchIndex = -1;
const providers = []; const providers = [];
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) { for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
const p = Config.utilities.vpn.provider[i]; const p = Config.utilities.vpn.provider[i];
@ -47,8 +44,8 @@ ColumnLayout {
} }
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
Qt.callLater(function() { Qt.callLater(function () {
VPN.toggle(); VPN.toggle();
}); });
} }
@ -82,7 +79,7 @@ ColumnLayout {
const displayName = isObject ? (provider.displayName || name) : name; const displayName = isObject ? (provider.displayName || name) : name;
const iface = isObject ? (provider.interface || "") : ""; const iface = isObject ? (provider.interface || "") : "";
const enabled = isObject ? (provider.enabled === true) : false; const enabled = isObject ? (provider.enabled === true) : false;
return { return {
index: index, index: index,
name: name, name: name,
@ -160,9 +157,12 @@ ColumnLayout {
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
text: { text: {
if (modelData.enabled && VPN.connected) return qsTr("Connected"); if (modelData.enabled && VPN.connected)
if (modelData.enabled && VPN.connecting) return qsTr("Connecting..."); return qsTr("Connected");
if (modelData.enabled) return qsTr("Enabled"); if (modelData.enabled && VPN.connecting)
return qsTr("Connecting...");
if (modelData.enabled)
return qsTr("Enabled");
return qsTr("Disabled"); return qsTr("Disabled");
} }
color: modelData.enabled ? (VPN.connected ? Colours.palette.m3primary : Colours.palette.m3onSurface) : Colours.palette.m3outline color: modelData.enabled ? (VPN.connected ? Colours.palette.m3primary : Colours.palette.m3onSurface) : Colours.palette.m3outline
@ -210,7 +210,7 @@ ColumnLayout {
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
Qt.callLater(function() { Qt.callLater(function () {
VPN.toggle(); VPN.toggle();
}); });
} }
@ -261,7 +261,7 @@ ColumnLayout {
} }
} }
} }
Popup { Popup {
id: vpnDialog id: vpnDialog
@ -279,21 +279,45 @@ ColumnLayout {
modal: true modal: true
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
opacity: 0 opacity: 0
scale: 0.7 scale: 0.7
enter: Transition { enter: Transition {
ParallelAnimation { ParallelAnimation {
NumberAnimation { property: "opacity"; from: 0; to: 1; duration: Appearance.anim.durations.normal; easing.bezierCurve: Appearance.anim.curves.emphasized } Anim {
NumberAnimation { property: "scale"; from: 0.7; to: 1; duration: Appearance.anim.durations.normal; easing.bezierCurve: Appearance.anim.curves.emphasized } property: "opacity"
from: 0
to: 1
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
Anim {
property: "scale"
from: 0.7
to: 1
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
} }
} }
exit: Transition { exit: Transition {
ParallelAnimation { ParallelAnimation {
NumberAnimation { property: "opacity"; from: 1; to: 0; duration: Appearance.anim.durations.small; easing.bezierCurve: Appearance.anim.curves.emphasized } Anim {
NumberAnimation { property: "scale"; from: 1; to: 0.7; duration: Appearance.anim.durations.small; easing.bezierCurve: Appearance.anim.curves.emphasized } property: "opacity"
from: 1
to: 0
duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized
}
Anim {
property: "scale"
from: 1
to: 0.7
duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized
}
} }
} }
@ -346,7 +370,7 @@ ColumnLayout {
id: transitionToForm id: transitionToForm
ParallelAnimation { ParallelAnimation {
NumberAnimation { Anim {
target: selectionContent target: selectionContent
property: "opacity" property: "opacity"
to: 0 to: 0
@ -362,7 +386,7 @@ ColumnLayout {
} }
ParallelAnimation { ParallelAnimation {
NumberAnimation { Anim {
target: formContent target: formContent
property: "opacity" property: "opacity"
to: 1 to: 1
@ -376,16 +400,15 @@ ColumnLayout {
color: Colours.palette.m3surfaceContainerHigh color: Colours.palette.m3surfaceContainerHigh
radius: Appearance.rounding.large radius: Appearance.rounding.large
layer.enabled: true Elevation {
layer.effect: DropShadow { anchors.fill: parent
color: Qt.rgba(0, 0, 0, 0.3) radius: parent.radius
radius: 16 level: 3
samples: 33 z: -1
verticalOffset: 4
} }
Behavior on implicitHeight { Behavior on implicitHeight {
NumberAnimation { Anim {
duration: Appearance.anim.durations.normal duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized easing.bezierCurve: Appearance.anim.curves.emphasized
} }
@ -396,7 +419,7 @@ ColumnLayout {
implicitHeight: vpnDialog.currentState === "selection" ? selectionContent.implicitHeight : formContent.implicitHeight implicitHeight: vpnDialog.currentState === "selection" ? selectionContent.implicitHeight : formContent.implicitHeight
Behavior on implicitHeight { Behavior on implicitHeight {
NumberAnimation { Anim {
duration: Appearance.anim.durations.normal duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized easing.bezierCurve: Appearance.anim.curves.emphasized
} }
@ -404,19 +427,19 @@ ColumnLayout {
ColumnLayout { ColumnLayout {
id: selectionContent id: selectionContent
anchors.fill: parent anchors.fill: parent
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
visible: vpnDialog.currentState === "selection" visible: vpnDialog.currentState === "selection"
opacity: vpnDialog.currentState === "selection" ? 1 : 0 opacity: vpnDialog.currentState === "selection" ? 1 : 0
Behavior on opacity { Behavior on opacity {
NumberAnimation { Anim {
duration: Appearance.anim.durations.small duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized easing.bezierCurve: Appearance.anim.curves.emphasized
} }
} }
StyledText { StyledText {
text: qsTr("Add VPN Provider") text: qsTr("Add VPN Provider")
font.pointSize: Appearance.font.size.large font.pointSize: Appearance.font.size.large
@ -431,9 +454,8 @@ ColumnLayout {
font.pointSize: Appearance.font.size.small font.pointSize: Appearance.font.size.small
} }
Item { Layout.preferredHeight: Appearance.spacing.small }
TextButton { TextButton {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("NetBird") text: qsTr("NetBird")
inactiveColour: Colours.tPalette.m3surfaceContainerHigh inactiveColour: Colours.tPalette.m3surfaceContainerHigh
@ -443,13 +465,17 @@ ColumnLayout {
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) { for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
providers.push(Config.utilities.vpn.provider[i]); providers.push(Config.utilities.vpn.provider[i]);
} }
providers.push({ name: "netbird", displayName: "NetBird", interface: "wt0" }); providers.push({
name: "netbird",
displayName: "NetBird",
interface: "wt0"
});
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
vpnDialog.closeWithAnimation(); vpnDialog.closeWithAnimation();
} }
} }
TextButton { TextButton {
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("Tailscale") text: qsTr("Tailscale")
@ -460,13 +486,17 @@ ColumnLayout {
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) { for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
providers.push(Config.utilities.vpn.provider[i]); providers.push(Config.utilities.vpn.provider[i]);
} }
providers.push({ name: "tailscale", displayName: "Tailscale", interface: "tailscale0" }); providers.push({
name: "tailscale",
displayName: "Tailscale",
interface: "tailscale0"
});
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
vpnDialog.closeWithAnimation(); vpnDialog.closeWithAnimation();
} }
} }
TextButton { TextButton {
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("Cloudflare WARP") text: qsTr("Cloudflare WARP")
@ -477,13 +507,17 @@ ColumnLayout {
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) { for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
providers.push(Config.utilities.vpn.provider[i]); providers.push(Config.utilities.vpn.provider[i]);
} }
providers.push({ name: "warp", displayName: "Cloudflare WARP", interface: "CloudflareWARP" }); providers.push({
name: "warp",
displayName: "Cloudflare WARP",
interface: "CloudflareWARP"
});
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
vpnDialog.closeWithAnimation(); vpnDialog.closeWithAnimation();
} }
} }
TextButton { TextButton {
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("WireGuard (Custom)") text: qsTr("WireGuard (Custom)")
@ -494,9 +528,8 @@ ColumnLayout {
} }
} }
Item { Layout.preferredHeight: Appearance.spacing.small }
TextButton { TextButton {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("Cancel") text: qsTr("Cancel")
inactiveColour: Colours.palette.m3secondaryContainer inactiveColour: Colours.palette.m3secondaryContainer
@ -507,19 +540,19 @@ ColumnLayout {
ColumnLayout { ColumnLayout {
id: formContent id: formContent
anchors.fill: parent anchors.fill: parent
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
visible: vpnDialog.currentState === "form" visible: vpnDialog.currentState === "form"
opacity: vpnDialog.currentState === "form" ? 1 : 0 opacity: vpnDialog.currentState === "form" ? 1 : 0
Behavior on opacity { Behavior on opacity {
NumberAnimation { Anim {
duration: Appearance.anim.durations.small duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized easing.bezierCurve: Appearance.anim.curves.emphasized
} }
} }
StyledText { StyledText {
text: vpnDialog.editIndex >= 0 ? qsTr("Edit VPN Provider") : qsTr("Add %1 VPN").arg(vpnDialog.displayName) text: vpnDialog.editIndex >= 0 ? qsTr("Edit VPN Provider") : qsTr("Add %1 VPN").arg(vpnDialog.displayName)
font.pointSize: Appearance.font.size.large font.pointSize: Appearance.font.size.large
@ -544,8 +577,12 @@ ColumnLayout {
border.width: 1 border.width: 1
border.color: displayNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3) border.color: displayNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} } Behavior on color {
Behavior on border.color { CAnim {} } CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField { StyledTextField {
id: displayNameField id: displayNameField
@ -576,8 +613,12 @@ ColumnLayout {
border.width: 1 border.width: 1
border.color: interfaceNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3) border.color: interfaceNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} } Behavior on color {
Behavior on border.color { CAnim {} } CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField { StyledTextField {
id: interfaceNameField id: interfaceNameField
@ -590,9 +631,8 @@ ColumnLayout {
} }
} }
Item { Layout.preferredHeight: Appearance.spacing.normal }
RowLayout { RowLayout {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true Layout.fillWidth: true
spacing: Appearance.spacing.normal spacing: Appearance.spacing.normal
@ -633,7 +673,7 @@ ColumnLayout {
} }
providers.push(newProvider); providers.push(newProvider);
} }
Config.utilities.vpn.provider = providers; Config.utilities.vpn.provider = providers;
Config.save(); Config.save();
vpnDialog.closeWithAnimation(); vpnDialog.closeWithAnimation();