Merge pull request #6082 from nextcloud/theming-fix-white-element-color

Use separate element color in theming

8 files changed, 45 insertions, 44 deletions

diff --git a/apps/theming/css/theming.scss b/apps/theming/css/theming.scss
index 22e3bdc0d95..480872354b5 100644
--- a/apps/theming/css/theming.scss
+++ b/apps/theming/css/theming.scss
@@ -10,7 +10,6 @@
 	color: $color-primary-text;
 }
 
-/* invert header icons on bright background */
 @if (lightness($color-primary) > 55) {
 	.searchbox input[type="search"] {
 		background: transparent url('../../../core/img/actions/search.svg') no-repeat 6px center;
@@ -29,6 +28,31 @@
 	#appmenu .icon-more-white {
 		background-image: url('../../../core/img/actions/more.svg');
 	}
+
+	#body-login {
+
+		input {
+			border: 1px solid nc-lighten($color-primary-text, 50%);
+		}
+		input.primary {
+			background-color: $color-primary;
+		}
+		a, label, p {
+			color: $color-primary-text !important;
+		}
+		input[type='checkbox'].checkbox--white + label:before {
+			border-color: nc-darken($color-primary-element, 40%) !important;
+		}
+		input[type='checkbox'].checkbox--white:not(:disabled):not(:checked) + label:hover:before,
+		input[type='checkbox'].checkbox--white:focus + label:before {
+			border-color: nc-darken($color-primary-element, 30%) !important;
+		}
+		input[type='checkbox'].checkbox--white:checked + label:before {
+			border-color: nc-darken($color-primary-element, 30%) !important;
+			background-image: url('../../../core/img/actions/checkbox-mark.svg');
+			background-color: nc-darken($color-primary-element, 30%) !important;
+		}
+	}
 }
 
 /* Colorized svg images */
@@ -60,7 +84,8 @@
 }
 
 input.primary {
-	background-color: $color-primary;
+	background-color: $color-primary-element;
+	border: 1px solid $color-primary-text;
 	color: $color-primary-text;
 }
 
@@ -82,37 +107,6 @@ input.primary {
 			color: $color-primary-text !important;
 		}
 
-		@if (lightness($color-primary) > 50) {
-			#submit {
-				border-color: nc-darken($color-primary, 20%);
-				background-color: nc-darken($color-primary, 20%);
-			}
-			#submit:hover {
-				border-color: nc-darken($color-primary, 10%);
-				background-color: nc-darken($color-primary, 10%);
-			}
-			input[type='checkbox'].checkbox--white + label:before {
-				border-color: nc-darken($color-primary, 40%) !important;
-			}
-			input[type='checkbox'].checkbox--white:not(:disabled):not(:checked) + label:hover:before,
-			input[type='checkbox'].checkbox--white:focus + label:before {
-				border-color: nc-darken($color-primary, 30%) !important;
-			}
-			input[type='checkbox'].checkbox--white:checked + label:before {
-				border-color: nc-darken($color-primary, 30%) !important;
-				background-image: url('../../../core/img/actions/checkbox-mark.svg');
-				background-color: nc-darken($color-primary, 30%) !important;
-			}
-		} @else {
-			#submit {
-				border-color: nc-lighten($color-primary, 20%);
-				background-color: nc-lighten($color-primary, 20%);
-			}
-			#submit:hover {
-				border-color: nc-lighten($color-primary, 10%);
-				background-color: nc-lighten($color-primary, 10%);
-			}
-		}
 	}
 }
 
diff --git a/apps/theming/lib/ThemingDefaults.php b/apps/theming/lib/ThemingDefaults.php
index b10dc4b7ea8..8200957edc0 100644
--- a/apps/theming/lib/ThemingDefaults.php
+++ b/apps/theming/lib/ThemingDefaults.php
@@ -238,6 +238,7 @@ class ThemingDefaults extends \OC_Defaults {
 			}
 			$variables['color-primary'] = $this->getColorPrimary();
 			$variables['color-primary-text'] = $colorPrimaryText;
