From 27ebaea10c3b7868379150d0e44e17baefb3eb00 Mon Sep 17 00:00:00 2001 From: Christopher Ng Date: Mon, 5 Jun 2023 17:28:19 -0700 Subject: enh(theming): Error contrast Signed-off-by: Christopher Ng --- apps/theming/lib/Themes/DarkTheme.php | 7 +++++++ apps/theming/lib/Themes/DefaultTheme.php | 11 +++++++---- 2 files changed, 14 insertions(+), 4 deletions(-) (limited to 'apps/theming/lib') diff --git a/apps/theming/lib/Themes/DarkTheme.php b/apps/theming/lib/Themes/DarkTheme.php index 588f8f5a8a6..6c90c8e5aa5 100644 --- a/apps/theming/lib/Themes/DarkTheme.php +++ b/apps/theming/lib/Themes/DarkTheme.php @@ -59,6 +59,8 @@ class DarkTheme extends DefaultTheme implements ITheme { $colorBoxShadow = $this->util->darken($colorMainBackground, 70); $colorBoxShadowRGB = join(',', $this->util->hexToRGB($colorBoxShadow)); + $colorError = '#e9322d'; + return array_merge( $defaultVariables, $this->generatePrimaryVariables($colorMainBackground, $colorMainText), @@ -82,6 +84,11 @@ class DarkTheme extends DefaultTheme implements ITheme { '--color-text-light' => $this->util->darken($colorMainText, 10), '--color-text-lighter' => $this->util->darken($colorMainText, 20), + '--color-error' => $colorError, + '--color-error-rgb' => join(',', $this->util->hexToRGB($colorError)), + '--color-error-hover' => $this->util->mix($colorError, $colorMainBackground, 60), + '--color-error-text' => $this->util->lighten($colorError, 3), + // used for the icon loading animation '--color-loading-light' => '#777', '--color-loading-dark' => '#CCC', diff --git a/apps/theming/lib/Themes/DefaultTheme.php b/apps/theming/lib/Themes/DefaultTheme.php index 3fcaa7cf58f..3df6ce081f1 100644 --- a/apps/theming/lib/Themes/DefaultTheme.php +++ b/apps/theming/lib/Themes/DefaultTheme.php @@ -109,6 +109,8 @@ class DefaultTheme implements ITheme { $colorBoxShadow = $this->util->darken($colorMainBackground, 70); $colorBoxShadowRGB = join(',', $this->util->hexToRGB($colorBoxShadow)); + $colorError = '#e9322d'; + $variables = [ '--color-main-background' => $colorMainBackground, '--color-main-background-rgb' => $colorMainBackgroundRGB, @@ -137,10 +139,11 @@ class DefaultTheme implements ITheme { '--color-scrollbar' => 'rgba(' . $colorMainTextRgb . ', .15)', - // info/warning/success feedback colours - '--color-error' => '#e9322d', - '--color-error-rgb' => join(',', $this->util->hexToRGB('#e9322d')), - '--color-error-hover' => $this->util->mix('#e9322d', $colorMainBackground, 60), + // error/warning/success/info feedback colours + '--color-error' => $colorError, + '--color-error-rgb' => join(',', $this->util->hexToRGB($colorError)), + '--color-error-hover' => $this->util->mix($colorError, $colorMainBackground, 60), + '--color-error-text' => $this->util->darken($colorError, 4), '--color-warning' => '#eca700', '--color-warning-rgb' => join(',', $this->util->hexToRGB('#eca700')), '--color-warning-hover' => $this->util->mix('#eca700', $colorMainBackground, 60), -- cgit v1.2.3