From 2897264acb7babe4ae1131cdf806071d556749f0 Mon Sep 17 00:00:00 2001
From: Rijk van Zanten <rijkvanzanten@me.com>
Date: Mon, 6 Dec 2021 14:19:43 -0500
Subject: [PATCH] Use variables for default colors in boolean interface/display
 (#10346)

* Use variables for default colors in boolean interface/display

Fixes #10333

* Fix translations name
---
 app/src/displays/boolean/boolean.vue   |  4 ++--
 app/src/displays/boolean/index.ts      |  6 ------
 app/src/interfaces/boolean/boolean.vue |  4 ++--
 app/src/interfaces/boolean/index.ts    | 10 ++--------
 4 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/app/src/displays/boolean/boolean.vue b/app/src/displays/boolean/boolean.vue
index 1fe94d0306..a46211b24d 100644
--- a/app/src/displays/boolean/boolean.vue
+++ b/app/src/displays/boolean/boolean.vue
@@ -35,11 +35,11 @@ export default defineComponent({
 		},
 		colorOn: {
 			type: String,
-			default: '#00C897',
+			default: 'var(--primary)',
 		},
 		colorOff: {
 			type: String,
-			default: '#B0BEC5',
+			default: 'var(--foreground-subdued)',
 		},
 	},
 	setup(props) {
diff --git a/app/src/displays/boolean/index.ts b/app/src/displays/boolean/index.ts
index ccf5ec2e3f..1cbca41cf2 100644
--- a/app/src/displays/boolean/index.ts
+++ b/app/src/displays/boolean/index.ts
@@ -65,9 +65,6 @@ export default defineDisplay({
 				interface: 'select-color',
 				width: 'half',
 			},
-			schema: {
-				default_value: '#00C897',
-			},
 		},
 		{
 			field: 'colorOff',
@@ -77,9 +74,6 @@ export default defineDisplay({
 				interface: 'select-color',
 				width: 'half',
 			},
-			schema: {
-				default_value: '#B0BEC5',
-			},
 		},
 	],
 });
diff --git a/app/src/interfaces/boolean/boolean.vue b/app/src/interfaces/boolean/boolean.vue
index 1e5c22e053..4bd1456d6b 100644
--- a/app/src/interfaces/boolean/boolean.vue
+++ b/app/src/interfaces/boolean/boolean.vue
@@ -43,11 +43,11 @@ export default defineComponent({
 		},
 		colorOn: {
 			type: String,
-			default: '#00C897',
+			default: 'var(--primary)',
 		},
 		colorOff: {
 			type: String,
-			default: '#B0BEC5',
+			default: 'var(--foreground-subdued)',
 		},
 	},
 	emits: ['input'],
diff --git a/app/src/interfaces/boolean/index.ts b/app/src/interfaces/boolean/index.ts
index dc89ed6d6a..a532e1e97d 100644
--- a/app/src/interfaces/boolean/index.ts
+++ b/app/src/interfaces/boolean/index.ts
@@ -40,11 +40,8 @@ export default defineInterface({
 			name: '$t:interfaces.boolean.color_on',
 			type: 'string',
 			meta: {
-				width: 'half',
 				interface: 'select-color',
-			},
-			schema: {
-				default_value: '#00C897',
+				width: 'half',
 			},
 		},
 		{
@@ -52,11 +49,8 @@ export default defineInterface({
 			name: '$t:interfaces.boolean.color_off',
 			type: 'string',
 			meta: {
-				width: 'half',
 				interface: 'select-color',
-			},
-			schema: {
-				default_value: '#B0BEC5',
+				width: 'half',
 			},
 		},
 		{