Skip to content

Commit a178d69

Browse files
authored
Merge pull request #34298 from nextcloud/enh/shipped-background-colors
Use color preset of shipped background as primary color
2 parents 89635e8 + 7044191 commit a178d69

File tree

18 files changed

+131
-77
lines changed

18 files changed

+131
-77
lines changed

apps/theming/css/default.css

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
:root {
22
--color-main-background: #ffffff;
3+
--color-main-background-not-plain: #0082c9;
34
--color-main-background-rgb: 255,255,255;
45
--color-main-background-translucent: rgba(var(--color-main-background-rgb), .97);
56
--color-main-background-blur: rgba(var(--color-main-background-rgb), .8);
@@ -53,19 +54,19 @@
5354
--background-invert-if-dark: no;
5455
--background-invert-if-bright: invert(100%);
5556
--image-main-background: url('/core/img/app-background.jpg');
56-
--color-primary: #0082c9;
57+
--color-primary: #00639a;
5758
--color-primary-text: #ffffff;
58-
--color-primary-hover: #329bd3;
59-
--color-primary-light: #e5f2f9;
60-
--color-primary-light-text: #003450;
61-
--color-primary-light-hover: #dbe7ee;
59+
--color-primary-hover: #3282ae;
60+
--color-primary-light: #e5eff4;
61+
--color-primary-light-text: #00273d;
62+
--color-primary-light-hover: #dbe4e9;
6263
--color-primary-text-dark: #ededed;
63-
--color-primary-element: #0082c9;
64+
--color-primary-element: #00639a;
6465
--color-primary-element-text: #ffffff;
65-
--color-primary-element-hover: #329bd3;
66-
--color-primary-element-light: #e5f2f9;
67-
--color-primary-element-light-text: #003450;
68-
--color-primary-element-light-hover: #dbe7ee;
66+
--color-primary-element-hover: #3282ae;
67+
--color-primary-element-light: #e5eff4;
68+
--color-primary-element-light-text: #00273d;
69+
--color-primary-element-light-hover: #dbe4e9;
6970
--color-primary-element-text-dark: #ededed;
7071
--gradient-primary-background: linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
7172
}

apps/theming/css/settings-admin.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

