fix(theming): replace `color-primary-text-dark` with `color-primary-element-text...

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>

diff --git a/apps/theming/css/default.css b/apps/theming/css/default.css
index 3b732f1af3eb4fc451e3aa60983da1ca114fdabe..4cb9b85a293b94dfef4a45933e297dd95b8d417c 100644 (file)
--- a/apps/theming/css/default.css
+++ b/apps/theming/css/default.css
@@ -63,7 +63,7 @@
   --color-primary-light: #e5f0f5;
   --color-primary-light-text: #002a41;
   --color-primary-light-hover: #dbe5ea;
-  --color-primary-text-dark: #ededed;
+  --color-primary-element-text-dark: #ededed;
   --color-primary-element: #006aa3;
   --color-primary-element-default-hover: #329bd3;
   --color-primary-element-text: #ffffff;

diff --git a/apps/theming/lib/Themes/CommonThemeTrait.php b/apps/theming/lib/Themes/CommonThemeTrait.php
index cd7210269231e257302d7bc6cdfd34b4abf58f0a..e7c556e10e007dd43b97e21fa8ac69e8db2cd415 100644 (file)
--- a/apps/theming/lib/Themes/CommonThemeTrait.php
+++ b/apps/theming/lib/Themes/CommonThemeTrait.php
@@ -39,8 +39,8 @@ trait CommonThemeTrait {
         */
        protected function generatePrimaryVariables(string $colorMainBackground, string $colorMainText): array {
                $isBrightColor = $this->util->isBrightColor($colorMainBackground);
-               $colorPrimaryLight = $this->util->mix($this->primaryColor, $colorMainBackground, -80);
                $colorPrimaryElement = $this->util->elementColor($this->primaryColor, $isBrightColor);
+               $colorPrimaryLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80);
                $colorPrimaryElementDefault = $this->util->elementColor($this->defaultPrimaryColor);
                $colorPrimaryElementLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80);
 
@@ -62,16 +62,16 @@ trait CommonThemeTrait {
                        '--color-primary-light' => $colorPrimaryLight,
                        '--color-primary-light-text' => $this->util->mix($this->primaryColor, $this->util->invertTextColor($colorPrimaryLight) ? '#000000' : '#ffffff', -20),
                        '--color-primary-light-hover' => $this->util->mix($colorPrimaryLight, $colorMainText, 90),
-                       '--color-primary-text-dark' => $this->util->darken($this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff', 7),
 
                        // used for buttons, inputs...
                        '--color-primary-element' => $colorPrimaryElement,
                        '--color-primary-element-hover' => $this->util->mix($colorPrimaryElement, $colorMainBackground, 60),
+                       '--color-primary-element-text' => $this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff',
+                       // used for hover/focus states
+                       '--color-primary-element-light' => $colorPrimaryElementLight,
                        '--color-primary-element-light-hover' => $this->util->mix($colorPrimaryElementLight, $colorMainText, 90),
                        '--color-primary-element-light-text' => $this->util->mix($colorPrimaryElement, $this->util->invertTextColor($colorPrimaryElementLight) ? '#000000' : '#ffffff', -20),
-                       '--color-primary-element-light' => $colorPrimaryElementLight,
                        '--color-primary-element-text-dark' => $this->util->darken($this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff', 7),
-                       '--color-primary-element-text' => $this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff',
 
                        // default global primary element hover. To be used with --color-primary-default
                        '--color-primary-element-default-hover' => $this->util->mix($colorPrimaryElementDefault, $colorMainBackground, 60),

diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index a6eed6b31bfcd4ec323d2525f3a64466536b2ac4..b4fd07a73d73c6af12e8b27352438b7e6f2cfe9b 100644 (file)
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -128,13 +128,13 @@ button:not(
                                box-shadow: 0 0 0 2px var(--color-main-text);
                        }
                        &:active {
-                               color: var(--color-primary-text-dark);
+                               color: var(--color-primary-element-text-dark);
                        }
                }
                &:disabled {
                        // opacity is already defined to .5 if disabled
                        background-color: var(--color-primary-element);
-                       color: var(--color-primary-text-dark);
+                       color: var(--color-primary-element-text-dark);
                        cursor: default;
                }
        }

diff --git a/core/css/styles.scss b/core/css/styles.scss
index df61eab8e9239d47944bbc26c668252991242744..6ebf9961f0e4649501b125ec5e7d8c71d062fe52 100644 (file)
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -154,7 +154,7 @@ body {
                color: var(--color-primary-text);
                border-bottom: 2px dotted var(--color-main-background);
                &:hover, &:focus {
-                       color: var(--color-primary-text-dark);
+                       color: var(--color-primary-element-text-dark);
                }
        }
 }

diff --git a/core/css/variables.scss b/core/css/variables.scss
index 678fa0e5842b5e610c61d7ab4b93205c78d015cb..164a69a685744ba1d0e229c4384cb937bc9a9eb8 100644 (file)
--- a/core/css/variables.scss
+++ b/core/css/variables.scss
@@ -52,7 +52,7 @@ $color-primary-light-hover: mix($color-primary-light, $color-main-text, 95%) !de
 $color-primary-text: #ffffff !default;
 // do not use nc-darken/lighten in case of overriding because
 // primary-text is independent of color-main-text
-$color-primary-text-dark: darken($color-primary-text, 7%) !default;
+$color-primary-element-text-dark: darken($color-primary-text, 7%) !default;
 $color-primary-element: $color-primary !default;
 $color-primary-element-hover: mix($color-primary-element, $color-main-background, 80%) !default;
 $color-primary-element-light: lighten($color-primary-element, 15%) !default;