From 101a4e317c87cdeef87e35de3b4b57a5a040418d Mon Sep 17 00:00:00 2001 From: Jeffrey <54014102+TheJeffreyKuo@users.noreply.github.com> Date: Sat, 28 Feb 2026 15:46:15 -0500 Subject: [PATCH] Theme Refactor --- NERODevelopment/content/App.qml | 2 +- NERODevelopment/content/Arrow.qml | 2 +- NERODevelopment/content/Battery.qml | 10 +- .../content/BatteryValueComponent.qml | 2 +- NERODevelopment/content/CriticalFaultIcon.qml | 6 +- NERODevelopment/content/DescriptionModal.qml | 18 +- NERODevelopment/content/DetailDisplay.qml | 34 ++-- NERODevelopment/content/DirectionView.qml | 12 +- NERODevelopment/content/FaultDialog.qml | 8 +- NERODevelopment/content/HomeIcon.qml | 6 +- NERODevelopment/content/HomeMenuItem.qml | 4 +- NERODevelopment/content/LabelText.qml | 2 +- NERODevelopment/content/LabeledComponent.qml | 6 +- NERODevelopment/content/Lightning.qml | 8 +- NERODevelopment/content/MaxDrawGraph.qml | 8 +- .../content/MaxSpeedComparator.qml | 18 +- .../content/MicrophoneComponent.qml | 6 +- .../content/NonCriticalWarning.qml | 6 +- NERODevelopment/content/OffScreen.qml | 6 +- NERODevelopment/content/OffScreen2.qml | 26 +-- NERODevelopment/content/Pit.qml | 2 +- NERODevelopment/content/Radial.qml | 8 +- NERODevelopment/content/RunInfo.qml | 8 +- NERODevelopment/content/SpeedMode.qml | 8 +- NERODevelopment/content/StatusDisplay.qml | 6 +- NERODevelopment/content/SubMenuIcon.qml | 4 +- NERODevelopment/content/Thermometer.qml | 12 +- .../content/ThermometerValueComponent.qml | 2 +- NERODevelopment/content/TimerDisplay.qml | 12 +- NERODevelopment/content/TorqueAdj.qml | 8 +- .../content/TorqueValueComponent.qml | 2 +- NERODevelopment/content/ValueText.qml | 2 +- NERODevelopment/imports/NERO/Theme.qml | 189 +++++++----------- 33 files changed, 204 insertions(+), 249 deletions(-) diff --git a/NERODevelopment/content/App.qml b/NERODevelopment/content/App.qml index 36d427b..e5df21f 100644 --- a/NERODevelopment/content/App.qml +++ b/NERODevelopment/content/App.qml @@ -6,7 +6,7 @@ import NERO Window { width: 800 height: 480 - color: Theme.getColor("background") + color: Theme.background visible: true title: "NERO" diff --git a/NERODevelopment/content/Arrow.qml b/NERODevelopment/content/Arrow.qml index 2a3acf7..6221986 100644 --- a/NERODevelopment/content/Arrow.qml +++ b/NERODevelopment/content/Arrow.qml @@ -8,7 +8,7 @@ Item { property variant stops: [] property int arrowWidth: 2 property real angle: -Math.PI / 6 - property string arrowColor: Theme.getColor("primaryForeground") + property string arrowColor: Theme.primaryForeground property real x1: stops[stops.length - 2].x property real y1: stops[stops.length - 2].y diff --git a/NERODevelopment/content/Battery.qml b/NERODevelopment/content/Battery.qml index bbf8dc7..fbd5cd1 100644 --- a/NERODevelopment/content/Battery.qml +++ b/NERODevelopment/content/Battery.qml @@ -8,10 +8,10 @@ Rectangle { property int maxValue: 100 property int fillMargin: height / 20 - property string fillColor: battery.value > 70 ? Theme.getColor("goodStatus") : battery.value - > 40 ? Theme.getColor("cautionStatus") : Theme.getColor("criticalStatus") + property string fillColor: battery.value > 70 ? Theme.goodStatus : battery.value + > 40 ? Theme.cautionStatus : Theme.criticalStatus width: height / 2 - color: Theme.getColor("transparent") + color: "transparent" Rectangle { id: topOutlet @@ -38,7 +38,7 @@ Rectangle { fill: parent margins: battery.fillMargin } - color: Theme.getColor("background") + color: Theme.background z: 0 } @@ -53,7 +53,7 @@ Rectangle { }, GradientStop { position: 1.0 - color: Theme.getColor("fillGradientStop") + color: Theme.fillGradientStop } ] } diff --git a/NERODevelopment/content/BatteryValueComponent.qml b/NERODevelopment/content/BatteryValueComponent.qml index 5de20f8..17fb431 100644 --- a/NERODevelopment/content/BatteryValueComponent.qml +++ b/NERODevelopment/content/BatteryValueComponent.qml @@ -8,7 +8,7 @@ Item { property string title: "Charge State" property int horizontalIconSpacing: width * 0.1 property int labelVerticalSpacing: height * 0.1 - property string labelColor: Theme.getColor("accentForeground") + property string labelColor: Theme.accentForeground property int horizontalPadding: width * 0.1 property int radius property int valueFontSize diff --git a/NERODevelopment/content/CriticalFaultIcon.qml b/NERODevelopment/content/CriticalFaultIcon.qml index d44c2a4..09b2967 100644 --- a/NERODevelopment/content/CriticalFaultIcon.qml +++ b/NERODevelopment/content/CriticalFaultIcon.qml @@ -19,8 +19,8 @@ Item { ShapePath { id: triangle dashPattern: 5.6 - fillColor: Theme.getColor("criticalStatus") - strokeColor: Theme.getColor("transparent") + fillColor: Theme.criticalStatus + strokeColor: "transparent" strokeWidth: 1 capStyle: ShapePath.RoundCap @@ -45,7 +45,7 @@ Item { id: text1 x: (shape.width) / 2 - font.pixelSize / 8 y: (shape.height - (font.pixelSize * 1.2)) - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground text: qsTr("!") font.pixelSize: .75 * shape.width } diff --git a/NERODevelopment/content/DescriptionModal.qml b/NERODevelopment/content/DescriptionModal.qml index 652523a..188ba7e 100644 --- a/NERODevelopment/content/DescriptionModal.qml +++ b/NERODevelopment/content/DescriptionModal.qml @@ -12,7 +12,7 @@ Rectangle { width: dimension * 2 height: dimension - color: Theme.getColor("popoverBackground") + color: Theme.popoverBackground radius: 20 Rectangle { @@ -22,9 +22,9 @@ Rectangle { x: dimension / 10 y: -width / 2 radius: width / 2 - color: Theme.getColor("backgroundPicture") + color: Theme.backgroundPicture - border.color: Theme.getColor("popoverBackground") + border.color: Theme.popoverBackground border.width: 10 clip: true // This enables clipping of content outside the rectangle @@ -45,7 +45,7 @@ Rectangle { width: modalPic.width height: modalPic.height radius: modalPic.radius - color: Theme.getColor("popoverBackground") + color: Theme.popoverBackground } } } @@ -54,7 +54,7 @@ Rectangle { Text { id: modalTitle - color: Theme.getColor("blackForeground") + color: Theme.blackForeground font.pixelSize: dimension / 6 font.bold: true wrapMode: Text.WordWrap @@ -64,7 +64,7 @@ Rectangle { Text { id: modalDescription - color: Theme.getColor("blackForeground") + color: Theme.blackForeground font.pixelSize: dimension / 11 wrapMode: Text.WordWrap width: (parent.width - modalDescription.x) - modal.offset @@ -77,8 +77,8 @@ Rectangle { height: parent.height / 5 width: parent.width / 3 background: Rectangle { - color: Theme.getColor("descriptionButtonBackground") - border.color: Theme.getColor("accentBlue") + color: Theme.descriptionButtonBackground + border.color: Theme.accentBlue border.width: 3 radius: 10 } @@ -88,7 +88,7 @@ Rectangle { font.pixelSize: parent.height / 15 onClicked: closeModal() Component.onCompleted: { - modalButton.contentItem.color = Theme.getColor("descriptionButtonForeground") + modalButton.contentItem.color = Theme.descriptionButtonForeground } } diff --git a/NERODevelopment/content/DetailDisplay.qml b/NERODevelopment/content/DetailDisplay.qml index a0d172f..67785ca 100644 --- a/NERODevelopment/content/DetailDisplay.qml +++ b/NERODevelopment/content/DetailDisplay.qml @@ -11,7 +11,7 @@ Rectangle { property bool highlight: false height: 60 width: 250 - color: Theme.getColor("background") + color: Theme.background onStatusChanged: { console.log("Changing status") @@ -41,13 +41,13 @@ Rectangle { SequentialAnimation on color { loops: Animation.Infinite ColorAnimation { - from: Theme.getColor("primaryDetailGradient") - to: Theme.getColor("secondaryDetailGradient") + from: Theme.primaryDetailGradient + to: Theme.secondaryDetailGradient duration: 1500 } ColorAnimation { - from: Theme.getColor("secondaryDetailGradient") - to: Theme.getColor("primaryDetailGradient") + from: Theme.secondaryDetailGradient + to: Theme.primaryDetailGradient duration: 3000 } } @@ -58,27 +58,27 @@ Rectangle { SequentialAnimation on color { loops: Animation.Infinite ColorAnimation { - from: Theme.getColor("primaryDetailGradient") - to: Theme.getColor("primaryDetailGradient") + from: Theme.primaryDetailGradient + to: Theme.primaryDetailGradient duration: 1500 } ColorAnimation { - from: Theme.getColor("primaryDetailGradient") - to: Theme.getColor("secondaryDetailGradient") + from: Theme.primaryDetailGradient + to: Theme.secondaryDetailGradient duration: 1500 } ColorAnimation { - from: Theme.getColor("secondaryDetailGradient") - to: Theme.getColor("primaryDetailGradient") + from: Theme.secondaryDetailGradient + to: Theme.primaryDetailGradient duration: 1500 } } } } } - color: Theme.getColor("transparent") + color: "transparent" - border.color: Theme.getColor("transparent") + border.color: "transparent" width: Math.max(parent.width * 0.6, taskText.implicitWidth) // Ensure minimum width height: parent.height @@ -86,7 +86,7 @@ Rectangle { LabelText { id: taskText - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground text: detailDisplay.shutdownFlowTask anchors.verticalCenter: parent.verticalCenter anchors.left: parent.left @@ -97,19 +97,19 @@ Rectangle { Rectangle { id: statusDisplayContainer - color: status == 0 ? Theme.getColor("transparent") : (status === 1 ? Theme.getColor("goodStatus") : (status === 2 ? Theme.getColor("criticalStatus") : Theme.getColor("transparent"))) + color: status == 0 ? "transparent" : (status === 1 ? Theme.goodStatus : (status === 2 ? Theme.criticalStatus : "transparent")) width: Math.max(parent.width * 0.4, statusText.implicitWidth + 20) // Ensure minimum width height: parent.height anchors.left: taskDisplay.right radius: 10 - border.color: status == 0 ? Theme.getColor("primaryForeground") : Theme.getColor("transparent") + border.color: status == 0 ? Theme.primaryForeground : "transparent" border.width: status == 0 ? 3 : 0 LabelText { id: statusText visible: !clear - color: Theme.getColor("inverseForeground") + color: Theme.inverseForeground text: detailDisplay.statusDisplay anchors.centerIn: parent } diff --git a/NERODevelopment/content/DirectionView.qml b/NERODevelopment/content/DirectionView.qml index f216b8b..c94d8d7 100644 --- a/NERODevelopment/content/DirectionView.qml +++ b/NERODevelopment/content/DirectionView.qml @@ -17,10 +17,10 @@ Item { Rectangle { id: rectangle - color: forward ? Theme.getColor("directionBackground") : Theme.getColor("transparent") + color: forward ? Theme.directionBackground : "transparent" Layout.fillHeight: true Layout.preferredWidth: parent.width / 2 - 20 - border.color: forward ? Theme.getColor("transparent") : Theme.getColor("primaryForeground") + border.color: forward ? "transparent" : Theme.primaryForeground border.width: 2 radius: directionView.radius @@ -28,24 +28,24 @@ Item { anchors.centerIn: parent font.pixelSize: Math.min(parent.width, parent.height) / 1.5 text: "D" - color: forward ? Theme.getColor("inverseForeground") : Theme.getColor("primaryForeground") + color: forward ? Theme.inverseForeground : Theme.primaryForeground font.family: webFont.name } } Rectangle { id: rectangle1 - color: forward ? Theme.getColor("transparent") : Theme.getColor("directionBackground") + color: forward ? "transparent" : Theme.directionBackground Layout.fillHeight: true Layout.preferredWidth: parent.width / 2 - 20 - border.color: forward ? Theme.getColor("primaryForeground") : Theme.getColor("transparent") + border.color: forward ? Theme.primaryForeground : "transparent" border.width: 2 radius: directionView.radius Text { anchors.centerIn: parent font.pixelSize: Math.min(parent.width, parent.height) / 1.5 - color: forward ? Theme.getColor("primaryForeground") : Theme.getColor("inverseForeground") + color: forward ? Theme.primaryForeground : Theme.inverseForeground font.family: webFont.name text: "R" } diff --git a/NERODevelopment/content/FaultDialog.qml b/NERODevelopment/content/FaultDialog.qml index c60f40a..86470fd 100644 --- a/NERODevelopment/content/FaultDialog.qml +++ b/NERODevelopment/content/FaultDialog.qml @@ -17,19 +17,19 @@ Popup { rightInset: 0 bottomInset: 0 Overlay.modal: Rectangle { - color: Theme.getColor("transparent") + color: "transparent" } anchors.centerIn: Overlay.overlay contentItem: Rectangle { anchors.fill: parent - color: Theme.getColor("popoverBackground") + color: Theme.popoverBackground radius: 20 Text { id: modalTitle - color: Theme.getColor("inverseForeground") + color: Theme.inverseForeground font.pixelSize: dimension / 6 font.bold: true wrapMode: Text.WordWrap @@ -43,7 +43,7 @@ Popup { Text { id: modalDescription - color: Theme.getColor("inverseForeground") + color: Theme.inverseForeground font.pixelSize: dimension / 11 wrapMode: Text.WordWrap anchors.left: parent.left diff --git a/NERODevelopment/content/HomeIcon.qml b/NERODevelopment/content/HomeIcon.qml index 89f9c87..82ff638 100644 --- a/NERODevelopment/content/HomeIcon.qml +++ b/NERODevelopment/content/HomeIcon.qml @@ -5,7 +5,7 @@ import NERO Rectangle { id: root - color: Theme.getColor("transparent") + color: "transparent" property bool highlighted: false property string text: "Off" @@ -25,11 +25,11 @@ Rectangle { gradient: Gradient { GradientStop { position: 0.0 - color: highlighted ? Theme.getColor("iconHighlightedBackground") : Theme.getColor("iconBackground") + color: highlighted ? Theme.iconHighlightedBackground : Theme.iconBackground } GradientStop { position: 1.0 - color: highlighted ? Theme.getColor("iconHighlightedGradientStop") : Theme.getColor("iconGradientStop") + color: highlighted ? Theme.iconHighlightedGradientStop : Theme.iconGradientStop } } diff --git a/NERODevelopment/content/HomeMenuItem.qml b/NERODevelopment/content/HomeMenuItem.qml index d82aee6..6a53462 100644 --- a/NERODevelopment/content/HomeMenuItem.qml +++ b/NERODevelopment/content/HomeMenuItem.qml @@ -4,10 +4,10 @@ import NERO Rectangle { property bool highlighted: false property string text: "Off" - color: Theme.getColor("transparent") + color: "transparent" border.width: highlighted ? 2 : 1 - border.color: highlighted ? Theme.getColor("primaryForeground") : Theme.getColor("transparent") + border.color: highlighted ? Theme.primaryForeground : "transparent" height: label.implicitHeight width: parent.width diff --git a/NERODevelopment/content/LabelText.qml b/NERODevelopment/content/LabelText.qml index 4a01d31..b3a68e4 100644 --- a/NERODevelopment/content/LabelText.qml +++ b/NERODevelopment/content/LabelText.qml @@ -5,5 +5,5 @@ import NERO Text { font.family: webFont.name font.pixelSize: 24 - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground } diff --git a/NERODevelopment/content/LabeledComponent.qml b/NERODevelopment/content/LabeledComponent.qml index 36b4300..7531573 100644 --- a/NERODevelopment/content/LabeledComponent.qml +++ b/NERODevelopment/content/LabeledComponent.qml @@ -21,11 +21,11 @@ Rectangle { stops: [ GradientStop { position: 1.0 - color: Theme.getColor("transparent") + color: "transparent" }, GradientStop { position: 0.5 - color: Theme.getColor("iconBackground") + color: Theme.iconBackground } ] } @@ -84,7 +84,7 @@ Rectangle { LabelText { text: labelComponent.valueUnit - color: Theme.getColor("mutedForeground") + color: Theme.mutedForeground font.pixelSize: labelComponent.unitFontSize anchors.bottom: labelComponent.unitAnchorBottom ? parent.bottom : null } diff --git a/NERODevelopment/content/Lightning.qml b/NERODevelopment/content/Lightning.qml index ec28fbb..df884b9 100644 --- a/NERODevelopment/content/Lightning.qml +++ b/NERODevelopment/content/Lightning.qml @@ -5,8 +5,8 @@ import NERO Item { id: lightning property int dimension: 150 - property string primaryColor: Theme.getColor("accentGreen") - property string secondaryColor: Theme.getColor("blackForeground") + property string primaryColor: Theme.accentGreen + property string secondaryColor: Theme.blackForeground width: dimension height: dimension @@ -20,7 +20,7 @@ Item { ShapePath { id: background fillColor: lightning.secondaryColor - strokeColor: Theme.getColor("transparent") + strokeColor: "transparent" strokeWidth: 1 startX: 47 / 80 * shape2.width @@ -78,7 +78,7 @@ Item { ShapePath { id: foreground fillColor: lightning.primaryColor - strokeColor: Theme.getColor("transparent") + strokeColor: "transparent" strokeWidth: 1 startX: 45 / 80 * shape.width diff --git a/NERODevelopment/content/MaxDrawGraph.qml b/NERODevelopment/content/MaxDrawGraph.qml index dfbee93..0f02f0f 100644 --- a/NERODevelopment/content/MaxDrawGraph.qml +++ b/NERODevelopment/content/MaxDrawGraph.qml @@ -11,7 +11,7 @@ Rectangle { width: dimension height: dimension - color: Theme.getColor("transparent") + color: "transparent" property int value: 130 @@ -28,7 +28,7 @@ Rectangle { ctx.beginPath() ctx.arc(centerX, centerY, radius, startAngle, endAngle, false) - ctx.strokeStyle = Theme.getColor("primaryLightning") + ctx.strokeStyle = Theme.accentGreen ctx.lineWidth = 0.06 * background.dimension ctx.stroke() } @@ -41,14 +41,14 @@ Rectangle { text: value.toString() font.pixelSize: 0.25 * background.dimension font.bold: true - color: Theme.getColor("accentGreen") + color: Theme.accentGreen } LabelText { text: "A" font.pixelSize: 0.15 * background.dimension font.bold: true - color: Theme.getColor("accentGreen") + color: Theme.accentGreen Layout.topMargin: 0.06 * background.dimension } } diff --git a/NERODevelopment/content/MaxSpeedComparator.qml b/NERODevelopment/content/MaxSpeedComparator.qml index 0314428..7edd2c6 100644 --- a/NERODevelopment/content/MaxSpeedComparator.qml +++ b/NERODevelopment/content/MaxSpeedComparator.qml @@ -13,14 +13,14 @@ Rectangle { width: dimension height: dimension * 3 radius: 5 - color: Theme.getColor("background") - border.color: Theme.getColor("primaryForeground") + color: Theme.background + border.color: Theme.primaryForeground Text { id: maxSpeed text: maxSpeedComparator.maxSpeed font.pixelSize: parent.width * 0.2 - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground x: -(width + dimension / 20) } @@ -28,7 +28,7 @@ Rectangle { id: lowestSpeed text: maxSpeedComparator.lowestSpeed font.pixelSize: parent.width * 0.2 - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground x: -(width + dimension / 20) y: maxSpeedComparator.height - height } @@ -49,11 +49,11 @@ Rectangle { GradientStop { position: -5 * (1 - bar.percentageHeight + 0.1) // Start of gradient relative to parent's height - color: Theme.getColor("criticalStatus") + color: Theme.criticalStatus } GradientStop { position: 1.0 // End of gradient relative to parent's height - color: Theme.getColor("goodStatus") + color: Theme.goodStatus } } transformOrigin: Item.BottomLeft @@ -68,7 +68,7 @@ Rectangle { Text { id: topSpeed text: qsTr("TOP SPEED") - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground x: -(width + dimension / 20) y: maxSpeedComparator.height * (1 - maxSpeedComparator.previousTopSpeed / maxSpeedComparator.maxSpeed) @@ -76,7 +76,7 @@ Rectangle { Text { id: topSpeedNumber text: maxSpeedComparator.previousTopSpeed + qsTr("MPH") - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground y: -height font.pixelSize: parent.width * 0.2 @@ -91,7 +91,7 @@ Rectangle { width: maxSpeedComparator.width - dimension / 6 anchors.horizontalCenter: parent.horizontalCenter height: 2 - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground } Behavior on currentSpeed { diff --git a/NERODevelopment/content/MicrophoneComponent.qml b/NERODevelopment/content/MicrophoneComponent.qml index cf0b9f3..727ba4a 100644 --- a/NERODevelopment/content/MicrophoneComponent.qml +++ b/NERODevelopment/content/MicrophoneComponent.qml @@ -15,13 +15,13 @@ Item { PropertyAnimation { target: overlay property: "color" - to: Theme.getColor("primaryMicrophone") + to: Theme.primaryMicrophone duration: 1000 // Animation duration in milliseconds } PropertyAnimation { target: overlay property: "color" - to: Theme.getColor("secondaryMicrophone") + to: Theme.secondaryMicrophone duration: 1000 } } @@ -40,7 +40,7 @@ Item { id: overlay anchors.fill: microphone source: microphone - color: Theme.getColor("background") + color: Theme.background transform: rotation antialiasing: true } diff --git a/NERODevelopment/content/NonCriticalWarning.qml b/NERODevelopment/content/NonCriticalWarning.qml index e393a7a..4dcd7d2 100644 --- a/NERODevelopment/content/NonCriticalWarning.qml +++ b/NERODevelopment/content/NonCriticalWarning.qml @@ -16,11 +16,11 @@ Item { y: (parent.height - dimension) / 2 width: dimension height: dimension - color: Theme.getColor("nonCriticalBackground") + color: Theme.nonCriticalBackground Text { id: exclamation - color: Theme.getColor("nonCriticalForeground") + color: Theme.nonCriticalForeground text: qsTr("!") font.pixelSize: 0.625 * parent.width horizontalAlignment: Text.AlignHCenter @@ -36,7 +36,7 @@ Item { radius: dimension / 4 width: dimension / 2 height: dimension / 2 - color: Theme.getColor("nonCriticalForeground") + color: Theme.nonCriticalForeground visible: numWarnings > 0 Text { diff --git a/NERODevelopment/content/OffScreen.qml b/NERODevelopment/content/OffScreen.qml index 572a20f..ca1e7df 100644 --- a/NERODevelopment/content/OffScreen.qml +++ b/NERODevelopment/content/OffScreen.qml @@ -73,21 +73,21 @@ Item { LabelText { text: "CAR OFF" - color: Theme.getColor("offCarForeground") + color: Theme.offCarForeground font.pixelSize: 40 font.bold: true } LabelText { text: "-" - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground font.pixelSize: 40 font.bold: true } LabelText { text: "GLVMS ON" - color: Theme.getColor("onGLVMSForeground") + color: Theme.onGLVMSForeground font.pixelSize: 40 font.bold: true } diff --git a/NERODevelopment/content/OffScreen2.qml b/NERODevelopment/content/OffScreen2.qml index 801591f..27ee13e 100644 --- a/NERODevelopment/content/OffScreen2.qml +++ b/NERODevelopment/content/OffScreen2.qml @@ -10,7 +10,7 @@ Rectangle { height: parent.height visible: true focus: true - color: Theme.getColor("background") + color: Theme.background property variant attributeStatusMap: offViewController.attributeStatus @@ -80,21 +80,21 @@ Rectangle { LabelText { text: "CAR OFF" - color: Theme.getColor("offCarForeground") + color: Theme.offCarForeground font.pixelSize: 40 font.bold: true } LabelText { text: "-" - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground font.pixelSize: 40 font.bold: true } LabelText { text: "GLVMS ON" - color: Theme.getColor("onGLVMSForeground") + color: Theme.onGLVMSForeground font.pixelSize: 40 font.bold: true } @@ -108,7 +108,7 @@ Rectangle { height: parent.height / 2 width: parent.width / 2 - color: Theme.getColor("transparent") + color: "transparent" Rectangle { id: lvStatusContainer @@ -116,7 +116,7 @@ Rectangle { anchors.top: parent.top width: parent.width height: parent.height / 5 - color: Theme.getColor("transparent") + color: "transparent" StatusDisplay { id: glvms @@ -157,7 +157,7 @@ Rectangle { anchors.bottom: parent.bottom anchors.right: parent.right anchors.left: parent.left - color: Theme.getColor("transparent") + color: "transparent" Rectangle { id: bmsimdContainer @@ -165,7 +165,7 @@ Rectangle { anchors.left: parent.left anchors.bottom: parent.bottom width: parent.width / 3 - color: Theme.getColor("transparent") + color: "transparent" StatusDisplay { id: bms @@ -208,7 +208,7 @@ Rectangle { anchors.top: parent.top anchors.bottom: parent.bottom width: parent.width / 3 - color: Theme.getColor("transparent") + color: "transparent" StatusDisplay { id: can @@ -306,7 +306,7 @@ Rectangle { anchors.leftMargin: -latch.width / 2 width: parent.width * 0.42 height: parent.height / 10 - color: Theme.getColor("transparent") + color: "transparent" StatusDisplay { id: bots @@ -361,7 +361,7 @@ Rectangle { anchors.topMargin: parent.height / 22 height: parent.height / 10 width: parent.width * 0.55 - color: Theme.getColor("transparent") + color: "transparent" StatusDisplay { id: cpBrb @@ -439,7 +439,7 @@ Rectangle { anchors.top: offHeader.bottom anchors.right: parent.right anchors.bottom: cpBrbInterlocksTsmsContainer.top - color: Theme.getColor("transparent") + color: "transparent" Rectangle { id: tempContainer @@ -447,7 +447,7 @@ Rectangle { anchors.top: parent.top anchors.right: parent.right height: parent.height / 2 - color: Theme.getColor("transparent") + color: "transparent" ThermometerValueComponent { id: packTemp diff --git a/NERODevelopment/content/Pit.qml b/NERODevelopment/content/Pit.qml index 3aa123f..8a46974 100644 --- a/NERODevelopment/content/Pit.qml +++ b/NERODevelopment/content/Pit.qml @@ -22,7 +22,7 @@ Rectangle { property int labelFontSize: Math.min(height / 20, width / 20) property int unitFontSize: valueFontSize / 1.5 - color: Theme.getColor("background") + color: Theme.background height: 480 width: 800 diff --git a/NERODevelopment/content/Radial.qml b/NERODevelopment/content/Radial.qml index 097f16a..82d8fd8 100644 --- a/NERODevelopment/content/Radial.qml +++ b/NERODevelopment/content/Radial.qml @@ -14,7 +14,7 @@ Item { property int mainTextTopPadding: 0 property int heightOffset: 100 property string label: "mph" - property string color: Theme.getColor("accentPurple") + property string color: Theme.accentPurple property string unitLabel: "" property int valueFontSize: width / 10 property int unitFontSize: valueFontSize / 2 @@ -25,7 +25,7 @@ Item { anchors.horizontalCenter: parent.horizontalCenter font.pixelSize: gauge.valueFontSize font.family: webFont.name - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground anchors.centerIn: ring anchors.verticalCenterOffset: -gauge.height / 20 @@ -69,7 +69,7 @@ Item { // Draw the progress ring const gradient = context.createLinearGradient(0, 0, ring.width, 0) - gradient.addColorStop(0, Theme.getColor("fillGradientStop")) + gradient.addColorStop(0, Theme.fillGradientStop) gradient.addColorStop(1, gauge.color) context.fillStyle = gradient context.strokeStyle = gradient @@ -103,7 +103,7 @@ Item { Text { id: mph text: gauge.label - color: Theme.getColor("mutedForeground") + color: Theme.mutedForeground font.family: webFont.name font.pixelSize: gauge.unitFontSize anchors.top: valueText.bottom diff --git a/NERODevelopment/content/RunInfo.qml b/NERODevelopment/content/RunInfo.qml index 7612eaa..8c51c0e 100644 --- a/NERODevelopment/content/RunInfo.qml +++ b/NERODevelopment/content/RunInfo.qml @@ -5,7 +5,7 @@ import NERO Item { id: runInfo - property string backgroundColor: Theme.getColor("lastRunBackground") + property string backgroundColor: Theme.lastRunBackground property string label: "" property int value: 0 property int topRadius: 0 @@ -95,7 +95,7 @@ Item { id: rightBlackRectangle width: runInfo.width / 2.3 height: runInfo.height * 0.8 - color: Theme.getColor("background") + color: Theme.background x: runInfo.width / 1.85 anchors { @@ -107,7 +107,7 @@ Item { text: formatTime(runInfo.value) font.pixelSize: rightBlackRectangle.height * 0.9 anchors.centerIn: parent - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground font.bold: true font.letterSpacing: 0 } @@ -122,7 +122,7 @@ Item { leftMargin: parent.width / 40 } font.pixelSize: Math.min(runInfo.height * 0.45) - color: Theme.getColor("inverseForeground") + color: Theme.inverseForeground font.bold: true } } diff --git a/NERODevelopment/content/SpeedMode.qml b/NERODevelopment/content/SpeedMode.qml index 20ddc53..e7e3d24 100644 --- a/NERODevelopment/content/SpeedMode.qml +++ b/NERODevelopment/content/SpeedMode.qml @@ -45,7 +45,7 @@ Item { width: speedMode.width * 0.7 height: speedMode.height * 0.12 text: speedMode.tractionControlStatus ? "TRACTION CONTROL - ON" : "TRACTION CONTROL - OFF" - color: speedMode.tractionControlStatus ? Theme.getColor("goodStatus") : Theme.getColor("criticalStatus") + color: speedMode.tractionControlStatus ? Theme.goodStatus : Theme.criticalStatus font.pixelSize: Math.min(speedMode.height * 0.09, speedMode.width * 0.06) font.bold: true @@ -129,7 +129,7 @@ Item { Layout.preferredWidth: 1 LabelText { - color: Theme.getColor("accentForeground") + color: Theme.accentForeground text: "TOP SPEED" Layout.preferredHeight: 2 Layout.fillWidth: true @@ -144,7 +144,7 @@ Item { Layout.preferredHeight: 9 Layout.fillHeight: true Layout.fillWidth: true - color: Theme.getColor("accentBlue") + color: Theme.accentBlue valueFontSize: speedMode.valueFontSize unitFontSize: speedMode.radialUnitFontSize } @@ -157,7 +157,7 @@ Item { clip: false LabelText { - color: Theme.getColor("accentForeground") + color: Theme.accentForeground text: "MAX DRAW" Layout.preferredHeight: 2 Layout.fillWidth: true diff --git a/NERODevelopment/content/StatusDisplay.qml b/NERODevelopment/content/StatusDisplay.qml index 622c44d..17c0b3b 100644 --- a/NERODevelopment/content/StatusDisplay.qml +++ b/NERODevelopment/content/StatusDisplay.qml @@ -18,8 +18,8 @@ Item { id: background anchors.fill: parent radius: 5 - color: detailDisplay.status == 0 ? Theme.getColor("background") : (detailDisplay.status == 1 ? Theme.getColor("goodStatus") : (detailDisplay.status == 2 ? Theme.getColor("criticalStatus") : Theme.getColor("transparent"))) - border.color: Theme.getColor("primaryForeground") + color: detailDisplay.status == 0 ? Theme.background : (detailDisplay.status == 1 ? Theme.goodStatus : (detailDisplay.status == 2 ? Theme.criticalStatus : "transparent")) + border.color: Theme.primaryForeground border.width: 1 Behavior on border.width { @@ -41,7 +41,7 @@ Item { LabelText { id: taskText - color: detailDisplay.status == 0 ? Theme.getColor("primaryForeground") : Theme.getColor("inverseForeground") + color: detailDisplay.status == 0 ? Theme.primaryForeground : Theme.inverseForeground text: detailDisplay.shutdownFlowTask anchors.centerIn: parent font.bold: true diff --git a/NERODevelopment/content/SubMenuIcon.qml b/NERODevelopment/content/SubMenuIcon.qml index e7d9e42..1296bc3 100644 --- a/NERODevelopment/content/SubMenuIcon.qml +++ b/NERODevelopment/content/SubMenuIcon.qml @@ -12,8 +12,8 @@ Rectangle { property string text: "FLAPPY BIRD" gradient: Gradient { - GradientStop { position: 0.0; color: highlighted ? Theme.getColor("iconHighlightedBackground") : Theme.getColor("iconBackground") } - GradientStop { position: 1.0; color: highlighted ? Theme.getColor("iconHighlightedGradientStop") : Theme.getColor("iconGradientStop") } + GradientStop { position: 0.0; color: highlighted ? Theme.iconHighlightedBackground : Theme.iconBackground } + GradientStop { position: 1.0; color: highlighted ? Theme.iconHighlightedGradientStop : Theme.iconGradientStop } } LabelText { diff --git a/NERODevelopment/content/Thermometer.qml b/NERODevelopment/content/Thermometer.qml index 07af6ec..e9cddf1 100644 --- a/NERODevelopment/content/Thermometer.qml +++ b/NERODevelopment/content/Thermometer.qml @@ -9,11 +9,11 @@ Rectangle { property int value: 0 property int maxValue: 65 property int minValue: -15 - property string fillColor: regen ? Theme.getColor("redThermoStatus") : value > maxValue - ((Math.abs(maxValue) + Math.abs( - minValue)) / 5) ? Theme.getColor("redThermoStatus") : value > maxValue - (((Math.abs(maxValue) + Math.abs(minValue)) / 5) * 2) ? Theme.getColor("orangeThermoStatus") : value > maxValue - (((Math.abs(maxValue) + Math.abs(minValue)) / 5) * 3) ? Theme.getColor("yellowThermoStatus") : value > maxValue - (((Math.abs(maxValue) + Math.abs(minValue)) / 5) * 4) ? Theme.getColor("blueThermoStatus") : Theme.getColor("purpleThermoStatus") + property string fillColor: regen ? Theme.redThermoStatus : value > maxValue - ((Math.abs(maxValue) + Math.abs( + minValue)) / 5) ? Theme.redThermoStatus : value > maxValue - (((Math.abs(maxValue) + Math.abs(minValue)) / 5) * 2) ? Theme.orangeThermoStatus : value > maxValue - (((Math.abs(maxValue) + Math.abs(minValue)) / 5) * 3) ? Theme.yellowThermoStatus : value > maxValue - (((Math.abs(maxValue) + Math.abs(minValue)) / 5) * 4) ? Theme.blueThermoStatus : Theme.purpleThermoStatus height: 500 width: height / 2.233 - color: Theme.getColor("transparent") + color: "transparent" property int thermometerWidth: thermometer.height / 2.233 property int horizontalPadding: thermometer.thermometerWidth / 10 @@ -76,7 +76,7 @@ Rectangle { stops: [ GradientStop { position: 1.0 - color: Theme.getColor("fillGradientStop") + color: Theme.fillGradientStop }, GradientStop { position: -0.8 @@ -98,7 +98,7 @@ Rectangle { stops: [ GradientStop { position: 1.5 - color: Theme.getColor("fillGradientStop") + color: Theme.fillGradientStop }, GradientStop { position: 0.0 @@ -117,7 +117,7 @@ Rectangle { right: fillRectangle.right bottom: fillRectangle.top } - color: Theme.getColor("background") + color: Theme.background } Lightning { diff --git a/NERODevelopment/content/ThermometerValueComponent.qml b/NERODevelopment/content/ThermometerValueComponent.qml index 12f7f98..c24f851 100644 --- a/NERODevelopment/content/ThermometerValueComponent.qml +++ b/NERODevelopment/content/ThermometerValueComponent.qml @@ -9,7 +9,7 @@ Item { property int horizontalIconSpacing: width * 0.1 property int labelVerticalSpacing: height * 0.1 property bool regen: false - property string labelColor: Theme.getColor("accentForeground") + property string labelColor: Theme.accentForeground property int horizontalPadding: width * 0.1 property int radius property int valueFontSize diff --git a/NERODevelopment/content/TimerDisplay.qml b/NERODevelopment/content/TimerDisplay.qml index 0648a09..be3d5d4 100644 --- a/NERODevelopment/content/TimerDisplay.qml +++ b/NERODevelopment/content/TimerDisplay.qml @@ -27,7 +27,7 @@ Item { Layout.preferredWidth: 6 Layout.fillWidth: true Layout.fillHeight: true - backgroundColor: Theme.getColor("currentRunBackground") + backgroundColor: Theme.currentRunBackground label: "CURRENT RUN" value: timerDisplay.currentRunTime radius: timerDisplay.radius @@ -38,7 +38,7 @@ Item { Layout.preferredWidth: 5 Layout.fillWidth: true Layout.fillHeight: true - backgroundColor: Theme.getColor("lastRunBackground") + backgroundColor: Theme.lastRunBackground label: "LAST RUN" value: timerDisplay.lastRunTime } @@ -47,7 +47,7 @@ Item { Layout.preferredWidth: 6 Layout.fillWidth: true Layout.fillHeight: true - backgroundColor: Theme.getColor("fastestRunBackground") + backgroundColor: Theme.fastestRunBackground label: "FASTEST RUN" value: timerDisplay.fastestRunTime radius: timerDisplay.radius @@ -63,7 +63,7 @@ Item { RunInfo { Layout.fillWidth: true Layout.fillHeight: true - backgroundColor: Theme.getColor("currentRunBackground") + backgroundColor: Theme.currentRunBackground label: "CURRENT RUN" value: timerDisplay.currentRunTime radius: timerDisplay.radius @@ -74,7 +74,7 @@ Item { RunInfo { Layout.fillWidth: true Layout.fillHeight: true - backgroundColor: Theme.getColor("lastRunBackground") + backgroundColor: Theme.lastRunBackground label: "LAST RUN" value: timerDisplay.lastRunTime vertical: true @@ -83,7 +83,7 @@ Item { RunInfo { Layout.fillWidth: true Layout.fillHeight: true - backgroundColor: Theme.getColor("fastestRunBackground") + backgroundColor: Theme.fastestRunBackground label: "FASTEST RUN" value: timerDisplay.fastestRunTime radius: timerDisplay.radius diff --git a/NERODevelopment/content/TorqueAdj.qml b/NERODevelopment/content/TorqueAdj.qml index 617ea2f..e90d56c 100644 --- a/NERODevelopment/content/TorqueAdj.qml +++ b/NERODevelopment/content/TorqueAdj.qml @@ -8,7 +8,7 @@ Rectangle { property bool downSelected: false height: 200 width: 100 - color: Theme.getColor("transparent") + color: "transparent" Column { id: arrowContainer @@ -32,7 +32,7 @@ Rectangle { onPaint: { var ctx = upCanvas.getContext('2d') - ctx.strokeStyle = Theme.getColor("primaryForeground") + ctx.strokeStyle = Theme.primaryForeground ctx.lineWidth = upCanvas.height * 0.3 ctx.beginPath() ctx.moveTo(upCanvas.width * 0.05, upCanvas.height) @@ -72,7 +72,7 @@ Rectangle { height: parent.height / 3 width: parent.width - color: Theme.getColor("transparent") + color: "transparent" } Item { @@ -98,7 +98,7 @@ Rectangle { onPaint: { var ctx = downCanvas.getContext('2d') - ctx.strokeStyle = Theme.getColor("primaryForeground") + ctx.strokeStyle = Theme.primaryForeground ctx.lineWidth = downCanvas.height * 0.3 ctx.beginPath() ctx.moveTo(downCanvas.width * 0.05, downCanvas.height) diff --git a/NERODevelopment/content/TorqueValueComponent.qml b/NERODevelopment/content/TorqueValueComponent.qml index eda2dfd..0990ef7 100644 --- a/NERODevelopment/content/TorqueValueComponent.qml +++ b/NERODevelopment/content/TorqueValueComponent.qml @@ -9,7 +9,7 @@ Item { property int valueFontSize property int labelFontSize property int radius - property string labelColor: Theme.getColor("accentForeground") + property string labelColor: Theme.accentForeground property int horizontalIconSpacing: width * 0.1 property int labelVerticalSpacing: height * 0.1 property int unitFontSize: valueFontSize / 1.5 diff --git a/NERODevelopment/content/ValueText.qml b/NERODevelopment/content/ValueText.qml index 9ced9b3..4949333 100644 --- a/NERODevelopment/content/ValueText.qml +++ b/NERODevelopment/content/ValueText.qml @@ -8,5 +8,5 @@ Text { font.family: webFont.name font.pixelSize: 85 font.letterSpacing: -3 - color: Theme.getColor("primaryForeground") + color: Theme.primaryForeground } diff --git a/NERODevelopment/imports/NERO/Theme.qml b/NERODevelopment/imports/NERO/Theme.qml index fe2b7e8..48cf87e 100644 --- a/NERODevelopment/imports/NERO/Theme.qml +++ b/NERODevelopment/imports/NERO/Theme.qml @@ -1,121 +1,76 @@ pragma Singleton -import QtQuick 6.2 +import QtQuick QtObject { - property string currentTheme: "dark" - property var themes: { - "dark": { - background: "#000000", - primaryForeground: "#FFFFFF", - accentForeground: "#47A7FF", - inverseForeground: "#000000", - blackForeground: "#000000", - mutedForeground: "#777777", - offCarForeground: "#ff0101", - onGLVMSForeground: "#1cff00", - - transparent: "transparent", - - currentRunBackground: "#47A7FF", - lastRunBackground: "#FFFFFF", - fastestRunBackground: "#AD00FF", - - directionBackground: "#55AAFF", - - iconHighlightedBackground: "#6E6E6E", - iconBackground: "#191919", - iconHighlightedGradientStop: "#333333", - iconGradientStop:"#111111", - - goodStatus: "#55FF00", - cautionStatus: "orange", - criticalStatus: "red", - - redThermoStatus: "red", - orangeThermoStatus: "orange", - yellowThermoStatus: "#FFF500", - blueThermoStatus: "blue", - purpleThermoStatus: "purple", - - fillGradientStop: "#000000", - - backgroundPicture: "#CBCACA", - popoverBackground: "#FFFFFF", - descriptionButtonBackground: "#000000", - descriptionButtonForeground: "#FFFFFF", - - accentBlue: "blue", - accentGreen: "#14F504", - accentPurple: "purple", - - primaryMicrophone: "#00AA00", - secondaryMicrophone: "#00FF000", - - primaryDetailGradient: "black", - secondaryDetailGradient: "#969696", - - nonCriticalBackground: "#ffca62", - nonCriticalForeground: "white" - }, - "light": { - background: "#FFFFFF", - primaryForeground: "#000000", - accentForeground: "#47A7FF", - inverseForeground: "#FFFFFF", - blackForeground: "#000000", - mutedForeground: "#777777", - offCarForeground: "#ff0101", - onGLVMSForeground: "#1cff00", - - transparent: "transparent", - - currentRunBackground: "#47A7FF", - lastRunBackground: "#000000", - fastestRunBackground: "#AD00FF", - - directionBackground: "#55AAFF", - - iconHighlightedBackground: "#DCDCDC", - iconBackground: "#1919190A", - iconHighlightedGradientStop: "#C4C4C4", - iconGradientStop:"#1111110A", - - goodStatus: "#55FF00", - cautionStatus: "orange", - criticalStatus: "red", - - redThermoStatus: "red", - orangeThermoStatus: "orange", - yellowThermoStatus: "#FFF500", - blueThermoStatus: "blue", - purpleThermoStatus: "purple", - - fillGradientStop: "#FFFFFF", - - backgroundPicture: "#CBCACA", - popoverBackground: "#FFFFFF", - descriptionButtonBackground: "#000000", - descriptionButtonForeground: "#FFFFFF", - - accentBlue: "blue", - accentGreen: "#14F504", - accentPurple: "purple", - - primaryMicrophone: "#00AA00", - secondaryMicrophone: "#00FF000", - - primaryDetailGradient: "black", - secondaryDetailGradient: "#969696", - - nonCriticalBackground: "#ffca62", - nonCriticalForeground: "white" - } - } - function getColor(prop) { - return themes[currentTheme][prop]; - } - - function setTheme(theme) { - currentTheme = theme - } + id: root + + property string currentTheme: "dark" + readonly property bool isDark: currentTheme === "dark" + + // Core foregrounds + readonly property color background: isDark ? "#000000" : "#FFFFFF" + readonly property color primaryForeground: isDark ? "#FFFFFF" : "#000000" + readonly property color accentForeground: "#47A7FF" + readonly property color inverseForeground: isDark ? "#000000" : "#FFFFFF" + readonly property color blackForeground: "#000000" + readonly property color mutedForeground: "#777777" + readonly property color offCarForeground: "#ff0101" + readonly property color onGLVMSForeground: "#1cff00" + + // Run timer backgrounds + readonly property color currentRunBackground: "#47A7FF" + readonly property color lastRunBackground: isDark ? "#FFFFFF" : "#000000" + readonly property color fastestRunBackground: "#AD00FF" + + // Direction + readonly property color directionBackground: "#55AAFF" + + // Icon backgrounds + readonly property color iconHighlightedBackground: isDark ? "#6E6E6E" : "#DCDCDC" + readonly property color iconBackground: isDark ? "#191919" : "#1919190A" + readonly property color iconHighlightedGradientStop: isDark ? "#333333" : "#C4C4C4" + readonly property color iconGradientStop: isDark ? "#111111" : "#1111110A" + + // Status colors + readonly property color goodStatus: "#55FF00" + readonly property color cautionStatus: "orange" + readonly property color criticalStatus: "red" + + // Thermometer status + readonly property color redThermoStatus: "red" + readonly property color orangeThermoStatus: "orange" + readonly property color yellowThermoStatus: "#FFF500" + readonly property color blueThermoStatus: "blue" + readonly property color purpleThermoStatus: "purple" + + // Gradients / fills + readonly property color fillGradientStop: isDark ? "#000000" : "#FFFFFF" + + // Popover / modal + readonly property color backgroundPicture: "#CBCACA" + readonly property color popoverBackground: "#FFFFFF" + readonly property color descriptionButtonBackground: "#000000" + readonly property color descriptionButtonForeground: "#FFFFFF" + + // Accent colors + readonly property color accentBlue: "blue" + readonly property color accentGreen: "#14F504" + readonly property color accentPurple: "purple" + + // Microphone + readonly property color primaryMicrophone: "#00AA00" + readonly property color secondaryMicrophone: "#00FF00" + + // Detail display gradient + readonly property color primaryDetailGradient: "black" + readonly property color secondaryDetailGradient: "#969696" + + // Non-critical warning + readonly property color nonCriticalBackground: "#ffca62" + readonly property color nonCriticalForeground: "white" + + // Theme switching + function setTheme(theme: string) { + currentTheme = theme + } }