upstream/nextcloud
1
0
Fork 0
mirror of https://github.com/nextcloud/server.git synced 2026-04-23 15:21:00 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 42

fix(theming): When selected a background image make header color independent of primary color

Browse source 
Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
This commit is contained in:
Ferdinand Thiessen 2024-05-21 22:08:06 +02:00
parent 04790e9ae4
commit 7dcc2e541c
No known key found for this signature in database
GPG key ID: 45FAE7268762B400
4 changed files with 7 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
apps/theming/css/default.css
View file

@ -68,6 +68,7 @@
--background-invert-if-dark: no;
--background-invert-if-bright: invert(100%);
--background-image-invert-if-bright: no;
--background-image-color-text: #ffffff;
--primary-invert-if-bright: no;
--primary-invert-if-dark: invert(100%);
--color-primary: #00679e;

4
apps/theming/lib/Themes/CommonThemeTrait.php
View file

@ -113,6 +113,7 @@ trait CommonThemeTrait {
$variables['--image-background'] = 'no';
// If no background image is set, we need to check against the shown primary colour
$variables['--background-image-invert-if-bright'] = $isPrimaryBright ? 'invert(100%)' : 'no';
$variables['--background-image-color-text'] = $isPrimaryBright ? '#000000' : '#ffffff';
}
if ($hasCustomLogoHeader) {
@ -143,6 +144,7 @@ trait CommonThemeTrait {
'--color-background-plain' => $this->primaryColor,
// If no background image is set, we need to check against the shown primary colour
'--background-image-invert-if-bright' => $isPrimaryBright ? 'invert(100%)' : 'no',
'--background-image-color-text' => $isPrimaryBright ? '#000000' : '#ffffff',
];
}
@ -161,6 +163,7 @@ trait CommonThemeTrait {
// --image-background is not defined in this case
'--color-background-plain' => $this->primaryColor,
'--background-image-invert-if-bright' => $isPrimaryBright ? 'invert(100%)' : 'no',
'--background-image-color-text' => $isPrimaryBright ? '#000000' : '#ffffff',
];
}
@ -170,6 +173,7 @@ trait CommonThemeTrait {
'--image-background' => "url('" . $this->urlGenerator->linkTo(Application::APP_ID, "img/background/$backgroundImage") . "')",
'--color-background-plain' => $this->primaryColor,
'--background-image-invert-if-bright' => BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage]['theming'] ?? null === BackgroundService::THEMING_MODE_DARK ? 'invert(100%)' : 'no',
'--background-image-color-text' => BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage]['theming'] ?? null === BackgroundService::THEMING_MODE_DARK ? '#000000' : '#ffffff',
];
}
}

1
apps/theming/lib/Themes/DefaultTheme.php
View file

@ -211,6 +211,7 @@ class DefaultTheme implements ITheme {
'--background-invert-if-dark' => 'no',
'--background-invert-if-bright' => 'invert(100%)',
'--background-image-invert-if-bright' => 'no',
'--background-image-color-text' => '#ffffff',
];
// Primary variables

1
core/css/header.scss
View file

@ -93,6 +93,7 @@
#header {
/* Header menu */
$header-menu-entry-height: 44px;
--color-primary-text: var(--background-image-color-text, #ffffff);
.header-right > div > .menu {
background-color: var(--color-main-background);