Theming: Colorize checkboxes depending on luminance

This commit is contained in:
Julius Haertl 2016-07-19 14:00:33 +02:00
parent 5c12c8cb02
commit 49ef99474f
No known key found for this signature in database
GPG Key ID: 4C614C6ED2CDE6DF
3 changed files with 34 additions and 0 deletions

View File

@ -214,11 +214,20 @@ class ThemingController extends Controller {
$cacheBusterValue = $this->config->getAppValue('theming', 'cachebuster', '0');
$responseCss = '';
$color = $this->config->getAppValue($this->appName, 'color');
$elementColor = Util::elementColor($color);
if($color !== '') {
$responseCss .= sprintf(
'#body-user #header,#body-settings #header,#body-public #header,#body-login,.searchbox input[type="search"]:focus,.searchbox input[type="search"]:active,.searchbox input[type="search"]:valid {background-color: %s}',
$color
);
$responseCss .= sprintf('
input[type="checkbox"].checkbox:checked + label:before {
background-image:url(\'' . \OC::$WEBROOT . '/core/img/actions/checkmark-white.svg\');
background-color: %s; background-position: center center; background-size:contain;
width:12px; height:12px; padding:0; margin:1px 6px 7px 2px;
}',
$elementColor
);
}
$logo = $this->config->getAppValue($this->appName, 'logoMime');
if($logo !== '') {

View File

@ -38,6 +38,21 @@ class Util {
}
}
/**
* get color for on-page elements:
* theme color by default, grey if theme color is to bright
* @param $color
* @return string
*/
public static function elementColor($color) {
$l = self::calculateLuminance($color);
if($l>0.8) {
return '#969696';
} else {
return $color;
}
}
/**
* @param string $color rgb color value
* @return float

View File

@ -65,4 +65,14 @@ class UtilTest extends TestCase {
$invert = Util::invertTextColor('');
$this->assertEquals(false, $invert);
}
public function testElementColorDefault() {
$elementColor = Util::elementColor("#000000");
$this->assertEquals('#000000', $elementColor);
}
public function testElementColorOnBrightBackground() {
$elementColor = Util::elementColor('#ffffff');
$this->assertEquals('#969696', $elementColor);
}
}