From ee93cabdd5de87af3feb34d97335ecd81a3505c2 Mon Sep 17 00:00:00 2001
From: armored-dragon <publicmail@armoreddragon.com>
Date: Sun, 17 Nov 2024 04:21:59 -0600
Subject: [PATCH] Custom checkboxes

---
 .../settings/qml_widgets/SettingBoolean.qml   |  56 +++++++++
 scripts/system/settings/settings.qml          | 112 +++++++++---------
 2 files changed, 109 insertions(+), 59 deletions(-)
 create mode 100644 scripts/system/settings/qml_widgets/SettingBoolean.qml

diff --git a/scripts/system/settings/qml_widgets/SettingBoolean.qml b/scripts/system/settings/qml_widgets/SettingBoolean.qml
new file mode 100644
index 0000000000..19c7602090
--- /dev/null
+++ b/scripts/system/settings/qml_widgets/SettingBoolean.qml
@@ -0,0 +1,56 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.3
+
+Item {
+	id: root;
+	property string settingText: "";
+	property bool settingEnabled: false;
+
+	height: 50;
+	width: parent.width;
+
+	RowLayout {
+		width: parent.width;
+		height: parent.height;
+
+		Rectangle {
+			color: settingEnabled ? "#077e30" : "darkgray";
+			height: parent.parent.height - 15;
+			width: 90;
+			radius: 10;
+
+			Text {
+				width: parent.width;
+				height: parent.height;
+				text: settingEnabled ? "On" : "Off";
+				color: "white";
+				horizontalAlignment: Text.AlignHCenter;
+				verticalAlignment: Text.AlignVCenter;
+				font.pointSize: 14;
+			}
+
+			MouseArea {
+				anchors.fill: parent
+
+				onClicked: {
+					settingEnabled = !settingEnabled
+				}
+			}
+
+			Behavior on color {
+				ColorAnimation {
+					duration: 70
+				}
+			}
+		}
+
+		Text {
+			anchors.left: parent.children[0].right + 5;
+			height: parent.height;
+			text: settingText;
+			color: "white";
+			font.pointSize: 14;
+		}
+	}
+}
\ No newline at end of file
diff --git a/scripts/system/settings/settings.qml b/scripts/system/settings/settings.qml
index 7d25bd6842..c1614e09e3 100644
--- a/scripts/system/settings/settings.qml
+++ b/scripts/system/settings/settings.qml
@@ -102,73 +102,67 @@ Rectangle {
             }
 		}
 
-		// FIXME: Height is hardcoded
 		// Rendering Effects sub options
 		Item {
-			Layout.fillWidth: true
-			visible: rendering_effects_state.checked == true
-			height: 150
+			Layout.fillWidth: true;
+			visible: rendering_effects_state.checked == true;
+			height: children[0].height;
 
 			Rectangle {
-				color: "#333333"
-				height: parent.children[1].height
-				width: parent.width
-			}
+				color: "#222222";
+				width: parent.width;
+				height: children[0].height;
+				radius: 10;	
 
-			GridLayout {
-				columns: 2
-				height: 150
-				width: parent.width - 10
-				anchors.horizontalCenter: parent.horizontalCenter
-				id: renderSettingsContainer
+				GridLayout {
+					columns: 2;
+					width: parent.width - 10;
+					anchors.horizontalCenter: parent.horizontalCenter;
+					id: renderSettingsContainer;
 
-				CheckBox {
-					text: "Shadows"
-					Layout.fillWidth: true
-					palette.windowText: "gray"
-					checked: Render.shadowsEnabled
-					onCheckedChanged: {
-					   Render.shadowsEnabled = checked;
-					}
-				}
-				
-				CheckBox {
-					text: "Local Lights"
-					Layout.fillWidth: true
-					palette.windowText: "gray"
-					checked: Render.localLightsEnabled
-					onCheckedChanged: {
-					   Render.localLightsEnabled = checked;
-					}
-				}
-				
-				CheckBox {
-					text: "Fog"
-					Layout.fillWidth: true
-					palette.windowText: "gray" 
-					checked: Render.fogEnabled
-					onCheckedChanged: {
-					   Render.fogEnabled = checked;
-					}
-				}
+					SettingBoolean {
+						settingText: "Shadows";
+						settingEnabled: Render.shadowsEnabled
 
-				CheckBox {
-					text: "Haze"
-					Layout.fillWidth: true
-					palette.windowText: "gray"
-					checked: Render.hazeEnabled
-					onCheckedChanged: {
-					   Render.hazeEnabled = checked;
+						onSettingEnabledChanged: {
+							Render.shadowsEnabled = settingEnabled;
+						}
 					}
-				}
-				
-				CheckBox {
-					text: "Bloom"
-					Layout.fillWidth: true
-					palette.windowText: "gray"
-					checked:  Render.bloomEnabled
-					onCheckedChanged: {
-					   Render.bloomEnabled = checked;
+
+					SettingBoolean {
+						settingText: "Local Lights";
+						settingEnabled: Render.localLightsEnabled
+
+						onSettingEnabledChanged: {
+							Render.localLightsEnabled = settingEnabled;
+						}
+					}
+					
+					SettingBoolean {
+						settingText: "Fog";
+						settingEnabled: Render.fogEnabled
+
+						onSettingEnabledChanged: {
+							Render.fogEnabled = settingEnabled;
+						}
+					}
+
+					SettingBoolean {
+						settingText: "Haze";
+						settingEnabled: Render.hazeEnabled
+
+						onSettingEnabledChanged: {
+							Render.hazeEnabled = settingEnabled;
+						}
+					}
+
+					SettingBoolean {
+						settingText: "Bloom";
+						settingEnabled: Render.bloomEnabled 
+
+						onSettingEnabledChanged: {
+							Render.bloomEnabled = settingEnabled;
+						}
 					}
 				}
 			}