#1898 [admin-theme] Theme Options

addons/default/visiosoft/defaultadmin-theme/resources/config/settings.php

@@ -6,4 +6,34 @@ return [
         'type'       => 'anomaly.field_type.textarea',
         'input_view' => 'visiosoft.theme.defaultadmin::admin/navigation/settings',
     ],
+    "icon" => [
+        "type"   => "anomaly.field_type.file",
+        "config" => [
+            "folders"       => ['images'],
+        ]
+    ],
+    "title" => [
+        "type"   => "anomaly.field_type.text",
+        "config" => [
+            "default_value" => 'OpenClassify',
+        ]
+    ],
+    "sidebar_main_color" => [
+        "type"   => "anomaly.field_type.colorpicker",
+        "config" => [
+            "default_value" => '#252525',
+        ]
+    ],
+    "sidebar_secondary_color" => [
+        "type"   => "anomaly.field_type.colorpicker",
+        "config" => [
+            "default_value" => '#333333',
+        ]
+    ],
+    "active_sidebar_border_color" => [
+        "type"   => "anomaly.field_type.colorpicker",
+        "config" => [
+            "default_value" => '#c61db4',
+        ]
+    ],
 ];

addons/default/visiosoft/defaultadmin-theme/resources/css/theme.css

@@ -26,7 +26,7 @@
   margin-top: 0;
   position: fixed;
   overflow-x: scroll;
-  background: #333333;
+  background: {{ setting_value('visiosoft.theme.defaultadmin::sidebar_secondary_color') }};
   padding-bottom: 70px;
   box-shadow: 2px 0 0 rgba(66, 66, 66, 0.1);
 }
@@ -218,8 +218,8 @@
 #topbar .logo span {
   display: none;
 }
-#topbar .logo svg {
+#topbar .logo svg, #topbar .logo img {
-  width: 22px;
+  max-width: 40px;
   height: 40px;
   margin-top: -9px;
   vertical-align: middle;
@@ -398,7 +398,7 @@ body.expand #topbar .topbar-left .logo span {
   position: fixed;
   overflow-x: scroll;
   overflow-y: hidden;
-  background: #252525;
+  background: {{ setting_value('visiosoft.theme.defaultadmin::sidebar_main_color') }};
   padding-bottom: 70px;
   transition: width 200ms cubic-bezier(0.075, 0.82, 0.165, 1);
 }
@@ -456,9 +456,9 @@ body.expand #topbar .topbar-left .logo span {
   display: none;
 }
 #sidebar > ul > li.active {
-  background: #333333;
+  background: {{ setting_value('visiosoft.theme.defaultadmin::sidebar_secondary_color') }};
   box-sizing: border-box;
-  border-left: 3px solid #ffffff;
+  border-left: 3px solid {{ setting_value('visiosoft.theme.defaultadmin::active_sidebar_border_color') }} !important;
 }
 #sidebar > ul > li.active a {
   color: #eeeeee;
@@ -2625,9 +2625,9 @@ body {
 #login .login-container .logo {
   display: none;
 }
-#login .login-container .logo svg {
+#login .login-container .logo svg, #login .login-container .logo img {
   width: 45px;
-  height: 82px;
+  max-height: 82px;
   fill: #ffffff;
   margin-top: -30px;
   vertical-align: middle;
@@ -2665,9 +2665,9 @@ body {
   text-align: center;
   font-family: "Montserrat", sans-serif;
 }
-#login .logo svg {
+#login .logo svg, #login .logo img {
   width: 45px;
-  height: 82px;
+  max-height: 82px;
   margin-top: -30px;
   vertical-align: middle;
 }
@@ -2719,9 +2719,9 @@ body {
     display: inherit;
     margin-bottom: 2rem;
   }
-  #login .login-container .logo svg {
+  #login .login-container .logo svg, #login .login-container .logo img {
     width: 55px;
-    height: 100px;
+    max-height: 100px;
   }
 }
 @media (max-width: 767px) {

addons/default/visiosoft/defaultadmin-theme/resources/lang/en/setting.php

@@ -11,4 +11,19 @@ return [
         'warning'      => 'The first accessible navigation item is used as the <strong>home</strong> area.',
         'reorder'      => 'Drag and drop the primary navigation items in the <strong>sidebar</strong> to reorder them.',
     ],
+    "icon" => [
+        'name' => 'Icon',
+    ],
+    "title" => [
+        'name' => 'Title',
+    ],
+    "sidebar_main_color" => [
+        'name' => 'Sidebar Main Color',
+    ],
+    "sidebar_secondary_color" => [
+        'name' => 'Sidebar Secondary Color',
+    ],
+    "active_sidebar_border_color" => [
+        'name' => 'Active Sidebar Border Color',
+    ]
 ];

addons/default/visiosoft/defaultadmin-theme/resources/views/login.twig

@@ -4,8 +4,12 @@
 
     <div class="logo-container">
         <div class="logo">
-            {{ img('theme::img/icon.svg').data|raw }}
+            {% if setting_value('visiosoft.theme.defaultadmin::icon') %}
-            OpenClassify
+                <img src="{{ file(setting_value('visiosoft.theme.defaultadmin::icon')).url }}" alt="site icon">
+            {% else %}
+                {{ img('theme::img/icon.svg').data|raw }}
+            {% endif %}
+            {{ setting_value('visiosoft.theme.defaultadmin::title') }}
         </div>
         <div class="overlay"></div>
     </div>
@@ -14,7 +18,11 @@
         <div class="login-wrapper container-fluid">
 
             <div class="logo">
-                {{ img('theme::img/icon.svg').data|raw }}
+                {% if setting_value('visiosoft.theme.defaultadmin::icon') %}
+                    <img src="{{ file(setting_value('visiosoft.theme.defaultadmin::icon')).url }}" alt="site icon">
+                {% else %}
+                    {{ img('theme::img/icon.svg').data|raw }}
+                {% endif %}
             </div>
 
             <div class="col-sm-12 offset-sm-6">

addons/default/visiosoft/defaultadmin-theme/resources/views/partials/topbar.twig

@@ -2,8 +2,12 @@
 
     <div class="topbar-left">
         <a href="/admin" class="logo variant-logo">
-            {{ img('theme::img/icon.svg').data|raw }}
+            {% if setting_value('visiosoft.theme.defaultadmin::icon') %}
-            <span>OpenClassify</span>
+                <img src="{{ file(setting_value('visiosoft.theme.defaultadmin::icon')).url }}" alt="site icon">
+            {% else %}
+                {{ img('theme::img/icon.svg').data|raw }}
+            {% endif %}
+            <span>{{ setting_value('visiosoft.theme.defaultadmin::title') }}</span>
         </a>
     </div>