nextcloud
/
server
mirror of https://github.com/nextcloud/server
0
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #33641 from nextcloud/bugfix/noid/primary-element-vars

This commit is contained in:
John Molakvoæ 2022-08-26 19:59:53 +02:00 committed by GitHub
parent f617796c35 cc21ea6419
commit efbe972407
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/settings/css/settings.css
View File

@ -223,7 +223,7 @@ select#timezone, select#languageinput, select#localeinput {
text-decoration: underline;
}
.development-notice a:not(.link-button):hover {
background-color: var(--color-primary-element-lighter);
background-color: var(--color-primary-element-hover);
}
.link-button {

2
apps/settings/css/settings.scss
View File

@ -190,7 +190,7 @@ select {
a:not(.link-button) {
text-decoration: underline;
&:hover {
background-color: var(--color-primary-element-lighter);
background-color: var(--color-primary-element-hover);
}
}
}

11
apps/theming/css/default.css
View File

@ -18,10 +18,13 @@
--color-primary-light-hover: #dbe7ee;
--color-primary-text-dark: #ededed;
--color-primary-element: #0082c9;
--color-primary-element-hover: #198ece;
--color-primary-element-light: #17adff;
--color-primary-element-lighter: #d8ecf6;
--gradient-primary-background: linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-element-light) 100%);
--color-primary-element-text: #ffffff;
--color-primary-element-hover: #329bd3;
--color-primary-element-light: #e5f2f9;
--color-primary-element-light-text: #0082c9;
--color-primary-element-light-hover: #dbe7ee;
--color-primary-element-text-dark: #ededed;
--gradient-primary-background: linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
--color-main-text: #222222;
--color-text-maxcontrast: #767676;
--color-text-light: #222222;

16
apps/theming/lib/Themes/DefaultTheme.php
View File

@ -90,6 +90,9 @@ class DefaultTheme implements ITheme {
$colorBoxShadowRGB = join(',', $this->util->hexToRGB($colorBoxShadow));
$colorPrimaryLight = $this->util->mix($this->primaryColor, $colorMainBackground, -80);
$colorPrimaryElement = $this->util->elementColor($this->primaryColor);
$colorPrimaryElementLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80);
$hasCustomLogoHeader = $this->imageManager->hasImage('logo') || $this->imageManager->hasImage('logoheader');
$hasCustomPrimaryColour = !empty($this->config->getAppValue('theming', 'color'));
@ -120,12 +123,15 @@ class DefaultTheme implements ITheme {
'--color-primary-light-hover' => $this->util->mix($colorPrimaryLight, $colorMainText, 90),
'--color-primary-text-dark' => $this->util->darken($this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff', 7),
// used for buttons, inputs...
'--color-primary-element' => $this->util->elementColor($this->primaryColor),
'--color-primary-element-hover' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, 80),
'--color-primary-element-light' => $this->util->lighten($this->util->elementColor($this->primaryColor), 15),
'--color-primary-element-lighter' => $this->util->mix($this->util->elementColor($this->primaryColor), $colorMainBackground, -70),
'--color-primary-element' => $colorPrimaryElement,
'--color-primary-element-text' => $this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff',
'--color-primary-element-hover' => $this->util->mix($colorPrimaryElement, $colorMainBackground, 60),
'--color-primary-element-light' => $colorPrimaryElementLight,
'--color-primary-element-light-text' => $colorPrimaryElement,
'--color-primary-element-light-hover' => $this->util->mix($colorPrimaryElementLight, $colorMainText, 90),
'--color-primary-element-text-dark' => $this->util->darken($this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff', 7),
// to use like this: background-image: var(--gradient-primary-background);
'--gradient-primary-background' => 'linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-element-light) 100%)',
'--gradient-primary-background' => 'linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%)',
// max contrast for WCAG compliance
'--color-main-text' => $colorMainText,