fix: various dark theme bugs and saving theme settings issues

Leantime · Feb 18, 2025 · 606be4d · 606be4d
1 parent b524401
commit 606be4d
Show file tree

Hide file tree

Showing 7 changed files with 101 additions and 82 deletions.
diff --git a/app/Core/UI/Theme.php b/app/Core/UI/Theme.php
@@ -113,6 +113,16 @@ class Theme
     private array|false $iniData;
 
     private array $colorSchemes = [
+        'grayscale1' => [
+            'name' => 'Grayscale',
+            'primaryColor' => '#000000',
+            'secondaryColor' => '#757575',
+        ],
+        'grayscale2' => [
+            'name' => 'Grayscale Reverse',
+            'primaryColor' => '#d1d1d1',
+            'secondaryColor' => '#000000',
+        ],
         'themeDefault' => 'themeDefault',
         'companyColors' => 'companyColors',
     ];

diff --git a/app/Domain/Users/Controllers/EditOwn.php b/app/Domain/Users/Controllers/EditOwn.php
@@ -4,24 +4,18 @@
 
     use Leantime\Core\Controller\Controller;
     use Leantime\Core\Controller\Frontcontroller as FrontcontrollerCore;
-    use Leantime\Core\Language as LanguageCore;
     use Leantime\Core\UI\Theme as ThemeCore;
