openrat-cms

commit d40ea3f2ab1bc835e6d603ba85fc49088dca49db
parent 9d872e337fd76f6f6a85fe8808644168d2eacc08
Author: Jan Dankert <develop@jandankert.de>
Date:   Mon, 22 Feb 2021 23:51:21 +0100

Better look of styles.

Diffstat:
M
modules/cms/base/DefaultConfig.class.php
 | 
9
+++++++--
M
modules/cms/ui/themes/ThemeStyle.class.php
 | 
11
++++++-----
M
modules/cms/ui/themes/default/style/theme/openrat-theme.less
 | 
68
++++++++++++++++++++++++++++++++++++++++++++++++++------------------

3 files changed, 63 insertions(+), 25 deletions(-)
diff --git a/modules/cms/base/DefaultConfig.class.php b/modules/cms/base/DefaultConfig.class.php
@@ -662,6 +662,8 @@ class DefaultConfig {
 							'name' => 'Dracula',
 							'main_title_background_color' => '#44475a',
 							'main_title_text_color' => '#f8f8f2',
+							'nav_title_background_color' => '#44475a',
+							'nav_title_text_color' => '#f8f8f2',
 							'text_color' => '#f8f8f2',
 							'background_color' => '#282a36',
 							'inactive_background_color' => '#44475a',
@@ -681,11 +683,14 @@ class DefaultConfig {
 					'moorweide' =>
 						[ 
 							'name' => 'Moorweide',
-							'main_title_background_color' => '#edf7f2',
-							'main_title_text_color' => '#005f52',
+							'main_title_background_color' => 'rgb(237, 246, 242)',
+							'main_title_text_color' => 'rgb(0, 94, 82)',
 							'text_color' => 'black',
 							'background_color' => '#edf7f2',
 							'inactive_background_color' => 'white',
+							'image_color' => '#00a075',
+							'nav_background_color' => 'rgb(0, 94, 82)',
+							'nav_text_color' => 'white',
 						],
 					'dark' =>
 						[ 
diff --git a/modules/cms/ui/themes/ThemeStyle.class.php b/modules/cms/ui/themes/ThemeStyle.class.php
@@ -90,11 +90,6 @@ class ThemeStyle
 		if   ( ! $this->inactiveBackgroundColor )
 			$this->inactiveBackgroundColor = $this->backgroundColor;
 
-		if   ( ! $this->navTitleTextColor )
-			$this->navTitleTextColor= $this->mainTitleTextColor;
-
-		if   ( ! $this->navTitleBackgroundColor )
-			$this->navTitleBackgroundColor = $this->mainTitleBackgroundColor;
 
 		if   ( ! $this->navTextColor )
 			$this->navTextColor = $this->mainTextColor;
@@ -102,6 +97,12 @@ class ThemeStyle
 		if   ( ! $this->navBackgroundColor )
 			$this->navBackgroundColor = $this->mainBackgroundColor;
 
+		if   ( ! $this->navTitleTextColor )
+			$this->navTitleTextColor= $this->navTextColor;
+
+		if   ( ! $this->navTitleBackgroundColor )
+			$this->navTitleBackgroundColor = $this->navBackgroundColor;
+
 
 		if   ( ! $this->dialogTitleTextColor )
 			$this->dialogTitleTextColor = $this->mainTitleTextColor;
diff --git a/modules/cms/ui/themes/default/style/theme/openrat-theme.less b/modules/cms/ui/themes/default/style/theme/openrat-theme.less
@@ -45,21 +45,47 @@ html.or-theme-@{cms-theme-id} {
         box-shadow: @x @y @radius @color;
     }
 
-    scrollbar-face-color: @cms-main-title-background-color;
-    scrollbar-arrow-color: @cms-main-title-background-color;
-    scrollbar-base-color: @cms-main-title-text-color;
 
-    scrollbar-color: @cms-main-title-text-color @cms-main-background-color;
-    scrollbar-width: thin;
 
-    * {
+
+  * {
       transition: opacity @cms-transition-duration ease-in-out;
       transition: width   @cms-transition-duration ease-in-out;
+      transition: flex    @cms-transition-duration ease-in-out;
     }
 
 
     .or {
 
+        &-workbench {
+          &-navigation {
+            scrollbar-face-color: mix(@cms-nav-text-color,@cms-nav-background-color);
+            scrollbar-arrow-color: @cms-image-color;
+            scrollbar-base-color: @cms-nav-background-color;
+
+            scrollbar-color: mix(@cms-nav-text-color,@cms-nav-background-color) @cms-nav-background-color;
+            scrollbar-width: thin;
+
+          }
+          &-main {
+            scrollbar-face-color: mix(@cms-main-text-color,@cms-main-background-color);
+            scrollbar-arrow-color: @cms-image-color;
+            scrollbar-base-color: @cms-main-text-color;
+
+            scrollbar-color: mix(@cms-main-text-color,@cms-main-background-color) @cms-main-background-color;
+            scrollbar-width: thin;
+          }
+        }
+
+      &-workbench {
+        &-navigation {
+          box-shadow: 1em 0 2em @cms-nav-background-color;
+        }
+      }
+      &-dialog-content {
+        box-shadow: -1em 0 2em @cms-dialog-background-color;
+      }
+
         &-image-icon {
           color: @cms-image-color;
         }
@@ -208,13 +234,19 @@ html.or-theme-@{cms-theme-id} {
             }*/
             &-navigation,
             &-navigation .or-link {
-                color: @cms-main-text-color;
+                color: @cms-nav-text-color;
             }
         }
 
       &-search {
         &-input {
-          border-color: @cms-nav-background-color;
+
+          border-color: @cms-nav-title-background-color;
+
+          .or-input {
+            background-color: @cms-nav-title-background-color;
+            color: @cms-nav-title-text-color;
+          }
         }
 
         &-result {
@@ -298,30 +330,30 @@ html.or-theme-@{cms-theme-id} {
                 color: inherit;
             }
 
-            .box-shadow(3px, 2px, 5px, @cms-main-background-color);
-            border: 1px solid mix(@cms-main-background-color,@cms-inactive-background-color);
+            .box-shadow(3px, 2px, 5px, @cms-nav-background-color);
+            border: 1px solid mix(@cms-nav-background-color,@cms-inactive-background-color);
 
-            background-color: @cms-main-background-color;
-            color: @cms-main-text-color;
+            background-color: @cms-nav-background-color;
+            color: @cms-nav-text-color;
 
             &-entry {
 
-                background-color: @cms-main-background-color;
-                color: @cms-main-text-color;
+                background-color: @cms-nav-background-color;
+                color: @cms-nav-text-color;
 
                 &--inactive {
-                    color: mix(@cms-main-background-color, @cms-main-text-color, 40%);
+                    color: mix(@cms-nav-background-color, @cms-nav-text-color, 40%);
                 }
 
                 &--active:hover {
-                    background-color: @cms-main-text-color;
-                    color: @cms-main-background-color;
+                    background-color: @cms-nav-text-color;
+                    color: @cms-nav-background-color;
                 }
             }
 
 
             &-divide {
-                background-color: mix(@cms-main-background-color,@cms-inactive-background-color);
+                background-color: mix(@cms-nav-background-color,@cms-nav-background-color);
             }
         }