Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
6 changes: 3 additions & 3 deletions apps/theming/css/default.css
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
:root {
--color-main-background: #ffffff;
--color-main-background-not-plain: #0082c9;
--color-main-background-rgb: 255,255,255;
--color-main-background-translucent: rgba(var(--color-main-background-rgb), .97);
--color-main-background-blur: rgba(var(--color-main-background-rgb), .8);
Expand Down Expand Up @@ -52,10 +51,11 @@
--header-menu-item-height: 44px;
--header-menu-profile-item-height: 66px;
--breakpoint-mobile: 1024px;
--primary-invert-if-bright: no;
--background-invert-if-dark: no;
--background-invert-if-bright: invert(100%);
--image-main-background: url('/core/img/app-background.jpg');
--image-background: url('/core/img/app-background.jpg');
--color-background-plain: #0082c9;
--primary-invert-if-bright: no;
--color-primary: #00639a;
--color-primary-default: #0082c9;
--color-primary-text: #ffffff;
Expand Down
16 changes: 16 additions & 0 deletions apps/theming/css/settings-admin.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion apps/theming/css/settings-admin.css.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

20 changes: 20 additions & 0 deletions apps/theming/css/settings-admin.scss
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,8 @@
}
form.uploadButton {
width: 411px;
display: flex;
align-items: center;
}
form .theme-undo,
.theme-remove-bg {
Expand All @@ -46,7 +48,14 @@
visibility: visible;
height: 32px;
width: 32px;
// right align
margin-left: auto;
}
form .theme-undo:not([style*="display:"]) ~ .theme-remove-bg {
// Only align the undo button if both are shown
margin-left: 0;
}

input[type='text']:hover + .theme-undo,
input[type='text'] + .theme-undo:hover,
input[type='text']:focus + .theme-undo,
Expand All @@ -61,6 +70,8 @@
label span {
display: inline-block;
min-width: 175px;
max-width: 175px;
white-space: wrap;
padding: 8px 0px;
vertical-align: top;
}
Expand Down Expand Up @@ -137,6 +148,15 @@
#theming-preview-favicon {
background-image: var(--image-favicon);
}

#user-theming {
margin-top: 44px;
display: flex;
& > div {
max-width: 400px;
margin-bottom: 44px;
}
}
}

/* transition effects for theming value changes */
Expand Down
5 changes: 5 additions & 0 deletions apps/theming/js/settings-admin.js
Original file line number Diff line number Diff line change
Expand Up @@ -173,6 +173,11 @@ window.addEventListener('DOMContentLoaded', function () {
var el = $(this);
});

$('#userThemingDisabled').change(function(e) {
var checked = e.target.checked
setThemingValue('disable-user-theming', checked ? 'yes' : 'no')
});

