Skip to content

Theming: Fix missing color usage #771

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
rullzer merged 5 commits into from
Aug 26, 2016
Merged

Theming: Fix missing color usage #771

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
a7c5f1b
Theming: fix federated sharing button color
juliusknorr Aug 8, 2016
fdab008
Remove internal from getThemingDefaults
juliusknorr Aug 8, 2016
2b0ed6c
Theming: colorize primary buttons
juliusknorr Aug 8, 2016
218e2f7
Theming: Adjust jquery ui elements
juliusknorr Aug 10, 2016
a7273f1
Make federadedfilesharing button match the theming values
juliusknorr Aug 25, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 20 additions & 2 deletions apps/federatedfilesharing/settings-personal.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
*/

use OCA\FederatedFileSharing\AppInfo\Application;
use OCA\Theming\Template;

\OC_Util::checkLoggedIn();

Expand All @@ -40,15 +41,32 @@

$cloudID = \OC::$server->getUserSession()->getUser()->getCloudId();
$url = 'https://nextcloud.com/federation#' . $cloudID;
$ownCloudLogoPath = \OC::$server->getURLGenerator()->imagePath('core', 'logo-icon.svg');
$logoPath = \OC::$server->getURLGenerator()->imagePath('core', 'logo-icon.svg');
$theme = \OC::$server->getThemingDefaults();
$color = $theme->getMailHeaderColor();
$textColor = "#ffffff";
if(\OC::$server->getAppManager()->isEnabledForUser("theming")) {
$logoPath = $theme->getLogo();
try {
$util = \OC::$server->query("\OCA\Theming\Util");
if($util->invertTextColor($color)) {
$textColor = "#000000";
}
} catch (OCP\AppFramework\QueryException $e) {

}
}


$tmpl = new OCP\Template('federatedfilesharing', 'settings-personal');
$tmpl->assign('outgoingServer2serverShareEnabled', $federatedShareProvider->isOutgoingServer2serverShareEnabled());
$tmpl->assign('message_with_URL', $l->t('Share with me through my #Nextcloud Federated Cloud ID, see %s', [$url]));
$tmpl->assign('message_without_URL', $l->t('Share with me through my #Nextcloud Federated Cloud ID', [$cloudID]));
$tmpl->assign('owncloud_logo_path', $ownCloudLogoPath);
$tmpl->assign('logoPath', $logoPath);
$tmpl->assign('reference', $url);
$tmpl->assign('cloudId', $cloudID);
$tmpl->assign('showShareIT', !$isIE8);
$tmpl->assign('color', $color);
$tmpl->assign('textColor', $textColor);

return $tmpl->fetchPage();
15 changes: 5 additions & 10 deletions apps/federatedfilesharing/templates/settings-personal.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,22 +55,17 @@ class='js-gs-share social-gnu'>
<div class="hidden" id="oca-files-sharing-add-to-your-website-expanded">
<p style="margin: 10px 0">
<a target="_blank" rel="noreferrer" href="<?php p($_['reference']); ?>"
style="padding:10px;background-color:#0082c9;color:#fff;border-radius:3px;padding-left:4px;">
<img src="<?php p($_['owncloud_logo_path']); ?>"
style="width:50px;position:relative;top:8px;">
style="padding:10px;background-color:<?php p($_['color']); ?>;color:<?php p($_['textColor']); ?>;border-radius:3px;padding-left:4px;">
<span style="background-image:url(<?php p(\OC::$server->getURLGenerator()->getAbsoluteURL($_['logoPath'])); ?>);width:50px;height:30px;position:relative;top:8px;background-size:contain;display:inline-block;background-repeat:no-repeat; background-position: center center;"></span>
<?php p($l->t('Share with me via Nextcloud')); ?>
</a>
</p>

<p>
<?php p($l->t('HTML Code:')); ?>
<xmp><a target="_blank" rel="noreferrer" href="<?php p($_['reference']); ?>"
style="padding:10px;background-color:#0082c9;color:#fff;border-radius:3px;padding-left:4px;">
<img src="<?php p(\OC::$server->getURLGenerator()->getAbsoluteURL($_['owncloud_logo_path'])); ?>"
style="width:50px;position:relative;top:8px;">
<?php p($l->t('Share with me via Nextcloud')); ?>