apps/theming/css/settings-admin.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@
100100
margin-top: 10px;
101101
margin-bottom: 20px;
102102
cursor: pointer;
103-
background-color: var(--color-primary);
103+
background-color: var(--color-main-background-not-plain, var(--color-primary));
104104
background-image: var(--image-background, var(--image-background-plain, url('../../../core/img/app-background.jpg'), linear-gradient(40deg, #0082c9 0%, #30b6ff 100%)));
105105

106106
#theming-preview-logo {
@@ -145,4 +145,4 @@
145145
svg, img {
146146
transition: 500ms filter linear;
147147
}
148-
}
148+
}

apps/theming/lib/Service/BackgroundService.php

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,8 @@
4444
class BackgroundService {
4545
// true when the background is bright and need dark icons
4646
public const THEMING_MODE_DARK = 'dark';
47+
public const DEFAULT_COLOR = '#0082c9';
48+
public const DEFAULT_ACCESSIBLE_COLOR = '#00639a';
4749

4850
public const SHIPPED_BACKGROUNDS = [
4951
'anatoly-mikhaltsov-butterfly-wing-scale.jpg' => [
@@ -90,8 +92,7 @@ class BackgroundService {
9092
'kamil-porembinski-clouds.jpg' => [
9193
'attribution' => 'Clouds (Kamil Porembiński, CC BY-SA)',
9294
'attribution_url' => 'https://www.flickr.com/photos/paszczak000/8715851521/',
93-
// Originally #0082c9 but adjusted for accessibility
94-
'primary_color' => '#00639a',
95+
'primary_color' => self::DEFAULT_COLOR,
9596
],
9697
'bernard-spragg-new-zealand-fern.jpg' => [
9798
'attribution' => 'New zealand fern (Bernard Spragg, CC0)',

apps/theming/lib/Themes/DefaultTheme.php

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@
2727
use OCA\Theming\AppInfo\Application;
2828
use OCA\Theming\ImageManager;
2929
use OCA\Theming\ITheme;
30+
use OCA\Theming\Service\BackgroundService;
3031
use OCA\Theming\ThemingDefaults;
3132
use OCA\Theming\Util;
3233
use OCP\App\IAppManager;
@@ -41,6 +42,7 @@ class DefaultTheme implements ITheme {
4142

4243
public Util $util;
4344
public ThemingDefaults $themingDefaults;
45+
public IUserSession $userSession;
4446
public IURLGenerator $urlGenerator;
4547
public ImageManager $imageManager;
4648
public IConfig $config;
@@ -50,18 +52,22 @@ class DefaultTheme implements ITheme {
5052

5153
public function __construct(Util $util,
5254
ThemingDefaults $themingDefaults,
55+
IUserSession $userSession,
5356
IURLGenerator $urlGenerator,
5457
ImageManager $imageManager,
5558
IConfig $config,
5659
IL10N $l) {
5760
$this->util = $util;
5861
$this->themingDefaults = $themingDefaults;
62+
$this->userSession = $userSession;
5963
$this->urlGenerator = $urlGenerator;
6064
$this->imageManager = $imageManager;
6165
$this->config = $config;
6266
$this->l = $l;
6367

64-
$this->primaryColor = $this->themingDefaults->getColorPrimary();
68+
$initialPrimaryColor = $this->themingDefaults->getColorPrimary();
69+
// Override default color if set to improve accessibility
70+
$this->primaryColor = $initialPrimaryColor === BackgroundService::DEFAULT_COLOR ? BackgroundService::DEFAULT_ACCESSIBLE_COLOR : $initialPrimaryColor;
6571
}
6672

6773
public function getId(): string {
@@ -101,6 +107,7 @@ public function getCSSVariables(): array {
101107

102108
$variables = [
103109
'--color-main-background' => $colorMainBackground,
110+
'--color-main-background-not-plain' => $this->themingDefaults->getColorPrimary(),
104111
'--color-main-background-rgb' => $colorMainBackgroundRGB,
105112
'--color-main-background-translucent' => 'rgba(var(--color-main-background-rgb), .97)',
106113
'--color-main-background-blur' => 'rgba(var(--color-main-background-rgb), .8)',
@@ -221,21 +228,17 @@ public function getCSSVariables(): array {
221228
}
222229

223230
$appManager = Server::get(IAppManager::class);
224-
$userSession = Server::get(IUserSession::class);
225-
$user = $userSession->getUser();
231+
$user = $this->userSession->getUser();
226232
if ($appManager->isEnabledForUser(Application::APP_ID) && $user !== null) {
227233
$themingBackground = $this->config->getUserValue($user->getUID(), Application::APP_ID, 'background', 'default');
228234

229235
if ($themingBackground === 'custom') {
230-
// Custom
231236
$variables['--image-main-background'] = "url('" . $this->urlGenerator->linkToRouteAbsolute('theming.userTheme.getBackground') . "')";
232-
} elseif ($themingBackground !== 'default' && substr($themingBackground, 0, 1) !== '#') {
233-
// Shipped background
237+
} elseif (isset(BackgroundService::SHIPPED_BACKGROUNDS[$themingBackground])) {
234238
$variables['--image-main-background'] = "url('" . $this->urlGenerator->linkTo(Application::APP_ID, "/img/background/$themingBackground") . "')";
235239
} elseif (substr($themingBackground, 0, 1) === '#') {
236-
// Color
237240
unset($variables['--image-main-background']);
238-
$variables['--color-main-background-plain'] = $this->primaryColor;
241+
$variables['--color-main-background-plain'] = $this->themingDefaults->getColorPrimary();
239242
}
240243
}
241244

apps/theming/lib/ThemingDefaults.php

Lines changed: 43 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,8 @@
4040
*/
4141
namespace OCA\Theming;
4242

43+
use OCA\Theming\AppInfo\Application;
44+
use OCA\Theming\Service\BackgroundService;
4345
use OCP\App\AppPathNotFoundException;
4446
use OCP\App\IAppManager;
4547
use OCP\Files\NotFoundException;
@@ -49,61 +51,47 @@
4951
use OCP\IL10N;
5052
use OCP\INavigationManager;
5153
use OCP\IURLGenerator;
54+
use OCP\IUserSession;
5255

5356
class ThemingDefaults extends \OC_Defaults {
5457

55-
/** @var IConfig */
56-
private $config;
57-
/** @var IL10N */
58-
private $l;
59-
/** @var ImageManager */
60-
private $imageManager;
61-
/** @var IURLGenerator */
62-
private $urlGenerator;
63-
/** @var ICacheFactory */
64-
private $cacheFactory;
65-
/** @var Util */
66-
private $util;
67-
/** @var IAppManager */
68-
private $appManager;
69-
/** @var INavigationManager */
70-
private $navigationManager;
71-
72-
/** @var string */
73-
private $name;
74-
/** @var string */
75-
private $title;
76-
/** @var string */
77-
private $entity;
78-
/** @var string */
79-
private $productName;
80-
/** @var string */
81-
private $url;
82-
/** @var string */
83-
private $color;
84-
85-
/** @var string */
86-
private $iTunesAppId;
87-
/** @var string */
88-
private $iOSClientUrl;
89-
/** @var string */
90-
private $AndroidClientUrl;
91-
/** @var string */
92-
private $FDroidClientUrl;
58+
private IConfig $config;
59+
private IL10N $l;
60+
private ImageManager $imageManager;
61+
private IUserSession $userSession;
62+
private IURLGenerator $urlGenerator;
63+
private ICacheFactory $cacheFactory;
64+
private Util $util;
65+
private IAppManager $appManager;
66+
private INavigationManager $navigationManager;
67+
68+
private string $name;
69+
private string $title;
70+
private string $entity;
71+
private string $productName;
72+
private string $url;
73+
private string $color;
74+
75+
private string $iTunesAppId;
76+
private string $iOSClientUrl;
77+
private string $AndroidClientUrl;
78+
private string $FDroidClientUrl;
9379

9480
/**
9581
* ThemingDefaults constructor.
9682
*
9783
* @param IConfig $config
9884
* @param IL10N $l
9985
* @param ImageManager $imageManager
86+
* @param IUserSession $userSession
10087
* @param IURLGenerator $urlGenerator
10188
* @param ICacheFactory $cacheFactory
10289
* @param Util $util
10390
* @param IAppManager $appManager
10491
*/
10592
public function __construct(IConfig $config,
10693
IL10N $l,
94+
IUserSession $userSession,
10795
IURLGenerator $urlGenerator,
10896
ICacheFactory $cacheFactory,
10997
Util $util,
@@ -115,6 +103,7 @@ public function __construct(IConfig $config,
115103
$this->config = $config;
116104
$this->l = $l;
117105
$this->imageManager = $imageManager;
106+
$this->userSession = $userSession;
118107
$this->urlGenerator = $urlGenerator;
119108
$this->cacheFactory = $cacheFactory;
120109
$this->util = $util;
@@ -229,10 +218,24 @@ public function getShortFooter() {
229218
* @return string
230219
*/
231220
public function getColorPrimary() {
232-
$color = $this->config->getAppValue('theming', 'color', $this->color);
221+
$user = $this->userSession->getUser();
222+
$color = $this->config->getAppValue(Application::APP_ID, 'color', '');
223+
224+
if ($color === '' && !empty($user)) {
225+
$themingBackground = $this->config->getUserValue($user->getUID(), Application::APP_ID, 'background', 'default');
226+
if ($themingBackground === 'default') {
227+
$this->increaseCacheBuster();
228+
return BackgroundService::DEFAULT_COLOR;
229+
} else if (isset(BackgroundService::SHIPPED_BACKGROUNDS[$themingBackground]['primary_color'])) {
230+
$this->increaseCacheBuster();
231+
return BackgroundService::SHIPPED_BACKGROUNDS[$themingBackground]['primary_color'];
232+
}
233+
}
234+
233235
if (!preg_match('/^\#([0-9a-f]{3}|[0-9a-f]{6})$/i', $color)) {
234-
$color = '#0082c9';
236+
return BackgroundService::DEFAULT_COLOR;
235237
}
238+
236239
return $color;
237240
}
238241

apps/theming/src/components/BackgroundSettings.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -171,7 +171,7 @@ export default {
171171
}
172172
173173
&.color {
174-
background-color: var(--color-primary);
174+
background-color: var(--color-main-background-not-plain, var(--color-primary));
175175
color: var(--color-primary-text);
176176
}
177177

apps/theming/tests/Service/ThemesServiceTest.php

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ public function testDisableTheme(string $toDisable, array $enabledThemes, array
156156
->method('getUserValue')
157157
->with('user', Application::APP_ID, 'enabled-themes', '[]')
158158
->willReturn(json_encode($enabledThemes));
159-
159+
160160

161161
$this->assertEquals($expectedEnabled, $this->themesService->disableTheme($this->themes[$toDisable]));
162162
}
@@ -190,7 +190,7 @@ public function testIsEnabled(string $themeId, array $enabledThemes, $expected)
190190
->method('getUserValue')
191191
->with('user', Application::APP_ID, 'enabled-themes', '[]')
192192
->willReturn(json_encode($enabledThemes));
193-
193+
194194

195195
$this->assertEquals($expected, $this->themesService->isEnabled($this->themes[$themeId]));
196196
}
@@ -281,6 +281,7 @@ private function initThemes() {
281281
'default' => new DefaultTheme(
282282
$util,
283283
$this->themingDefaults,
284+
$this->userSession,
284285
$urlGenerator,
285286
$imageManager,
286287
$this->config,
@@ -289,6 +290,7 @@ private function initThemes() {
289290
'light' => new LightTheme(
290291
$util,
291292
$this->themingDefaults,
293+
$this->userSession,
292294
$urlGenerator,
293295
$imageManager,
294296
$this->config,
@@ -297,6 +299,7 @@ private function initThemes() {
297299
'dark' => new DarkTheme(
298300
$util,
299301
$this->themingDefaults,
302+
$this->userSession,
300303
$urlGenerator,
301304
$imageManager,
302305
$this->config,
@@ -305,6 +308,7 @@ private function initThemes() {
305308
'light-highcontrast' => new HighContrastTheme(
306309
$util,
307310
$this->themingDefaults,
311+
$this->userSession,
308312
$urlGenerator,
309313
$imageManager,
310314
$this->config,
@@ -313,6 +317,7 @@ private function initThemes() {
313317
'dark-highcontrast' => new DarkHighContrastTheme(
314318
$util,
315319
$this->themingDefaults,
320+
$this->userSession,
316321
$urlGenerator,
317322
$imageManager,
318323
$this->config,
@@ -321,6 +326,7 @@ private function initThemes() {
321326
'opendyslexic' => new DyslexiaFont(
322327
$util,
323328
$this->themingDefaults,
329+
$this->userSession,
324330
$urlGenerator,
325331
$imageManager,
326332
$this->config,

0 commit comments

Comments
 (0)