+			$variables['color-primary-element'] = $this->util->elementColor($this->getColorPrimary());
 		}
 
 		if ($this->config->getAppValue('theming', 'backgroundMime', null) === 'backgroundColor') {
diff --git a/apps/theming/tests/ThemingDefaultsTest.php b/apps/theming/tests/ThemingDefaultsTest.php
index cb827773470..c6d1fec91dd 100644
--- a/apps/theming/tests/ThemingDefaultsTest.php
+++ b/apps/theming/tests/ThemingDefaultsTest.php
@@ -507,8 +507,10 @@ class ThemingDefaultsTest extends TestCase {
 		$this->config->expects($this->at(7))->method('getAppValue')->with('theming', 'color', null)->willReturn($this->defaults->getColorPrimary());
 		$this->config->expects($this->at(8))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
 		$this->config->expects($this->at(9))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
+		$this->config->expects($this->at(10))->method('getAppValue')->with('theming', 'color', $this->defaults->getColorPrimary())->willReturn($this->defaults->getColorPrimary());
 
 		$this->util->expects($this->any())->method('invertTextColor')->with($this->defaults->getColorPrimary())->willReturn(false);
+		$this->util->expects($this->any())->method('elementColor')->with($this->defaults->getColorPrimary())->willReturn('#aaaaaa');
 		$this->cache->expects($this->once())->method('get')->with('getScssVariables')->willReturn(null);
 		$folder = $this->createMock(ISimpleFolder::class);
 		$file = $this->createMock(ISimpleFile::class);
@@ -538,7 +540,8 @@ class ThemingDefaultsTest extends TestCase {
 			'image-login-background' => "'absolute-custom-background?v=0'",
 			'color-primary' => $this->defaults->getColorPrimary(),
 			'color-primary-text' => '#ffffff',
-			'image-login-plain' => 'false'
+			'image-login-plain' => 'false',
+			'color-primary-element' => '#aaaaaa'
 
 		];
 		$this->assertEquals($expected, $this->template->getScssVariables());
diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index 10e3fcef015..5a7da4f50c9 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -50,7 +50,7 @@ textarea,
 		&:focus,
 		&.active {
 		/* active class used for multiselect */
-			border-color: $color-primary;
+			border-color: $color-primary-element;
 			outline: none;
 		}
 		&:active {
@@ -66,21 +66,21 @@ textarea,
 	}
 	/* Primary action button, use sparingly */
 	&.primary {
-		border: 1px solid #fff;
-		background-color: $color-primary;
+		background-color: $color-primary-element;
+		border: 1px solid $color-primary-text;
 		color: $color-primary-text;
 		cursor: pointer;
 		&:not(:disabled) {
 			&:hover,
 			&:focus {
-				background-color: rgba($color-primary, .85);
+				background-color: rgba($color-primary-element, .85);
 			}
 			&:active {
-				background-color: rgba($color-primary, .7);
+				background-color: rgba($color-primary-element, .7);
 			}
 		}
 		&:disabled {
-			background-color: rgba($color-primary, .7);
+			background-color: rgba($color-primary-element, .7);
 			color: nc-lighten($color-main-text, 73%);
 		}
 	}
@@ -225,15 +225,15 @@ input {
 			}
 			&:not(:disabled):not(:checked) + label:hover:before,
 			&:focus + label:before {
-				border-color: $color-primary;
+				border-color: $color-primary-element;
 			}
 			&:checked + label:before,
 			&.checkbox:indeterminate + label:before {
 			/* ^ :indeterminate have a strange behavior on radio,
 			so we respecified the checkbox class again to be safe */
 				box-shadow: inset 0px 0px 0px 2px $color-main-background;
-				background-color: $color-primary;
-				border-color: $color-primary
+				background-color: $color-primary-element;
+				border-color: $color-primary-element;
 			}
 			&:disabled + label:before {
 				border: 1px solid nc-lighten($color-main-text, 53%);
diff --git a/core/css/jquery-ui-fixes.scss b/core/css/jquery-ui-fixes.scss
index cf27c1561f0..87167100813 100644
--- a/core/css/jquery-ui-fixes.scss
+++ b/core/css/jquery-ui-fixes.scss
@@ -190,6 +190,6 @@
 	.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
 		border: 1px solid transparent;
 		background: inherit;
-		color: $color-primary;
+		color: $color-primary-element;
 	}
 }
diff --git a/core/css/variables.scss b/core/css/variables.scss
index 5b7783a888a..3a135f91c86 100644
--- a/core/css/variables.scss
+++ b/core/css/variables.scss
@@ -5,6 +5,7 @@ $color-primary-text: #ffffff;
 $color-error: #e9322d;
 $color-warning: #ffcc44;
 $color-success: #46ba61;
+$color-primary-element: $color-primary;
 
 @function nc-darken($color, $value) {
   @return darken($color, $value);
diff --git a/lib/composer/composer/autoload_classmap.php b/lib/composer/composer/autoload_classmap.php
index e5fd3a88b0c..425eeb6ce7b 100644
--- a/lib/composer/composer/autoload_classmap.php
+++ b/lib/composer/composer/autoload_classmap.php
@@ -385,6 +385,7 @@ return array(
     'OC\\Command\\CallableJob' => $baseDir . '/lib/private/Command/CallableJob.php',
     'OC\\Command\\ClosureJob' => $baseDir . '/lib/private/Command/ClosureJob.php',
     'OC\\Command\\CommandJob' => $baseDir . '/lib/private/Command/CommandJob.php',
+    'OC\\Command\\CronBus' => $baseDir . '/lib/private/Command/CronBus.php',
     'OC\\Command\\FileAccess' => $baseDir . '/lib/private/Command/FileAccess.php',
     'OC\\Command\\QueueBus' => $baseDir . '/lib/private/Command/QueueBus.php',
     'OC\\Comments\\Comment' => $baseDir . '/lib/private/Comments/Comment.php',
diff --git a/lib/composer/composer/autoload_static.php b/lib/composer/composer/autoload_static.php
index 652d6de99be..68262fafb0d 100644
--- a/lib/composer/composer/autoload_static.php
+++ b/lib/composer/composer/autoload_static.php
@@ -415,6 +415,7 @@ class ComposerStaticInit53792487c5a8370acc0b06b1a864ff4c
         'OC\\Command\\CallableJob' => __DIR__ . '/../../..' . '/lib/private/Command/CallableJob.php',
         'OC\\Command\\ClosureJob' => __DIR__ . '/../../..' . '/lib/private/Command/ClosureJob.php',
         'OC\\Command\\CommandJob' => __DIR__ . '/../../..' . '/lib/private/Command/CommandJob.php',
+        'OC\\Command\\CronBus' => __DIR__ . '/../../..' . '/lib/private/Command/CronBus.php',
         'OC\\Command\\FileAccess' => __DIR__ . '/../../..' . '/lib/private/Command/FileAccess.php',
         'OC\\Command\\QueueBus' => __DIR__ . '/../../..' . '/lib/private/Command/QueueBus.php',
         'OC\\Comments\\Comment' => __DIR__ . '/../../..' . '/lib/private/Comments/Comment.php',