Merge pull request #35454 from nextcloud/revert-35346-backport/35315/stable25

[stable25] Revert "[stable25] Fix border color contrast"

Author: Pytal

apps/theming/css/default.css

@@ -30,8 +30,8 @@
   --color-loading-dark: #444444;
   --color-box-shadow-rgb: 77,77,77;
   --color-box-shadow: rgba(var(--color-box-shadow-rgb), 0.5);
-  --color-border: #949494;
-  --color-border-dark: #808080;
+  --color-border: #ededed;
+  --color-border-dark: #dbdbdb;
   --font-face: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Cantarell, Ubuntu, 'Helvetica Neue', Arial, sans-serif, 'Noto Color Emoji', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
   --default-font-size: 15px;
   --animation-quick: 100ms;
@@ -58,21 +58,21 @@
   --image-background-default: url('/core/img/app-background.jpg');
   --color-background-plain: #0082c9;
   --primary-invert-if-bright: no;
-  --color-primary: #006aa3;
+  --color-primary: #00639a;
   --color-primary-default: #0082c9;
   --color-primary-text: #ffffff;
-  --color-primary-hover: #3287b5;
-  --color-primary-light: #e5f0f5;
-  --color-primary-light-text: #002a41;
-  --color-primary-light-hover: #dbe5ea;
+  --color-primary-hover: #3282ae;
+  --color-primary-light: #e5eff4;
+  --color-primary-light-text: #00273d;
+  --color-primary-light-hover: #dbe4e9;
   --color-primary-text-dark: #ededed;
-  --color-primary-element: #006aa3;
+  --color-primary-element: #00639a;
   --color-primary-element-default-hover: #329bd3;
   --color-primary-element-text: #ffffff;
-  --color-primary-element-hover: #3287b5;
-  --color-primary-element-light: #e5f0f5;
-  --color-primary-element-light-text: #002a41;
-  --color-primary-element-light-hover: #dbe5ea;
+  --color-primary-element-hover: #3282ae;
+  --color-primary-element-light: #e5eff4;
+  --color-primary-element-light-text: #00273d;
+  --color-primary-element-light-hover: #dbe4e9;
   --color-primary-element-text-dark: #ededed;
   --gradient-primary-background: linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
 }

apps/theming/lib/Service/BackgroundService.php

@@ -46,7 +46,7 @@ class BackgroundService {
 	// true when the background is bright and need dark icons
 	public const THEMING_MODE_DARK = 'dark';
 	public const DEFAULT_COLOR = '#0082c9';
-	public const DEFAULT_ACCESSIBLE_COLOR = '#006aa3';
+	public const DEFAULT_ACCESSIBLE_COLOR = '#00639a';
 
 	public const SHIPPED_BACKGROUNDS = [
 		'anatoly-mikhaltsov-butterfly-wing-scale.jpg' => [

apps/theming/lib/Themes/DarkTheme.php

@@ -89,8 +89,8 @@ public function getCSSVariables(): array {
 				'--color-box-shadow' => $colorBoxShadow,
 				'--color-box-shadow-rgb' => $colorBoxShadowRGB,
 
-				'--color-border' => $this->util->lighten($colorMainBackground, 30),
-				'--color-border-dark' => $this->util->lighten($colorMainBackground, 38),
+				'--color-border' => $this->util->lighten($colorMainBackground, 7),
+				'--color-border-dark' => $this->util->lighten($colorMainBackground, 14),
 
 				'--background-invert-if-dark' => 'invert(100%)',
 				'--background-invert-if-bright' => 'no',

apps/theming/lib/Themes/DefaultTheme.php

@@ -155,8 +155,8 @@ public function getCSSVariables(): array {
 			'--color-box-shadow-rgb' => $colorBoxShadowRGB,
 			'--color-box-shadow' => "rgba(var(--color-box-shadow-rgb), 0.5)",
 
-			'--color-border' => $this->util->darken($colorMainBackground, 42),
-			'--color-border-dark' => $this->util->darken($colorMainBackground, 50),
+			'--color-border' => $this->util->darken($colorMainBackground, 7),
+			'--color-border-dark' => $this->util->darken($colorMainBackground, 14),
 
 			'--font-face' => "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Cantarell, Ubuntu, 'Helvetica Neue', Arial, sans-serif, 'Noto Color Emoji', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
 			'--default-font-size' => '15px',

tests/acceptance/features/app-theming.feature

@@ -9,11 +9,11 @@ Feature: app-theming
     # The "eventually" part is not really needed here, as the colour is not
     # being animated at this point, but there is no need to create a specific
     # step just for this.
-    And I see that the primary color is eventually "#006aa3"
+    And I see that the primary color is eventually "#00639a"
     And I see that the non-plain background color variable is eventually "#0082c9"
     When I set the "Color" parameter in the Theming app to "#C9C9C9"
     Then I see that the parameters in the Theming app are eventually saved
-    And I see that the primary color is eventually "#006aa3"
+    And I see that the primary color is eventually "#00639a"
     And I see that the non-plain background color variable is eventually "#C9C9C9"
 
   Scenario: resetting the color updates the primary color
@@ -23,9 +23,9 @@ Feature: app-theming
     And I see that the color selector in the Theming app has loaded
     And I set the "Color" parameter in the Theming app to "#C9C9C9"
     And I see that the parameters in the Theming app are eventually saved
-    And I see that the primary color is eventually "#006aa3"
+    And I see that the primary color is eventually "#00639a"
     And I see that the non-plain background color variable is eventually "#C9C9C9"
     When I reset the "Color" parameter in the Theming app to its default value
     Then I see that the parameters in the Theming app are eventually saved
-    And I see that the primary color is eventually "#006aa3"
+    And I see that the primary color is eventually "#00639a"
     And I see that the non-plain background color variable is eventually "#0082c9"