diff options
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/theming/css/default.css | 16 | ||||
| -rw-r--r-- | apps/theming/lib/Themes/DarkTheme.php | 5 | ||||
| -rw-r--r-- | apps/theming/lib/Themes/DefaultTheme.php | 14 | ||||
| -rw-r--r-- | apps/theming/tests/Themes/DefaultThemeTest.php | 2 |
4 files changed, 21 insertions, 16 deletions
diff --git a/apps/theming/css/default.css b/apps/theming/css/default.css index f7bf3a20d09..4bd9fb13bb8 100644 --- a/apps/theming/css/default.css +++ b/apps/theming/css/default.css @@ -1,4 +1,4 @@ -:root { +:root { --color-main-background: #ffffff; --color-main-background-rgb: 255,255,255; --color-main-background-translucent: rgba(var(--color-main-background-rgb), .97); @@ -10,25 +10,25 @@ --color-placeholder-dark: #cccccc; --color-primary: #0082c9; --color-primary-text: #ffffff; - --color-primary-hover: #198ece; - --color-primary-light: #72bae1; + --color-primary-hover: #329bd3; + --color-primary-light: #e5f2f9; --color-primary-light-text: #0082c9; - --color-primary-light-hover: #0f567d; + --color-primary-light-hover: #1e2b32; --color-primary-text-dark: #ededed; --color-primary-element: #0082c9; --color-primary-element-hover: #198ece; --color-primary-element-light: #17adff; - --color-primary-element-lighter: #6cb7df; + --color-primary-element-lighter: #d8ecf6; --color-main-text: #222222; --color-text-maxcontrast: #767676; --color-text-light: #222222; --color-text-lighter: #767676; --color-error: #e9322d; - --color-error-hover: #eb4642; + --color-error-hover: #ed5a56; --color-warning: #eca700; - --color-warning-hover: #edaf19; + --color-warning-hover: #efb832; --color-success: #46ba61; - --color-success-hover: #58c070; + --color-success-hover: #6ac780; --color-loading-light: #cccccc; --color-loading-dark: #444444; --color-box-shadow-rgb: 77,77,77; diff --git a/apps/theming/lib/Themes/DarkTheme.php b/apps/theming/lib/Themes/DarkTheme.php index f0cacfc1696..b2dc1dcea72 100644 --- a/apps/theming/lib/Themes/DarkTheme.php +++ b/apps/theming/lib/Themes/DarkTheme.php @@ -69,6 +69,11 @@ class DarkTheme extends DefaultTheme implements ITheme { '--color-placeholder-light' => $this->util->lighten($colorMainBackground, 10), '--color-placeholder-dark' => $this->util->lighten($colorMainBackground, 20), + '--color-primary-hover' => $this->util->mix($this->primaryColor, $colorMainBackground, 60), + '--color-primary-light' => $this->util->mix($this->primaryColor, $colorMainBackground, -80), + '--color-primary-element-hover' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, 80), + '--color-primary-element-lighter' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, -70), + '--color-text-maxcontrast' => $this->util->darken($colorMainText, 30), '--color-text-light' => $this->util->darken($colorMainText, 10), '--color-text-lighter' => $this->util->darken($colorMainText, 20), diff --git a/apps/theming/lib/Themes/DefaultTheme.php b/apps/theming/lib/Themes/DefaultTheme.php index 7efd8f133d7..191cb5814af 100644 --- a/apps/theming/lib/Themes/DefaultTheme.php +++ b/apps/theming/lib/Themes/DefaultTheme.php @@ -108,16 +108,16 @@ class DefaultTheme implements ITheme { // primary related colours '--color-primary' => $this->primaryColor, '--color-primary-text' => $this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff', - '--color-primary-hover' => $this->util->mix($this->primaryColor, $colorMainBackground, 80), - '--color-primary-light' => $this->util->mix($this->primaryColor, $colorMainBackground, 10), + '--color-primary-hover' => $this->util->mix($this->primaryColor, $colorMainBackground, 60), + '--color-primary-light' => $this->util->mix($this->primaryColor, $colorMainBackground, -80), '--color-primary-light-text' => $this->primaryColor, - '--color-primary-light-hover' => $this->util->mix($this->primaryColor, $colorMainText, 10), + '--color-primary-light-hover' => $this->util->mix($this->primaryColor, $colorMainText, -80), '--color-primary-text-dark' => $this->util->darken($this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff', 7), // used for buttons, inputs... '--color-primary-element' => $this->util->elementColor($this->primaryColor), '--color-primary-element-hover' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, 80), '--color-primary-element-light' => $this->util->lighten($this->util->elementColor($this->primaryColor), 15), - '--color-primary-element-lighter' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, 15), + '--color-primary-element-lighter' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, -70), // max contrast for WCAG compliance '--color-main-text' => $colorMainText, @@ -127,11 +127,11 @@ class DefaultTheme implements ITheme { // info/warning/success feedback colours '--color-error' => '#e9322d', - '--color-error-hover' => $this->util->mix('#e9322d', $colorMainBackground, 80), + '--color-error-hover' => $this->util->mix('#e9322d', $colorMainBackground, 60), '--color-warning' => '#eca700', - '--color-warning-hover' => $this->util->mix('#eca700', $colorMainBackground, 80), + '--color-warning-hover' => $this->util->mix('#eca700', $colorMainBackground, 60), '--color-success' => '#46ba61', - '--color-success-hover' => $this->util->mix('#46ba61', $colorMainBackground, 80), + '--color-success-hover' => $this->util->mix('#46ba61', $colorMainBackground, 60), // used for the icon loading animation '--color-loading-light' => '#cccccc', diff --git a/apps/theming/tests/Themes/DefaultThemeTest.php b/apps/theming/tests/Themes/DefaultThemeTest.php index 486e7c7a1e5..b9302bb4c95 100644 --- a/apps/theming/tests/Themes/DefaultThemeTest.php +++ b/apps/theming/tests/Themes/DefaultThemeTest.php @@ -127,7 +127,7 @@ class DefaultThemeTest extends TestCase { $variables .= " $variable: $value;" . PHP_EOL; }; - $css = ":root { " . PHP_EOL . "$variables}" . PHP_EOL; + $css = ":root {" . PHP_EOL . "$variables}" . PHP_EOL; $fallbackCss = file_get_contents(__DIR__ . '/../../css/default.css'); $this->assertEquals($css, $fallbackCss); |