function onChange(e) {
var el = $(this);
var setting = el.parent().find('div[data-setting]').data('setting');
Expand Down
2 changes: 1 addition & 1 deletion apps/theming/lib/Command/UpdateConfig.php
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@

class UpdateConfig extends Command {
public const SUPPORTED_KEYS = [
'name', 'url', 'imprintUrl', 'privacyUrl', 'slogan', 'color'
'name', 'url', 'imprintUrl', 'privacyUrl', 'slogan', 'color', 'disable-user-theming'
];

public const SUPPORTED_IMAGE_KEYS = [
Expand Down
5 changes: 5 additions & 0 deletions apps/theming/lib/Controller/ThemingController.php
Original file line number Diff line number Diff line change
Expand Up @@ -151,6 +151,11 @@ public function updateStylesheet($setting, $value) {
$error = $this->l10n->t('The given color is invalid');
}
break;
case 'disable-user-theming':
if ($value !== "yes" && $value !== "no") {
$error = $this->l10n->t('Disable-user-theming should be true or false');
}
break;
}
if ($error !== null) {
return new DataResponse([
Expand Down
4 changes: 2 additions & 2 deletions apps/theming/lib/ImageManager.php
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@
use OCP\IURLGenerator;

class ImageManager {
public const SupportedImageKeys = ['background', 'logo', 'logoheader', 'favicon'];

/** @var IConfig */
private $config;
Expand All @@ -53,7 +54,6 @@ class ImageManager {
/** @var IURLGenerator */
private $urlGenerator;
/** @var array */
private $supportedImageKeys = ['background', 'logo', 'logoheader', 'favicon'];
/** @var ICacheFactory */
private $cacheFactory;
/** @var ILogger */
Expand Down Expand Up @@ -142,7 +142,7 @@ public function hasImage(string $key): bool {
*/
public function getCustomImages(): array {
$images = [];
foreach ($this->supportedImageKeys as $key) {
foreach ($this::SupportedImageKeys as $key) {
$images[$key] = [
'mime' => $this->config->getAppValue('theming', $key . 'Mime', ''),
'url' => $this->getImageUrl($key),
Expand Down
1 change: 1 addition & 0 deletions apps/theming/lib/Settings/Admin.php
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,7 @@ public function getForm(): TemplateResponse {
'images' => $this->imageManager->getCustomImages(),
'imprintUrl' => $this->themingDefaults->getImprintUrl(),
'privacyUrl' => $this->themingDefaults->getPrivacyUrl(),
'userThemingDisabled' => $this->themingDefaults->isUserThemingDisabled(),
];

return new TemplateResponse($this->appName, 'settings-admin', $parameters, '');
Expand Down
7 changes: 6 additions & 1 deletion apps/theming/lib/Settings/Personal.php
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@

use OCA\Theming\ITheme;
use OCA\Theming\Service\ThemesService;
use OCA\Theming\ThemingDefaults;
use OCP\AppFramework\Http\TemplateResponse;
use OCP\AppFramework\Services\IInitialState;
use OCP\IConfig;
Expand All @@ -39,15 +40,18 @@ class Personal implements ISettings {
private IConfig $config;
private ThemesService $themesService;
private IInitialState $initialStateService;
private ThemingDefaults $themingDefaults;

public function __construct(string $appName,
IConfig $config,
ThemesService $themesService,
IInitialState $initialStateService) {
IInitialState $initialStateService,
ThemingDefaults $themingDefaults) {
$this->appName = $appName;
$this->config = $config;
$this->themesService = $themesService;
$this->initialStateService = $initialStateService;
$this->themingDefaults = $themingDefaults;
}

public function getForm(): TemplateResponse {
Expand All @@ -72,6 +76,7 @@ public function getForm(): TemplateResponse {

$this->initialStateService->provideInitialState('themes', array_values($themes));
$this->initialStateService->provideInitialState('enforceTheme', $enforcedTheme);
$this->initialStateService->provideInitialState('isUserThemingDisabled', $this->themingDefaults->isUserThemingDisabled());
Util::addScript($this->appName, 'theming-settings');

return new TemplateResponse($this->appName, 'settings-personal');
Expand Down
90 changes: 90 additions & 0 deletions apps/theming/lib/Themes/CommonThemeTrait.php
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,9 @@
*/
namespace OCA\Theming\Themes;

use OCA\Theming\AppInfo\Application;
use OCA\Theming\ImageManager;
use OCA\Theming\Service\BackgroundService;
use OCA\Theming\Util;

trait CommonThemeTrait {
Expand All @@ -41,6 +44,15 @@ protected function generatePrimaryVariables(string $colorMainBackground, string

// primary related colours
return [
// invert filter if primary is too bright
// to be used for legacy reasons only. Use inline
// svg with proper css variable instead or material
// design icons.
// ⚠️ Using 'no' as a value to make sure we specify an
// invalid one with no fallback. 'unset' could here fallback to some
// other theme with media queries
'--primary-invert-if-bright' => $this->util->invertTextColor($this->primaryColor) ? 'invert(100%)' : 'no',

'--color-primary' => $this->primaryColor,
'--color-primary-default' => $this->defaultPrimaryColor,
'--color-primary-text' => $this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff',
Expand All @@ -63,4 +75,82 @@ protected function generatePrimaryVariables(string $colorMainBackground, string
'--gradient-primary-background' => 'linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%)',
];
}

/**
* Generate admin theming background-related variables
*/
protected function generateGlobalBackgroundVariables(): array {
$backgroundDeleted = $this->config->getAppValue(Application::APP_ID, 'backgroundMime', '') === 'backgroundColor';
$hasCustomLogoHeader = $this->imageManager->hasImage('logo') || $this->imageManager->hasImage('logoheader');

$variables = [];

// If primary as background has been request or if we have a custom primary colour
// let's not define the background image
if ($backgroundDeleted && $this->themingDefaults->isUserThemingDisabled()) {
$variables['--image-background-plain'] = 'true';
$variables['--color-background-plain'] = $this->themingDefaults->getColorPrimary();
}

// Register image variables only if custom-defined
foreach (ImageManager::SupportedImageKeys as $image) {
if ($this->imageManager->hasImage($image)) {
$imageUrl = $this->imageManager->getImageUrl($image);
if ($image === 'background') {
// If background deleted is set, ignoring variable
if ($backgroundDeleted) {
continue;
}
$variables['--image-background-size'] = 'cover';
}
$variables["--image-$image"] = "url('" . $imageUrl . "')";
}
}

if ($hasCustomLogoHeader) {
$variables["--image-logoheader-custom"] = 'true';
}

return $variables;
}

/**
* Generate user theming background-related variables
*/
protected function generateUserBackgroundVariables(): array {
$user = $this->userSession->getUser();
if ($user !== null
&& !$this->themingDefaults->isUserThemingDisabled()
&& $this->appManager->isEnabledForUser(Application::APP_ID)) {
$themingBackground = $this->config->getUserValue($user->getUID(), Application::APP_ID, 'background', 'default');
$currentVersion = (int)$this->config->getUserValue($user->getUID(), Application::APP_ID, 'userCacheBuster', '0');

// The user uploaded a custom background
if ($themingBackground === 'custom') {
$cacheBuster = substr(sha1($user->getUID() . '_' . $currentVersion), 0, 8);
return [
'--image-background' => "url('" . $this->urlGenerator->linkToRouteAbsolute('theming.userTheme.getBackground') . "?v=$cacheBuster')",
// TODO: implement primary color from custom background --color-background-plain
];
}

// The user picked a shipped background
if (isset(BackgroundService::SHIPPED_BACKGROUNDS[$themingBackground])) {
return [
'--image-background' => "url('" . $this->urlGenerator->linkTo(Application::APP_ID, "/img/background/$themingBackground") . "')",
'--color-background-plain' => $this->themingDefaults->getColorPrimary(),
];
}

// The user picked a static colour
if (substr($themingBackground, 0, 1) === '#') {
return [
'--image-background' => 'no',
'--color-background-plain' => $this->themingDefaults->getColorPrimary(),
];
}
}

return [];
}
}
Loading