feat(core): ✨ update state background color

Switch to a semi-transparent color so it blends with the background. Fix #639
StarCitizenTools · Jun 1, 2023 · 8a618a6 · 8a618a6
1 parent b537776
commit 8a618a6
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 15 deletions.
diff --git a/resources/skins.citizen.styles/common/cssvariables.less b/resources/skins.citizen.styles/common/cssvariables.less
@@ -18,10 +18,6 @@
 	--background-color-quiet--hover: @background-color-quiet--hover;
 	--background-color-quiet--active: @background-color-quiet--active;
 
-	--background-color-destructive: @background-color-destructive;
-	--background-color-warning: @background-color-warning;
-	--background-color-success: @background-color-success;
-
 	/* Foreground Colors */
 	--color-base: @color-base;
 	--color-base--emphasized: @color-base--emphasized;
@@ -133,10 +129,6 @@ html {
 	--background-color-quiet--hover: @dark-background-color-quiet--hover;
 	--background-color-quiet--active: @dark-background-color-quiet--active;
 
-	--background-color-destructive: @dark-background-color-destructive;
-	--background-color-warning: @dark-background-color-warning;
-	--background-color-success: @dark-background-color-success;
-
 	--color-text-error: @dark-color-text-error;
 	--color-text-warning: @dark-color-text-warning;
 	--color-text-success: @dark-color-text-success;

diff --git a/resources/skins.citizen.styles/common/theme.less b/resources/skins.citizen.styles/common/theme.less
@@ -23,6 +23,10 @@
 	--color-surface-2--hover: @color-surface-2--hover;
 	--color-surface-2--active: @color-surface-2--active;
 
+	--background-color-destructive: rgba( 221, 51, 51, 0.1 );
+	--background-color-success: rgba( 0, 175, 137, 0.1 );
+	--background-color-warning: rgba( 255, 204, 51, 0.1 );
+
 	--box-shadow-card: @box-shadow-card;
 	--box-shadow-dialog: @box-shadow-dialog;
 

diff --git a/resources/variables.less b/resources/variables.less
@@ -152,9 +152,6 @@
 
 @background-color-primary--hover:	@color-accent90;
 @background-color-primary--active:	rgba( 41, 98, 204, 0.1 );
-@background-color-destructive:		@color-red90;
-@background-color-warning:			@color-yellow90;
-@background-color-success:			@color-green90;
 
 /* Foreground colors */
 @color-base:				@color-base20;
@@ -259,10 +256,6 @@
 @dark-background-color-primary--hover:	@color-accent30;
 @dark-background-color-primary--active:	@color-accent-30--darken;
 
-@dark-background-color-destructive:	@color-red30;
-@dark-background-color-warning:		@color-yellow30;
-@dark-background-color-success:		@color-green30;
-
 /* Foreground colors */
 @dark-color-text-error:			@color-accent50--lighten;
 @dark-color-text-warning:		@color-yellow50;