#3574 Quill customization for any templates

modules/boonex/artificer/data/template/system/css/editor.less

@@ -1,2 +1,49 @@
 @import 'default.less';
-@import '../../../../../../../template/css/editor.less';
+@import '../../../../../../../template/css/editor.less';
+
+
+.bx-artificer .ql-container.ql-snow{
+    border-radius: 0 0 0.375rem 0.375rem;
+}
+.bx-artificer .ql-toolbar{
+    border-radius: 0.375rem 0.375rem 0 0;
+}
+.bx-artificer .ql-editor{
+    border-radius: 0 0 0.375rem 0.375rem;
+    background: #fff;
+}
+.bx-artificer .bx-form-input-html-quill-empty .ql-editor{
+    border-radius: 0.375rem;
+    min-height: 150px;
+}
+.bx-artificer .bx-form-input-html-quill-empty.ql-container.ql-snow{
+    border-radius: 0.375rem;
+}
+@media (prefers-color-scheme: dark) {
+	.bx-artificer .ql-stroke{
+		stroke: rgb(209, 213, 219) !important;
+	}
+	.bx-artificer .ql-fill{
+		fill: rgb(209, 213, 219) !important;
+	}
+	.bx-artificer .ql-picker{
+		color: rgb(209, 213, 219) !important;
+	}
+	.bx-artificer .ql-toolbar{
+        border-color: rgba(55,65,81,1) !important;
+	}
+    .bx-artificer .ql-container.ql-snow{
+        border-color: rgba(55,65,81,1) !important;
+    }
+	.bx-artificer .ql-editor{
+		background: rgb(17, 24, 39);
+		color: rgb(209, 213, 219);
+	}
+	.bx-artificer .ql-editor.ql-blank::before{
+	    color: rgba(255,255,255,0.6);
+	}
+    .bx-artificer .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{
+        background: rgb(17, 24, 39);
+		color: rgb(209, 213, 219);
+    }
+}

modules/boonex/decorous/data/template/system/css/editor.less

@@ -1,2 +1,12 @@
 @import 'default.less';
-@import '../../../../../../../template/css/editor.less';
+@import '../../../../../../../template/css/editor.less';
+
+// quill style
+.ql-toolbar.ql-snow{
+    border-radius: 0 !important;
+}
+.ql-toolbar.ql-snow,
+.ql-container.ql-snow{
+     border-color: #d9d9d9 !important; 
+}
+

modules/boonex/lucid/data/template/system/css/editor.less

@@ -1,2 +1,7 @@
 @import 'default.less';
-@import '../../../../../../../template/css/editor.less';
+@import '../../../../../../../template/css/editor.less';
+
+.ql-toolbar.ql-snow{
+    border: none !important;
+    border-bottom: 1px solid rgba(50, 100, 180, 0.2) !important;
+}

modules/boonex/ocean/data/template/system/css/editor.less

@@ -1,2 +1,13 @@
 @import 'default.less';
-@import '../../../../../../../template/css/editor.less';
+@import '../../../../../../../template/css/editor.less';
+
+.ql-toolbar.ql-snow{
+    border-radius: 0.3rem 0.3rem 0 0 !important;
+}
+.ql-toolbar.ql-snow,
+.ql-container.ql-snow{
+    border-color: #6097b0 !important; 
+    border-width:2px !important;
+}
+
+

modules/boonex/protean/data/template/system/css/editor.less

@@ -1,2 +1,6 @@
 @import 'default.less';
-@import '../../../../../../../template/css/editor.less';
+@import '../../../../../../../template/css/editor.less';
+
+.ql-toolbar.ql-snow, .ql-container{
+    border-color:rgba(136, 153, 170, 0.3) !important;
+}

template/scripts/BxBaseEditorQuill.php

@@ -86,12 +86,6 @@ class BxBaseEditorQuill extends BxDolEditor
             $sToolbarItems = $this->_sButtonsCustom;
         }
         
-        $sCss = 'editor.less';
-        $aCss = BxDolTemplate::getInstance()->_lessCss(array(
-        	'path' => $this->_oTemplate->getCssPath($sCss),
-        	'url' => $this->_oTemplate->getCssUrl($sCss)
-        ));
-        
         $sEditorName = 'quill_' . str_replace(['-', ' '], '_', $aAttrs['form_id'] . '_' . $aAttrs['element_name']);
         $this->_oTemplate->addJsTranslation([
             '_sys_txt_quill_tooltip_bold',
@@ -127,8 +121,7 @@ class BxBaseEditorQuill extends BxDolEditor
             'bx_var_element_name' => str_replace(['-', ' '], '_', $aAttrs['element_name']),
             'bx_var_editor_name' => $sEditorName,
             'bx_var_skin' => bx_js_string($this->_aObject['skin'], BX_ESCAPE_STR_APOS),
-            'bx_url_root' => bx_js_string(BX_DOL_URL_ROOT, BX_ESCAPE_STR_APOS),
-            'bx_var_css_path' => bx_js_string($aCss['url'], BX_ESCAPE_STR_APOS),
+            'bx_url_root' => bx_js_string(BX_DOL_URL_ROOT, BX_ESCAPE_STR_APOS)
         ));
 
         if ($bDynamicMode) {
@@ -205,13 +198,19 @@ class BxBaseEditorQuill extends BxDolEditor
             $sJsPrefixRoot  . $sJsSuffix . 'editor.quill.js',
         );
 
-        $aCss = array(
+        $sCss = 'editor.less';
+        $aCss = BxDolTemplate::getInstance()->_lessCss(array(
+        	'path' => $this->_oTemplate->getCssPath($sCss),
+        	'url' => $this->_oTemplate->getCssUrl($sCss)
+        ));
+        
+        $aCss = array_merge($aCss, array(
             BX_DIRECTORY_PATH_PLUGINS_PUBLIC . 'quill/|quill.' . $this->_aObject['skin'] . '.css',  
             BX_DIRECTORY_PATH_PLUGINS_PUBLIC . 'quill/|quill.mention.css', 
             BX_DIRECTORY_PATH_PLUGINS_PUBLIC . 'highlight/|default.min.css',
             BX_DIRECTORY_PATH_PLUGINS_PUBLIC . 'quill/quill.imageUploader.min.css',
             BX_DIRECTORY_PATH_BASE . 'css/|editor.quill.css',
-        );
+        ));
 
         return array($aJs, $aCss);
     }