-    use Leantime\Domain\Setting\Repositories\Setting as SettingRepository;
     use Leantime\Domain\Setting\Services\Setting as SettingService;
     use Leantime\Domain\Users\Repositories\Users as UserRepository;
     use Leantime\Domain\Users\Services\Users as UserService;
     use Symfony\Component\HttpFoundation\Response;
 
     class EditOwn extends Controller
     {
-        protected LanguageCore $language;
-
         private ThemeCore $themeCore;
 
         private UserRepository $userRepo;
 
-        private SettingRepository $settingsRepo;
-
         private SettingService $settingsService;
 
         private UserService $userService;
@@ -32,17 +26,13 @@ class EditOwn extends Controller
          * init - initialize private variables
          */
         public function init(
-            LanguageCore $language,
             ThemeCore $themeCore,
             UserRepository $userRepo,
-            SettingRepository $settingsRepo,
             SettingService $settingsService,
             UserService $userService
-        ) {
-            $this->language = $language;
+        ): void {
             $this->themeCore = $themeCore;
             $this->userRepo = $userRepo;
-            $this->settingsRepo = $settingsRepo;
             $this->settingsService = $settingsService;
             $this->userService = $userService;
 
@@ -64,14 +54,19 @@ public function get(): Response
             }
 
             $userTheme = $this->settingsService->getSetting('usersettings.'.$this->userId.'.theme');
+            if (! $userTheme) {
+                $userTheme = 'default';
+            }
+
             $userColorMode = $this->settingsService->getSetting('usersettings.'.$this->userId.'.colorMode');
             if (! $userColorMode) {
                 $userColorMode = 'light';
             }
 
+            $availableColorSchemes = $this->themeCore->getAvailableColorSchemes();
             $userColorScheme = $this->settingsService->getSetting('usersettings.'.$this->userId.'.colorScheme');
             if (! $userColorScheme) {
-                $userColorScheme = 'companyColors';
+                $userColorScheme = isset($availableColorSchemes['companyColors']) ? 'companyColors' : 'themeDefault';
             }
 
             $themeFont = $this->settingsService->getSetting('usersettings.'.$this->userId.'.themeFont');
@@ -90,8 +85,6 @@ public function get(): Response
 
             $timezonesAvailable = timezone_identifiers_list();
 
-            $availableColorSchemes = $this->themeCore->getAvailableColorSchemes();
-
             // Build values array
             $values = [
                 'firstname' => $row['firstname'],
@@ -147,7 +140,7 @@ public function post(): Response
             // Save Profile Info
             $tab = '';
 
-            if (session()->exists('formTokenName') && isset($_POST[session('formTokenName')]) && $_POST[session('formTokenName')] == session('formTokenValue')) {
+            if (isset($_POST[session('formTokenName')]) && session()->exists('formTokenName') && $_POST[session('formTokenName')] === session('formTokenValue')) {
                 $row = $this->userRepo->getUser($this->userId);
 
                 // profile Info
@@ -164,14 +157,14 @@ public function post(): Response
                     ];
 
                     $changedEmail = 0;
-                    if ($row['username'] != $values['user']) {
+                    if ($row['username'] !== $values['user']) {
                         $changedEmail = 1;
                     }
 
                     // Validation
                     if ($values['user'] !== '') {
                         if (filter_var($values['user'], FILTER_VALIDATE_EMAIL)) {
-                            if ($changedEmail == 1) {
+                            if ($changedEmail === 1) {
                                 if ($this->userRepo->usernameExist($values['user'], $this->userId) === false) {
                                     $this->userService->editOwn($values, $this->userId);
                                     $this->tpl->setNotification($this->language->__('notifications.profile_edited'), 'success', 'profile_edited');
@@ -206,7 +199,7 @@ public function post(): Response
 
                     if (password_verify($_POST['currentPassword'], $values['password'])) {
 
-                        if ($_POST['newPassword'] == $_POST['confirmPassword']) {
+                        if ($_POST['newPassword'] === $_POST['confirmPassword']) {
                             if ($this->userService->checkPasswordStrength($_POST['newPassword'])) {
                                 $values['password'] = $_POST['newPassword'];
                                 $this->userRepo->editOwn($values, $this->userId);
@@ -238,22 +231,21 @@ public function post(): Response
                 if (isset($_POST['saveTheme'])) {
                     $tab = '#theme';
 
-                    $postTheme = htmlentities($_POST['theme']);
-                    $postColorMode = htmlentities($_POST['colormode']);
+                    $postTheme = htmlentities($_POST['theme'] ?? 'default');
+                    $postColorMode = htmlentities($_POST['colormode'] ?? 'light');
                     $postColorScheme = htmlentities($_POST['colorscheme'] ?? 'themeDefault');
                     $themeFont = htmlentities($_POST['themeFont']);
 
                     $this->settingsService->saveSetting('usersettings.'.$this->userId.'.theme', $postTheme);
                     $this->settingsService->saveSetting('usersettings.'.$this->userId.'.colorMode', $postColorMode);
                     $this->settingsService->saveSetting('usersettings.'.$this->userId.'.colorScheme', $postColorScheme);
                     $this->settingsService->saveSetting('usersettings.'.$this->userId.'.themeFont', $themeFont);
-                    $this->themeCore->clearCache();
+                    $this->themeCore::clearCache();
                     $this->themeCore->setActive($postTheme);
-                    $this->themeCore->clearCache();
                     $this->themeCore->setColorMode($postColorMode);
-                    $this->themeCore->clearCache();
                     $this->themeCore->setColorScheme($postColorScheme);
                     $this->themeCore->setFont($themeFont);
+                    $this->themeCore::clearCache();
 
                     $this->tpl->setNotification($this->language->__('notifications.changed_profile_settings_successfully'), 'success', 'themsettings_updated');
                 }
@@ -311,7 +303,7 @@ public function post(): Response
                     $this->userRepo->editOwn($values, $this->userId);
 
                     // Storing option messagefrequency
-                    $this->settingsService->saveSetting('usersettings.'.$this->userId.'.messageFrequency', (int) $_POST['messagesfrequency'] ?? 3600);
+                    $this->settingsService->saveSetting('usersettings.'.$this->userId.'.messageFrequency', (int) ($_POST['messagesfrequency'] ?? 3600));
 
                     $this->tpl->setNotification($this->language->__('notifications.changed_profile_settings_successfully'), 'success', 'profilesettings_updated');
                 }

diff --git a/app/Views/Templates/sections/header.blade.php b/app/Views/Templates/sections/header.blade.php
@@ -79,6 +79,7 @@
 
 
     <style id="backgroundImageSetter">
+        wtf: {{ $themeBg }}
         @if(!empty($themeBg))
             .rightpanel {
                 background-image: url({!! filter_var($themeBg, FILTER_SANITIZE_URL) !!});

diff --git a/public/assets/css/components/nav.css b/public/assets/css/components/nav.css
@@ -1089,7 +1089,7 @@ a.barmenu:hover {
 
 
 .mainwrapper.menuclosed .primaryContent {
-    padding-left:50px;
+    padding-left:10px;
 }
 
 .mainwrapper.menuclosed .headmenu {

diff --git a/public/theme/default/css/dark.css b/public/theme/default/css/dark.css
@@ -21,10 +21,10 @@
 
     --main-titles-color: #fff;
 
-    --primary-background: rgba(0, 0, 0, 0.9);
-    --secondary-background: rgba(30, 30, 30, 1);
+    --primary-background: #404040;
+    --secondary-background: #292929;
 
-    --layered-background: rgba(0, 0, 0, 0.9);
+    --layered-background: #141414;
     --light-layered-background: rgba(0, 0, 0, 0.2);
 
     --primary-font-color: #bbbbbb;
@@ -47,7 +47,7 @@
     --content-bg: var(--secondary-background);
 
     --glass-blur: blur( 4px );
-    --glass-background: linear-gradient(135deg, rgba(0,0,0,0.9) 0%,  rgba(0,0,0,0.7) 50%,  rgba(0,0,0,0.4) 70%,  rgba(0,0,0,0.4) 100%);
+    --glass-background: linear-gradient(135deg, rgba(0,0,0,0.8) 0%,  rgba(0,0,0,0.8) 50%,  rgba(0,0,0,0.7) 70%,  rgba(0,0,0,0.6) 100%);
     --glass-border: 1px solid rgba(0,0,0,1);
 
     --main-action-bg: var(--accent1);
@@ -172,7 +172,7 @@
 }
 
 .rightpanel:before {
-    opacity:0.1;
+    opacity:0.9;
 }
 
 .overlay:after {
@@ -182,12 +182,11 @@
     left: 0px;
     width: 100vw;
     height: 100vh;
-    background: rgba(0,0,0, 0.7);
 }
 
 .overlay,
 .row .regLeft:before {
-    background: rgba(0,0,0, 0.7);
+    background: rgba(0,0,0, 0.6);
 }
 
 .mainwrapper.menuopen .header {

diff --git a/public/theme/minimal/css/dark.css b/public/theme/minimal/css/dark.css
@@ -1,43 +1,43 @@
 :root {
 
-    --accent1: hsla(199, 100%, 20%, 1);
-    --accent1-hover: #555;
+    --accent1: hsla(199, 100%, 31%, 1);
+    --accent1-hover: #404040;
     --accent1-color: #fff;
 
     --accent2: hsla(168, 100%, 33%, 1);
-    --accent2-hover: #555;
+    --accent2-hover: #404040;
     --accent2-color: #fff;
 
-    --nav-link-color: #bbbbbb;
+    --nav-link-color: #fff;
     --header-nav-link-color: #fff;
 
     --tab-background: transparent;
     --tab-color: var(--accent1);
 
-    --tab-active-background: rgba(25, 25, 25, 1);
-    --tab-active-color: #555;
+    --tab-active-background: #404040;
+    --tab-active-color: #fff;
 
     --primary-content-bg-opacity: 0.4;
 
-    --main-titles-color: #eee;
+    --main-titles-color: #fff;
 
-    --primary-background: rgba(0, 0, 0, 0.9);
-    --secondary-background: rgba(30, 30, 30, 1);
+    --primary-background: #404040;
+    --secondary-background: #292929;
 
-    --layered-background: rgba(25, 25, 25, 1);
-    --light-layered-background: rgba(25, 25, 25, 0.8);
+    --layered-background: #1f1f1f;
+    --light-layered-background:#404040;
 
-    --primary-font-color: #bbbbbb;
-    --secondary-font-color: #eee;
+    --primary-font-color: #fff;
+    --secondary-font-color: #fff;
 
-    --neutral: rgba(0, 0, 0, 0.2);
-    --solid-neutral:rgba(40, 40, 40, 1);
-    --neutral-background: rgba(40, 40, 40, 0.7);
+    --neutral: #141414;
+    --solid-neutral:#292929;
+    --neutral-background: #727272;
 
-    --col-title-bg: rgb(48, 51, 53);
-    --col-content-bg: rgb(48, 51, 53);
-    --col-hover-bg: rgb(34, 34, 34);
-    --col-row-striped:rgba(1,1,1,0.7);
+    --col-title-bg: #141414;
+    --col-content-bg: #1f1f1f;
+    --col-hover-bg: #404040;
+    --col-row-striped:#404040;
 
     --primary-color: var(--accent1);
     --secondary-color: var(--accent2);
@@ -47,8 +47,8 @@
     --content-bg: var(--secondary-background);
 
     --glass-blur: blur( 4px );
-    --glass-background:rgba(30, 30, 30, 1);
-    --glass-border: 1px solid rgba(0,0,0,1);
+    --glass-background:var(--secondary-background);
+    --glass-border: 1px solid rgba(0,0,0,0.3);
 
     --main-action-bg: var(--accent1);
     --main-action-color: var(--accent1-color);
@@ -63,7 +63,7 @@
     --main-menu-link-bg: var(--secondary-background);
     --main-menu-link-color: var(--primary-font-color);
 
-    --main-menu-link-hover-bg: rgba(1, 1, 1, 0.8);
+    --main-menu-link-hover-bg: #1f1f1f;
     --main-menu-link-hover-color: var(--accent1);
 
     --main-menu-overlayed-link-hover-bg: rgba(1, 1, 1, 0.4);
@@ -83,11 +83,11 @@
     --dropdown-link-hover-bg: var(--tab-active-background);
     --dropdown-link-hover-color: var(--primary-font-color);
 
-    --input-background: #000;
+    --input-background: var(--secondary-background);
 
     --header-action-hover-color: var(--neutral);
     --header-bg-color: var(--primary-color);
-    --header-gradient: #000;
+    --header-gradient: #111111;
     --element-gradient:linear-gradient(135deg, var(--accent1) 20%,var(--accent2) 100%);
 
     --primary-font-family: 'Roboto', 'Helvetica Neue', Helvetica, sans-serif;
@@ -101,7 +101,7 @@
     --font-size-xxl: 22px;
     --font-size-xxxl: 26px;
 
-    --main-border-color: rgba(40,40,40, 0.9);
+    --main-border-color: #585858;
     --min-shadow: 0px 1px 1px rgba(0 0 0 / 20%), 0px 0px 1px rgba(0 0 0 / 5%);
     --regular-shadow: 0px 2px 6px rgba(0 0 0 / 20%), 0px 0px 0px rgba(0 0 0 / 20%);
     --large-shadow: 0px 0px 8px 0 rgba(0 0 0 / 30%);
@@ -182,27 +182,22 @@
 
 }
 
-.rightpanel:before {
-    opacity:0.1;
+body .mainwrapper .rightpanel:before {
+    opacity:0.2 !important;
 }
 
-.overlay:after {
-    content:"";
-    position: fixed;
-    top: 0px;
-    left: 0px;
-    width: 100vw;
-    height: 100vh;
-    background: rgba(0,0,0, 0.7);
+.mainwrapper .header {
+    background-color:var(--header-bg-color);
+    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6));
 }
 
-.overlay,
-.row .regLeft:before {
-    background: rgba(0,0,0, 0.7);
+.header .headmenu > li > a {
+    text-shadow:none;
 }
 
-.mainwrapper.menuopen .header {
-    background: rgba(0,0,0, 0.7);
+.mainwrapper  .rightpanel {
+    backdrop-filter: opacity(0.3) !important;
+    mix-blend-mode: darken !important;
 }
 
 
@@ -469,3 +464,5 @@ body .ticketDropdown ul::after {
 .row .regLeft {
     background:var(--accent1);
 }
+
+