scss: set root vars depending of the theme

This commit is contained in:
Simon Vieille
2025-04-15 20:37:11 +02:00
parent b98bbd1053
commit cbd8462333
3 changed files with 94 additions and 353 deletions
+38 -60
View File
@@ -66,10 +66,6 @@ class CssController extends Controller
$topMenuApps = $this->config->getAppValueArray('top-menu-apps', '[]');
$topSideMenuApps = $this->config->getAppValueArray('top-side-menu-apps', '[]');
$isAccessibilityAppEnabled = $this->config->getAppValueBool('enabled', '0', 'accessibility');
$isBreezeDarkAppEnabled = $this->config->getAppValueBool('enabled', '0', 'breezedark');
$isBreezeDarkGlobalEnabled = $this->config->getAppValueBool('theme_enabled', '0', 'breezedark');
if ($this->user) {
$userTopMenuApps = $this->config->getUserValueArray($this->user, 'top-menu-apps', '[]');
$userTopSideMenuApps = $this->config->getUserValueArray($this->user, 'top-side-menu-apps', '[]');
@@ -81,80 +77,62 @@ class CssController extends Controller
if (!empty($userTopSideMenuApps) && !$isForced) {
$topSideMenuApps = $userTopSideMenuApps;
}
$isDarkThemeUserEnabled = 'dark' === $this->config->getUserValue($this->user, 'theme', '', 'accessibility');
$isBreezeDarkUserEnabled = $this->config->getUserValue($this->user, 'theme_enabled', '', 'breezedark');
$isBreezeDarkUserEnabled = '1' === $isBreezeDarkUserEnabled
|| ($isBreezeDarkGlobalEnabled && '' === $isBreezeDarkUserEnabled);
} else {
$isDarkThemeUserEnabled = false;
$isBreezeDarkUserEnabled = false;
}
$isDarkMode = ($isAccessibilityAppEnabled && $isDarkThemeUserEnabled)
|| ($isBreezeDarkAppEnabled && $isBreezeDarkUserEnabled);
$lightenPrimaryColor = $this->color->getLightenPrimaryColor();
$darkenPrimaryColor = $this->color->getDarkenPrimaryColor();
$darkenPrimaryColor2 = $this->color->getDarkenPrimaryColor2();
$textColor = $this->color->getTextColorPrimary();
if ($isDarkMode) {
$backgroundColor = $this->config->getAppValue('dark-mode-background-color', $darkenPrimaryColor);
$backgroundColorTo = $this->config->getAppValue('dark-mode-background-color-to', $darkenPrimaryColor);
$currentAppBackgroundColor = $this->config->getAppValue(
'dark-mode-current-app-background-color',
$darkenPrimaryColor2
);
$loaderColor = $this->config->getAppValue('dark-mode-loader-color', $lightenPrimaryColor);
$textColor = $this->config->getAppValue('dark-mode-text-color', $textColor);
$iconInvertFilter = abs($this->config->getAppValueInt('dark-mode-icon-invert-filter', '0')).'%';
$iconOpacity = abs($this->config->getAppValueInt('dark-mode-icon-opacity', '100') / 100);
$opener = $this->config->getAppValue('dark-mode-opener', 'side-menu-opener');
$opacity = $this->config->getAppValueInt('dark-mode-background-color-opacity', '100');
$backgroundOpacity = dechex($opacity * 255 / 100);
} else {
$backgroundColor = $this->config->getAppValue('background-color', $darkenPrimaryColor);
$backgroundColorTo = $this->config->getAppValue('background-color-to', $darkenPrimaryColor);
$currentAppBackgroundColor = $this->config->getAppValue(
'current-app-background-color',
$darkenPrimaryColor2
);
$loaderColor = $this->config->getAppValue('loader-color', $lightenPrimaryColor);
$textColor = $this->config->getAppValue('text-color', $textColor);
$iconInvertFilter = abs($this->config->getAppValueInt('icon-invert-filter', '0')).'%';
$iconOpacity = abs($this->config->getAppValueInt('icon-opacity', '100') / 100);
$opener = $this->config->getAppValue('opener', 'side-menu-opener');
$opacity = $this->config->getAppValueInt('background-color-opacity', '100');
$backgroundOpacity = dechex($opacity * 255 / 100);
}
$backgroundColor = $this->config->getAppValue('background-color', $darkenPrimaryColor);
$backgroundColorTo = $this->config->getAppValue('background-color-to', $darkenPrimaryColor);
$opacity = $this->config->getAppValueInt('background-color-opacity', '100');
$backgroundOpacity = dechex($opacity * 255 / 100);
$backgroundColor .= $backgroundOpacity;
$backgroundColorTo .= $backgroundOpacity;
$darkBackgroundColor = $this->config->getAppValue('dark-mode-background-color', $darkenPrimaryColor);
$darkBackgroundColorTo = $this->config->getAppValue('dark-mode-background-color-to', $darkenPrimaryColor);
$darkOpacity = $this->config->getAppValueInt('dark-mode-background-color-opacity', '100');
$darkBackgroundOpacity = dechex($opacity * 255 / 100);
$darkBackgroundColor .= $darkBackgroundOpacity;
$darkBackgroundColorTo .= $darkBackgroundOpacity;
return [
'vars' => [
'background-color' => $backgroundColor,
'background-color-to' => $backgroundColorTo,
'current-app-background-color' => $currentAppBackgroundColor,
'loader-color' => $loaderColor,
'text-color' => $textColor,
'opener' => $opener,
'icon-invert-filter' => $iconInvertFilter,
'icon-opacity' => $iconOpacity,
'light' => [
'background-color' => $backgroundColor,
'background-color-to' => $backgroundColorTo,
'current-app-background-color' => $this->config->getAppValue(
'current-app-background-color',
$darkenPrimaryColor2
),
'loader-color' => $this->config->getAppValue('loader-color', $lightenPrimaryColor),
'text-color' => $this->config->getAppValue('text-color', $textColor),
'opener' => $this->config->getAppValue('opener', 'side-menu-opener'),
'icon-invert-filter' => abs($this->config->getAppValueInt('icon-invert-filter', '0')).'%',
'icon-opacity' => abs($this->config->getAppValueInt('icon-opacity', '100') / 100),
],
'dark' => [
'background-color' => $darkBackgroundColor,
'background-color-to' => $darkBackgroundColorTo,
'current-app-background-color' => $this->config->getAppValue(
'dark-mode-current-app-background-color',
$darkenPrimaryColor2
),
'loader-color' => $this->config->getAppValue('dark-mode-loader-color', $lightenPrimaryColor),
'text-color' => $this->config->getAppValue('dark-mode-text-color', $textColor),
'opener' => $this->config->getAppValue('dark-mode-opener', 'side-menu-opener'),
'icon-invert-filter' => abs($this->config->getAppValueInt('dark-mode-icon-invert-filter', '0')).'%',
'icon-opacity' => abs($this->config->getAppValueInt('dark-mode-icon-opacity', '100') / 100),
]
],
'display-logo' => $this->config->getAppValueBool('display-logo', '1'),
'opener-only' => $this->config->getAppValueBool('opener-only', '0'),
'external-sites-in-top-menu' => $this->config->getAppValueBool('external-sites-in-top-menu', '0'),
'size-icon' => $this->config->getAppValue('size-icon', 'normal'),
'size-text' => $this->config->getAppValue('size-text', 'normal'),
'always-displayed' => $this->config->getAppValueBool('always-displayed', '0'),
'big-menu' => $this->config->getAppValueBool('big-menu', '0'),
'top-menu-apps' => $topMenuApps,
'top-side-menu-apps' => $topSideMenuApps,
];
}
}