</a></xmp>
<xmp><a target="_blank" rel="noreferrer" href="<?php p($_['reference']); ?>" style="padding:10px;background-color:<?php p($_['color']); ?>;color:<?php p($_['textColor']); ?>;border-radius:3px;padding-left:4px;">
<span style="background-image:url(<?php p(\OC::$server->getURLGenerator()->getAbsoluteURL($_['logoPath'])); ?>);width:50px;height:30px;position:relative;top:8px;background-size:contain;display:inline-block;background-repeat:no-repeat; background-position: center center;"></span>
<?php p($l->t('Share with me via Nextcloud')); ?></a></xmp>
</p>
</div>
<?php } ?>
Expand Down
24 changes: 24 additions & 0 deletions apps/theming/lib/Controller/ThemingController.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -286,6 +286,29 @@ public function getStylesheet() {
$responseCss .= 'input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' .
'background-image: url(\'data:image/svg+xml;base64,'.$this->util->generateRadioButton($elementColor).'\');' .
"}\n";
$responseCss .= '.primary, input[type="submit"].primary, input[type="button"].primary, button.primary, .button.primary,' .
'.primary:active, input[type="submit"].primary:active, input[type="button"].primary:active, button.primary:active, .button.primary:active,' .
'.primary:disabled, input[type="submit"].primary:disabled, input[type="button"].primary:disabled, button.primary:disabled, .button.primary:disabled,' .
'.primary:disabled:hover, input[type="submit"].primary:disabled:hover, input[type="button"].primary:disabled:hover, button.primary:disabled:hover, .button.primary:disabled:hover,' .
'.primary:disabled:focus, input[type="submit"].primary:disabled:focus, input[type="button"].primary:disabled:focus, button.primary:disabled:focus, .button.primary:disabled:focus {' .
'border: 1px solid '.$elementColor.';'.
'background-color: '.$elementColor.';'.
'opacity: 0.8' .
"}\n" .
'.primary:hover, input[type="submit"].primary:hover, input[type="button"].primary:hover, button.primary:hover, .button.primary:hover,' .
'.primary:focus, input[type="submit"].primary:focus, input[type="button"].primary:focus, button.primary:focus, .button.primary:focus {' .
'border: 1px solid '.$elementColor.';'.
'background-color: '.$elementColor.';'.
'opacity: 1.0;' .
"}\n";
$responseCss .= '.ui-widget-header { border: 1px solid ' . $color . '; background: '. $color . '; color: #ffffff;' . "}\n";
$responseCss .= '.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {' .
'border: 1px solid ' . $color . ';' .
'color: ' . $elementColor . ';' .
"}\n";
$responseCss .= '.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {' .
'color: ' . $elementColor . ';' .
"}\n";
$responseCss .= '
#firstrunwizard .firstrunwizard-header {
background-color: ' . $color . ';
Expand Down Expand Up @@ -328,6 +351,7 @@ public function getStylesheet() {
$responseCss .= '.searchbox input[type="search"] { background: transparent url(\'' . \OC::$WEBROOT . '/core/img/actions/search.svg\') no-repeat 6px center; color: #000; }' . "\n";
$responseCss .= '.searchbox input[type="search"]:focus,.searchbox input[type="search"]:active,.searchbox input[type="search"]:valid { color: #000; border: 1px solid rgba(0, 0, 0, .5); }' . "\n";
$responseCss .= '.nc-theming-contrast {color: #000000}' . "\n";
$responseCss .= '.ui-widget-header { color: #000000; }' . "\n";
} else {
$responseCss .= '.nc-theming-contrast {color: #ffffff}' . "\n";
}
Expand Down
101 changes: 97 additions & 4 deletions apps/theming/tests/Controller/ThemingControllerTest.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -383,7 +383,29 @@ public function testGetStylesheetWithOnlyColor() {
$expectedData .= 'input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' .
'background-image: url(\'data:image/svg+xml;base64,'.$this->util->generateRadioButton($color).'\');' .
"}\n";

$expectedData .= '.primary, input[type="submit"].primary, input[type="button"].primary, button.primary, .button.primary,' .
'.primary:active, input[type="submit"].primary:active, input[type="button"].primary:active, button.primary:active, .button.primary:active,' .
'.primary:disabled, input[type="submit"].primary:disabled, input[type="button"].primary:disabled, button.primary:disabled, .button.primary:disabled,' .
'.primary:disabled:hover, input[type="submit"].primary:disabled:hover, input[type="button"].primary:disabled:hover, button.primary:disabled:hover, .button.primary:disabled:hover,' .
'.primary:disabled:focus, input[type="submit"].primary:disabled:focus, input[type="button"].primary:disabled:focus, button.primary:disabled:focus, .button.primary:disabled:focus {' .
'border: 1px solid '.$color .';'.
'background-color: '.$color.';'.
'opacity: 0.8' .
"}\n" .
'.primary:hover, input[type="submit"].primary:hover, input[type="button"].primary:hover, button.primary:hover, .button.primary:hover,' .
'.primary:focus, input[type="submit"].primary:focus, input[type="button"].primary:focus, button.primary:focus, .button.primary:focus {' .
'border: 1px solid '.$color.';'.
'background-color: '.$color.';'.
'opacity: 1.0;' .
"}\n";
$expectedData .= '.ui-widget-header { border: 1px solid ' . $color . '; background: '. $color . '; color: #ffffff;' . "}\n";
$expectedData .= '.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {' .
'border: 1px solid ' . $color . ';' .
'color: ' . $color . ';' .
"}\n";
$expectedData .= '.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {' .
'color: ' . $color . ';' .
"}\n";
$expectedData .= '
#firstrunwizard .firstrunwizard-header {
background-color: ' . $color . ';
Expand All @@ -406,6 +428,7 @@ public function testGetStylesheetWithOnlyColor() {
public function testGetStylesheetWithOnlyColorInvert() {

$color = '#fff';
$elementColor = '#555555';

$this->config
->expects($this->at(0))
Expand Down Expand Up @@ -442,7 +465,29 @@ public function testGetStylesheetWithOnlyColorInvert() {
$expectedData .= 'input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' .
'background-image: url(\'data:image/svg+xml;base64,'.$this->util->generateRadioButton('#555555').'\');' .
"}\n";

$expectedData .= '.primary, input[type="submit"].primary, input[type="button"].primary, button.primary, .button.primary,' .
'.primary:active, input[type="submit"].primary:active, input[type="button"].primary:active, button.primary:active, .button.primary:active,' .
'.primary:disabled, input[type="submit"].primary:disabled, input[type="button"].primary:disabled, button.primary:disabled, .button.primary:disabled,' .
'.primary:disabled:hover, input[type="submit"].primary:disabled:hover, input[type="button"].primary:disabled:hover, button.primary:disabled:hover, .button.primary:disabled:hover,' .
'.primary:disabled:focus, input[type="submit"].primary:disabled:focus, input[type="button"].primary:disabled:focus, button.primary:disabled:focus, .button.primary:disabled:focus {' .
'border: 1px solid #555555;'.
'background-color: #555555;'.
'opacity: 0.8' .
"}\n" .
'.primary:hover, input[type="submit"].primary:hover, input[type="button"].primary:hover, button.primary:hover, .button.primary:hover,' .
'.primary:focus, input[type="submit"].primary:focus, input[type="button"].primary:focus, button.primary:focus, .button.primary:focus {' .
'border: 1px solid #555555;'.
'background-color: #555555;'.
'opacity: 1.0;' .
"}\n";
$expectedData .= '.ui-widget-header { border: 1px solid ' . $color . '; background: '. $color . '; color: #ffffff;' . "}\n";
$expectedData .= '.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {' .
'border: 1px solid ' . $color . ';' .
'color: ' . $elementColor . ';' .
"}\n";
$expectedData .= '.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {' .
'color: ' . $elementColor . ';' .
"}\n";
$expectedData .= '
#firstrunwizard .firstrunwizard-header {
background-color: ' . $color . ';
Expand All @@ -458,6 +503,7 @@ public function testGetStylesheetWithOnlyColorInvert() {
$expectedData .= '.searchbox input[type="search"] { background: transparent url(\'' . \OC::$WEBROOT . '/core/img/actions/search.svg\') no-repeat 6px center; color: #000; }' . "\n";
$expectedData .= '.searchbox input[type="search"]:focus,.searchbox input[type="search"]:active,.searchbox input[type="search"]:valid { color: #000; border: 1px solid rgba(0, 0, 0, .5); }' . "\n";
$expectedData .= '.nc-theming-contrast {color: #000000}' . "\n";
$expectedData .= '.ui-widget-header { color: #000000; }' . "\n";


$expected = new Http\DataDownloadResponse($expectedData, 'style', 'text/css');
Expand Down Expand Up @@ -585,6 +631,29 @@ public function testGetStylesheetWithAllCombined() {
$expectedData .= 'input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' .
'background-image: url(\'data:image/svg+xml;base64,'.$this->util->generateRadioButton($color).'\');' .
"}\n";
$expectedData .= '.primary, input[type="submit"].primary, input[type="button"].primary, button.primary, .button.primary,' .
'.primary:active, input[type="submit"].primary:active, input[type="button"].primary:active, button.primary:active, .button.primary:active,' .
'.primary:disabled, input[type="submit"].primary:disabled, input[type="button"].primary:disabled, button.primary:disabled, .button.primary:disabled,' .
'.primary:disabled:hover, input[type="submit"].primary:disabled:hover, input[type="button"].primary:disabled:hover, button.primary:disabled:hover, .button.primary:disabled:hover,' .
'.primary:disabled:focus, input[type="submit"].primary:disabled:focus, input[type="button"].primary:disabled:focus, button.primary:disabled:focus, .button.primary:disabled:focus {' .
'border: 1px solid '.$color .';'.
'background-color: '.$color.';'.
'opacity: 0.8' .
"}\n" .
'.primary:hover, input[type="submit"].primary:hover, input[type="button"].primary:hover, button.primary:hover, .button.primary:hover,' .
'.primary:focus, input[type="submit"].primary:focus, input[type="button"].primary:focus, button.primary:focus, .button.primary:focus {' .
'border: 1px solid '.$color.';'.
'background-color: '.$color.';'.
'opacity: 1.0;' .
"}\n";
$expectedData .= '.ui-widget-header { border: 1px solid ' . $color . '; background: '. $color . '; color: #ffffff;' . "}\n";
$expectedData .= '.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {' .
'border: 1px solid ' . $color . ';' .
'color: ' . $color . ';' .
"}\n";
$expectedData .= '.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {' .
'color: ' . $color . ';' .
"}\n";
$expectedData .= '
#firstrunwizard .firstrunwizard-header {
background-color: ' . $color . ';
Expand Down Expand Up @@ -624,6 +693,7 @@ public function testGetStylesheetWithAllCombined() {
public function testGetStylesheetWithAllCombinedInverted() {

$color = '#fff';
$elementColor = '#555555';

$this->config
->expects($this->at(0))
Expand All @@ -646,7 +716,6 @@ public function testGetStylesheetWithAllCombinedInverted() {
->with('theming', 'backgroundMime', '')
->willReturn('image/png');


$expectedData = 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}' . "\n",
$color);
Expand All @@ -661,6 +730,29 @@ public function testGetStylesheetWithAllCombinedInverted() {
$expectedData .= 'input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' .
'background-image: url(\'data:image/svg+xml;base64,'.$this->util->generateRadioButton('#555555').'\');' .
"}\n";
$expectedData .= '.primary, input[type="submit"].primary, input[type="button"].primary, button.primary, .button.primary,' .
'.primary:active, input[type="submit"].primary:active, input[type="button"].primary:active, button.primary:active, .button.primary:active,' .
'.primary:disabled, input[type="submit"].primary:disabled, input[type="button"].primary:disabled, button.primary:disabled, .button.primary:disabled,' .
'.primary:disabled:hover, input[type="submit"].primary:disabled:hover, input[type="button"].primary:disabled:hover, button.primary:disabled:hover, .button.primary:disabled:hover,' .
'.primary:disabled:focus, input[type="submit"].primary:disabled:focus, input[type="button"].primary:disabled:focus, button.primary:disabled:focus, .button.primary:disabled:focus {' .
'border: 1px solid #555555;'.
'background-color: #555555;'.
'opacity: 0.8' .
"}\n" .
'.primary:hover, input[type="submit"].primary:hover, input[type="button"].primary:hover, button.primary:hover, .button.primary:hover,' .
'.primary:focus, input[type="submit"].primary:focus, input[type="button"].primary:focus, button.primary:focus, .button.primary:focus {' .
'border: 1px solid #555555;'.
'background-color: #555555;'.
'opacity: 1.0;' .
"}\n";
$expectedData .= '.ui-widget-header { border: 1px solid ' . $color . '; background: '. $color . '; color: #ffffff;' . "}\n";
$expectedData .= '.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {' .
'border: 1px solid ' . $color . ';' .
'color: ' . $elementColor . ';' .
"}\n";
$expectedData .= '.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {' .
'color: ' . $elementColor . ';' .
"}\n";
$expectedData .= '
#firstrunwizard .firstrunwizard-header {
background-color: ' . $color . ';
Expand Down Expand Up @@ -694,8 +786,9 @@ public function testGetStylesheetWithAllCombinedInverted() {
$expectedData .= '.searchbox input[type="search"] { background: transparent url(\'' . \OC::$WEBROOT . '/core/img/actions/search.svg\') no-repeat 6px center; color: #000; }' . "\n";
$expectedData .= '.searchbox input[type="search"]:focus,.searchbox input[type="search"]:active,.searchbox input[type="search"]:valid { color: #000; border: 1px solid rgba(0, 0, 0, .5); }' . "\n";
$expectedData .= '.nc-theming-contrast {color: #000000}' . "\n";
$expected = new Http\DataDownloadResponse($expectedData, 'style', 'text/css');
$expectedData .= '.ui-widget-header { color: #000000; }' . "\n";

$expected = new Http\DataDownloadResponse($expectedData, 'style', 'text/css');
$expected->cacheFor(3600);
$expected->addHeader('Expires', date(\DateTime::RFC2822, 123));
@$this->assertEquals($expected, $this->themingController->getStylesheet());
Expand Down
1 change: 0 additions & 1 deletion lib/private/Server.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1356,7 +1356,6 @@ public function getCommentsManager() {
}

/**
* @internal Not public by intention.
* @return \OC_Defaults
*/
public function getThemingDefaults() {
Expand Down