@innovastudio/contentbuilder 1.4.150 → 1.5.0

package/public/contentbuilder/lang/en.js

@@ -472,4 +472,12 @@ _txt["Please select a block or content."] = "Please select a block or content.";
 _txt["Edit Selected Block'"] = "Edit Selected Block'";
 _txt["Ask Questions"] = "Ask Questions";
 _txt["Auto select \'Edit Selected Block\' mode."] = "Auto select \'Edit Selected Block\' mode.";
-_txt["Auto send command delay"] = "Auto send command delay";
+_txt["Auto send command delay"] = "Auto send command delay";
+_txt["Edit Selected Text"] = "Edit Selected Text";
+_txt["Block"] = "Block";
+_txt["Please select a block."] = "Please select a block.";
+_txt["Remove Content/Text"] = "Remove Content/Text";
+_txt["Clear Breakpoints"] = "Clear Breakpoints";
+_txt["Type to search..."] = "Type to search...";
+_txt["Embed SVG"] = "Embed SVG";
+_txt["SVG"] = "SVG";

package/public/contentbuilder/lang/fr.js

@@ -472,4 +472,12 @@ _txt["Please select a block or content."] = "Please select a block or content.";
 _txt["Edit Selected Block'"] = "Edit Selected Block'";
 _txt["Ask Questions"] = "Ask Questions";
 _txt["Auto select \'Edit Selected Block\' mode."] = "Auto select \'Edit Selected Block\' mode.";
-_txt["Auto send command delay"] = "Auto send command delay";
+_txt["Auto send command delay"] = "Auto send command delay";
+_txt["Edit Selected Text"] = "Edit Selected Text";
+_txt["Block"] = "Block";
+_txt["Please select a block."] = "Please select a block.";
+_txt["Remove Content/Text"] = "Remove Content/Text";
+_txt["Clear Breakpoints"] = "Clear Breakpoints";
+_txt["Type to search..."] = "Type to search...";
+_txt["Embed SVG"] = "Embed SVG";
+_txt["SVG"] = "SVG";

package/public/contentbuilder/themes/colored-blue.css

@@ -401,6 +401,28 @@
 .colored .is-ui .is-rte-pop.rte-textsetting-options button:focus {
   background: #0095f0;
 }
+.colored #_cbhtml .is-rte-pop.rte-icon-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-icon-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(0, 104, 169, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(118, 203, 255, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-fontfamily-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(0, 104, 169, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(118, 203, 255, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
 .colored #_cbhtml .is-rte-pop.rte-color-picker button,
 .colored .is-ui .is-rte-pop.rte-color-picker button {
   color: rgba(255, 255, 255, 0.95);
@@ -678,6 +700,18 @@
 .colored .is-ui .is-modal.pickcolor .is-color-preview {
   border: transparent 1px solid;
 }
+.colored #_cbhtml .is-modal.snippetwindow,
+.colored .is-ui .is-modal.snippetwindow {
+  background-color: #e8e8e8;
+}
+.colored #_cbhtml .is-modal.snippetwindow .is-modal-bar,
+.colored .is-ui .is-modal.snippetwindow .is-modal-bar {
+  background-color: rgba(255, 255, 255, 0.12);
+}
+.colored #_cbhtml .is-modal.snippetwindow .select-styled,
+.colored .is-ui .is-modal.snippetwindow .select-styled {
+  border-bottom: 1px solid #bababa38;
+}
 .colored #_cbhtml .is-modal.pickcolormore div.is-modal-content > div,
 .colored .is-ui .is-modal.pickcolormore div.is-modal-content > div {
   opacity: 0.9;
@@ -752,26 +786,26 @@
 .colored .is-ui .is-tool.is-table-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button,
+.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button, .colored #_cbhtml .is-tool.is-svg-tool > button,
 .colored .is-ui .is-tool.is-code-tool > button,
-.colored .is-ui .is-tool.is-module-tool > button {
+.colored .is-ui .is-tool.is-module-tool > button,
+.colored .is-ui .is-tool.is-svg-tool > button {
   background: #eaeaea;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg,
+.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg, .colored #_cbhtml .is-tool.is-svg-tool > button svg,
 .colored .is-ui .is-tool.is-code-tool > button svg,
-.colored .is-ui .is-tool.is-module-tool > button svg {
+.colored .is-ui .is-tool.is-module-tool > button svg,
+.colored .is-ui .is-tool.is-svg-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button, .colored #_cbhtml .is-tool#divSvgTool button,
+.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button,
 .colored .is-ui .is-tool#divLinkTool button,
-.colored .is-ui .is-tool#divButtonTool button,
-.colored .is-ui .is-tool#divSvgTool button {
+.colored .is-ui .is-tool#divButtonTool button {
   background: #eaeaea;
 }
-.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg, .colored #_cbhtml .is-tool#divSvgTool button svg,
+.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg,
 .colored .is-ui .is-tool#divLinkTool button svg,
-.colored .is-ui .is-tool#divButtonTool button svg,
-.colored .is-ui .is-tool#divSvgTool button svg {
+.colored .is-ui .is-tool#divButtonTool button svg {
   fill: #000;
 }
 .colored #_cbhtml #divImageProgress,
@@ -1018,49 +1052,6 @@
 .colored .is-ui .is-selectbox-options > div.selected {
   background: rgba(255, 255, 255, 0.38);
 }
-.colored #_cbhtml .is-dropdown .dropdown-toggle,
-.colored .is-ui .is-dropdown .dropdown-toggle {
-  color: #000;
-  background: #d6d6d6;
-  box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.03);
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle:hover,
-.colored .is-ui .is-dropdown .dropdown-toggle:hover {
-  background: #d9d9d9;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle svg,
-.colored .is-ui .is-dropdown .dropdown-toggle svg {
-  fill: #000;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle::after,
-.colored .is-ui .is-dropdown .dropdown-toggle::after {
-  border-top-color: #000;
-  border-bottom-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle.active::after,
-.colored .is-ui .is-dropdown .dropdown-toggle.active::after {
-  border-bottom-color: #000;
-  border-top-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu,
-.colored .is-ui .is-dropdown .dropdown-menu {
-  border: transparent 1px solid;
-  background-color: #d6d6d6;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li,
-.colored .is-ui .is-dropdown .dropdown-menu li {
-  color: #000;
-  background-color: #d6d6d6;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li:hover, .colored #_cbhtml .is-dropdown .dropdown-menu li:focus,
-.colored .is-ui .is-dropdown .dropdown-menu li:hover,
-.colored .is-ui .is-dropdown .dropdown-menu li:focus {
-  background: rgba(255, 255, 255, 0.38);
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li.selected,
-.colored .is-ui .is-dropdown .dropdown-menu li.selected {
-  background: rgba(255, 255, 255, 0.38);
-}
 .colored #_cbhtml .elementstyles .elm-list,
 .colored .is-ui .elementstyles .elm-list {
   color: rgba(0, 0, 0, 0.95);
@@ -1275,3 +1266,23 @@
 .colored .scroll-darker *::-webkit-scrollbar-thumb {
   background-color: rgba(78, 78, 78, 0.62);
 }
+.colored .custom-select .select-styled span {
+  color: #000;
+}
+.colored .custom-select input {
+  background: #d6d6d6;
+}
+.colored .custom-select .select-options {
+  border: transparent 1px solid;
+  background-color: #d6d6d6;
+  color: #000;
+}
+.colored .custom-select .select-options li {
+  color: #000;
+}
+.colored .custom-select .select-options li:hover {
+  background-color: rgba(255, 255, 255, 0.38);
+}
+.colored .custom-select .select-options li.selected {
+  background-color: rgba(255, 255, 255, 0.38);
+}

package/public/contentbuilder/themes/colored-blue2.css

@@ -401,6 +401,28 @@
 .colored .is-ui .is-rte-pop.rte-textsetting-options button:focus {
   background: #4f5dcd;
 }
+.colored #_cbhtml .is-rte-pop.rte-icon-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-icon-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(47, 60, 166, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(182, 188, 235, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-fontfamily-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(47, 60, 166, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(182, 188, 235, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
 .colored #_cbhtml .is-rte-pop.rte-color-picker button,
 .colored .is-ui .is-rte-pop.rte-color-picker button {
   color: rgba(255, 255, 255, 0.95);
@@ -678,6 +700,18 @@
 .colored .is-ui .is-modal.pickcolor .is-color-preview {
   border: transparent 1px solid;
 }
+.colored #_cbhtml .is-modal.snippetwindow,
+.colored .is-ui .is-modal.snippetwindow {
+  background-color: #e9eaee;
+}
+.colored #_cbhtml .is-modal.snippetwindow .is-modal-bar,
+.colored .is-ui .is-modal.snippetwindow .is-modal-bar {
+  background-color: rgba(255, 255, 255, 0.12);
+}
+.colored #_cbhtml .is-modal.snippetwindow .select-styled,
+.colored .is-ui .is-modal.snippetwindow .select-styled {
+  border-bottom: 1px solid #bababa38;
+}
 .colored #_cbhtml .is-modal.pickcolormore div.is-modal-content > div,
 .colored .is-ui .is-modal.pickcolormore div.is-modal-content > div {
   opacity: 0.9;
@@ -752,26 +786,26 @@
 .colored .is-ui .is-tool.is-table-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button,
+.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button, .colored #_cbhtml .is-tool.is-svg-tool > button,
 .colored .is-ui .is-tool.is-code-tool > button,
-.colored .is-ui .is-tool.is-module-tool > button {
+.colored .is-ui .is-tool.is-module-tool > button,
+.colored .is-ui .is-tool.is-svg-tool > button {
   background: #eaebf1;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg,
+.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg, .colored #_cbhtml .is-tool.is-svg-tool > button svg,
 .colored .is-ui .is-tool.is-code-tool > button svg,
-.colored .is-ui .is-tool.is-module-tool > button svg {
+.colored .is-ui .is-tool.is-module-tool > button svg,
+.colored .is-ui .is-tool.is-svg-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button, .colored #_cbhtml .is-tool#divSvgTool button,
+.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button,
 .colored .is-ui .is-tool#divLinkTool button,
-.colored .is-ui .is-tool#divButtonTool button,
-.colored .is-ui .is-tool#divSvgTool button {
+.colored .is-ui .is-tool#divButtonTool button {
   background: #eaebf1;
 }
-.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg, .colored #_cbhtml .is-tool#divSvgTool button svg,
+.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg,
 .colored .is-ui .is-tool#divLinkTool button svg,
-.colored .is-ui .is-tool#divButtonTool button svg,
-.colored .is-ui .is-tool#divSvgTool button svg {
+.colored .is-ui .is-tool#divButtonTool button svg {
   fill: #000;
 }
 .colored #_cbhtml #divImageProgress,
@@ -1018,49 +1052,6 @@
 .colored .is-ui .is-selectbox-options > div.selected {
   background: rgba(255, 255, 255, 0.38);
 }
-.colored #_cbhtml .is-dropdown .dropdown-toggle,
-.colored .is-ui .is-dropdown .dropdown-toggle {
-  color: #000;
-  background: #bdc4ed;
-  box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.03);
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle:hover,
-.colored .is-ui .is-dropdown .dropdown-toggle:hover {
-  background: #c1c8ee;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle svg,
-.colored .is-ui .is-dropdown .dropdown-toggle svg {
-  fill: #000;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle::after,
-.colored .is-ui .is-dropdown .dropdown-toggle::after {
-  border-top-color: #000;
-  border-bottom-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle.active::after,
-.colored .is-ui .is-dropdown .dropdown-toggle.active::after {
-  border-bottom-color: #000;
-  border-top-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu,
-.colored .is-ui .is-dropdown .dropdown-menu {
-  border: transparent 1px solid;
-  background-color: #bdc4ed;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li,
-.colored .is-ui .is-dropdown .dropdown-menu li {
-  color: #000;
-  background-color: #bdc4ed;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li:hover, .colored #_cbhtml .is-dropdown .dropdown-menu li:focus,
-.colored .is-ui .is-dropdown .dropdown-menu li:hover,
-.colored .is-ui .is-dropdown .dropdown-menu li:focus {
-  background: rgba(255, 255, 255, 0.38);
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li.selected,
-.colored .is-ui .is-dropdown .dropdown-menu li.selected {
-  background: rgba(255, 255, 255, 0.38);
-}
 .colored #_cbhtml .elementstyles .elm-list,
 .colored .is-ui .elementstyles .elm-list {
   color: rgba(0, 0, 0, 0.95);
@@ -1275,3 +1266,23 @@
 .colored .scroll-darker *::-webkit-scrollbar-thumb {
   background-color: rgba(78, 78, 78, 0.62);
 }
+.colored .custom-select .select-styled span {
+  color: #000;
+}
+.colored .custom-select input {
+  background: #bdc4ed;
+}
+.colored .custom-select .select-options {
+  border: transparent 1px solid;
+  background-color: #bdc4ed;
+  color: #000;
+}
+.colored .custom-select .select-options li {
+  color: #000;
+}
+.colored .custom-select .select-options li:hover {
+  background-color: rgba(255, 255, 255, 0.38);
+}
+.colored .custom-select .select-options li.selected {
+  background-color: rgba(255, 255, 255, 0.38);
+}

package/public/contentbuilder/themes/colored-blue3.css

@@ -401,6 +401,28 @@
 .colored .is-ui .is-rte-pop.rte-textsetting-options button:focus {
   background: #11c9ea;
 }
+.colored #_cbhtml .is-rte-pop.rte-icon-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-icon-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(12, 144, 168, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(138, 230, 246, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-fontfamily-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(12, 144, 168, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(138, 230, 246, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
 .colored #_cbhtml .is-rte-pop.rte-color-picker button,
 .colored .is-ui .is-rte-pop.rte-color-picker button {
   color: rgba(255, 255, 255, 0.95);
@@ -678,6 +700,18 @@
 .colored .is-ui .is-modal.pickcolor .is-color-preview {
   border: transparent 1px solid;
 }
+.colored #_cbhtml .is-modal.snippetwindow,
+.colored .is-ui .is-modal.snippetwindow {
+  background-color: #f0f1f2;
+}
+.colored #_cbhtml .is-modal.snippetwindow .is-modal-bar,
+.colored .is-ui .is-modal.snippetwindow .is-modal-bar {
+  background-color: rgba(255, 255, 255, 0.12);
+}
+.colored #_cbhtml .is-modal.snippetwindow .select-styled,
+.colored .is-ui .is-modal.snippetwindow .select-styled {
+  border-bottom: 1px solid #bababa38;
+}
 .colored #_cbhtml .is-modal.pickcolormore div.is-modal-content > div,
 .colored .is-ui .is-modal.pickcolormore div.is-modal-content > div {
   opacity: 0.9;
@@ -752,26 +786,26 @@
 .colored .is-ui .is-tool.is-table-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button,
+.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button, .colored #_cbhtml .is-tool.is-svg-tool > button,
 .colored .is-ui .is-tool.is-code-tool > button,
-.colored .is-ui .is-tool.is-module-tool > button {
+.colored .is-ui .is-tool.is-module-tool > button,
+.colored .is-ui .is-tool.is-svg-tool > button {
   background: #ecf2f3;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg,
+.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg, .colored #_cbhtml .is-tool.is-svg-tool > button svg,
 .colored .is-ui .is-tool.is-code-tool > button svg,
-.colored .is-ui .is-tool.is-module-tool > button svg {
+.colored .is-ui .is-tool.is-module-tool > button svg,
+.colored .is-ui .is-tool.is-svg-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button, .colored #_cbhtml .is-tool#divSvgTool button,
+.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button,
 .colored .is-ui .is-tool#divLinkTool button,
-.colored .is-ui .is-tool#divButtonTool button,
-.colored .is-ui .is-tool#divSvgTool button {
+.colored .is-ui .is-tool#divButtonTool button {
   background: #ecf2f3;
 }
-.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg, .colored #_cbhtml .is-tool#divSvgTool button svg,
+.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg,
 .colored .is-ui .is-tool#divLinkTool button svg,
-.colored .is-ui .is-tool#divButtonTool button svg,
-.colored .is-ui .is-tool#divSvgTool button svg {
+.colored .is-ui .is-tool#divButtonTool button svg {
   fill: #000;
 }
 .colored #_cbhtml #divImageProgress,
@@ -1018,49 +1052,6 @@
 .colored .is-ui .is-selectbox-options > div.selected {
   background: rgba(255, 255, 255, 0.38);
 }
-.colored #_cbhtml .is-dropdown .dropdown-toggle,
-.colored .is-ui .is-dropdown .dropdown-toggle {
-  color: #000;
-  background: #d6ecf1;
-  box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.03);
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle:hover,
-.colored .is-ui .is-dropdown .dropdown-toggle:hover {
-  background: #daeef2;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle svg,
-.colored .is-ui .is-dropdown .dropdown-toggle svg {
-  fill: #000;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle::after,
-.colored .is-ui .is-dropdown .dropdown-toggle::after {
-  border-top-color: #000;
-  border-bottom-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle.active::after,
-.colored .is-ui .is-dropdown .dropdown-toggle.active::after {
-  border-bottom-color: #000;
-  border-top-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu,
-.colored .is-ui .is-dropdown .dropdown-menu {
-  border: transparent 1px solid;
-  background-color: #d6ecf1;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li,
-.colored .is-ui .is-dropdown .dropdown-menu li {
-  color: #000;
-  background-color: #d6ecf1;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li:hover, .colored #_cbhtml .is-dropdown .dropdown-menu li:focus,
-.colored .is-ui .is-dropdown .dropdown-menu li:hover,
-.colored .is-ui .is-dropdown .dropdown-menu li:focus {
-  background: rgba(255, 255, 255, 0.38);
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li.selected,
-.colored .is-ui .is-dropdown .dropdown-menu li.selected {
-  background: rgba(255, 255, 255, 0.38);
-}
 .colored #_cbhtml .elementstyles .elm-list,
 .colored .is-ui .elementstyles .elm-list {
   color: rgba(0, 0, 0, 0.95);
@@ -1275,3 +1266,23 @@
 .colored .scroll-darker *::-webkit-scrollbar-thumb {
   background-color: rgba(78, 78, 78, 0.62);
 }
+.colored .custom-select .select-styled span {
+  color: #000;
+}
+.colored .custom-select input {
+  background: #d6ecf1;
+}
+.colored .custom-select .select-options {
+  border: transparent 1px solid;
+  background-color: #d6ecf1;
+  color: #000;
+}
+.colored .custom-select .select-options li {
+  color: #000;
+}
+.colored .custom-select .select-options li:hover {
+  background-color: rgba(255, 255, 255, 0.38);
+}
+.colored .custom-select .select-options li.selected {
+  background-color: rgba(255, 255, 255, 0.38);
+}

package/public/contentbuilder/themes/colored-blue4.css

@@ -401,6 +401,28 @@
 .colored .is-ui .is-rte-pop.rte-textsetting-options button:focus {
   background: #7787dd;
 }
+.colored #_cbhtml .is-rte-pop.rte-icon-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-icon-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(62, 85, 207, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(225, 229, 248, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-icon-options #inpRteIconSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options input[type=text],
+.colored .is-ui .is-rte-pop.rte-fontfamily-options input[type=text] {
+  color: rgba(255, 255, 255, 0.95);
+  background: rgba(62, 85, 207, 0.4);
+  border: none;
+  border-bottom: 1px solid rgba(225, 229, 248, 0.45);
+}
+.colored #_cbhtml .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder,
+.colored .is-ui .is-rte-pop.rte-fontfamily-options #inpRteFontSearch::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
 .colored #_cbhtml .is-rte-pop.rte-color-picker button,
 .colored .is-ui .is-rte-pop.rte-color-picker button {
   color: rgba(255, 255, 255, 0.95);
@@ -678,6 +700,18 @@
 .colored .is-ui .is-modal.pickcolor .is-color-preview {
   border: transparent 1px solid;
 }
+.colored #_cbhtml .is-modal.snippetwindow,
+.colored .is-ui .is-modal.snippetwindow {
+  background-color: #e0e3e9;
+}
+.colored #_cbhtml .is-modal.snippetwindow .is-modal-bar,
+.colored .is-ui .is-modal.snippetwindow .is-modal-bar {
+  background-color: rgba(255, 255, 255, 0.12);
+}
+.colored #_cbhtml .is-modal.snippetwindow .select-styled,
+.colored .is-ui .is-modal.snippetwindow .select-styled {
+  border-bottom: 1px solid #bababa38;
+}
 .colored #_cbhtml .is-modal.pickcolormore div.is-modal-content > div,
 .colored .is-ui .is-modal.pickcolormore div.is-modal-content > div {
   opacity: 0.9;
@@ -752,26 +786,26 @@
 .colored .is-ui .is-tool.is-table-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button,
+.colored #_cbhtml .is-tool.is-code-tool > button, .colored #_cbhtml .is-tool.is-module-tool > button, .colored #_cbhtml .is-tool.is-svg-tool > button,
 .colored .is-ui .is-tool.is-code-tool > button,
-.colored .is-ui .is-tool.is-module-tool > button {
+.colored .is-ui .is-tool.is-module-tool > button,
+.colored .is-ui .is-tool.is-svg-tool > button {
   background: #eaebf1;
 }
-.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg,
+.colored #_cbhtml .is-tool.is-code-tool > button svg, .colored #_cbhtml .is-tool.is-module-tool > button svg, .colored #_cbhtml .is-tool.is-svg-tool > button svg,
 .colored .is-ui .is-tool.is-code-tool > button svg,
-.colored .is-ui .is-tool.is-module-tool > button svg {
+.colored .is-ui .is-tool.is-module-tool > button svg,
+.colored .is-ui .is-tool.is-svg-tool > button svg {
   fill: #000;
 }
-.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button, .colored #_cbhtml .is-tool#divSvgTool button,
+.colored #_cbhtml .is-tool#divLinkTool button, .colored #_cbhtml .is-tool#divButtonTool button,
 .colored .is-ui .is-tool#divLinkTool button,
-.colored .is-ui .is-tool#divButtonTool button,
-.colored .is-ui .is-tool#divSvgTool button {
+.colored .is-ui .is-tool#divButtonTool button {
   background: #eaebf1;
 }
-.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg, .colored #_cbhtml .is-tool#divSvgTool button svg,
+.colored #_cbhtml .is-tool#divLinkTool button svg, .colored #_cbhtml .is-tool#divButtonTool button svg,
 .colored .is-ui .is-tool#divLinkTool button svg,
-.colored .is-ui .is-tool#divButtonTool button svg,
-.colored .is-ui .is-tool#divSvgTool button svg {
+.colored .is-ui .is-tool#divButtonTool button svg {
   fill: #000;
 }
 .colored #_cbhtml #divImageProgress,
@@ -1018,49 +1052,6 @@
 .colored .is-ui .is-selectbox-options > div.selected {
   background: rgba(255, 255, 255, 0.38);
 }
-.colored #_cbhtml .is-dropdown .dropdown-toggle,
-.colored .is-ui .is-dropdown .dropdown-toggle {
-  color: #000;
-  background: #e9ecf9;
-  box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.03);
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle:hover,
-.colored .is-ui .is-dropdown .dropdown-toggle:hover {
-  background: #edeffa;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle svg,
-.colored .is-ui .is-dropdown .dropdown-toggle svg {
-  fill: #000;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle::after,
-.colored .is-ui .is-dropdown .dropdown-toggle::after {
-  border-top-color: #000;
-  border-bottom-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-toggle.active::after,
-.colored .is-ui .is-dropdown .dropdown-toggle.active::after {
-  border-bottom-color: #000;
-  border-top-color: transparent;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu,
-.colored .is-ui .is-dropdown .dropdown-menu {
-  border: transparent 1px solid;
-  background-color: #e9ecf9;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li,
-.colored .is-ui .is-dropdown .dropdown-menu li {
-  color: #000;
-  background-color: #e9ecf9;
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li:hover, .colored #_cbhtml .is-dropdown .dropdown-menu li:focus,
-.colored .is-ui .is-dropdown .dropdown-menu li:hover,
-.colored .is-ui .is-dropdown .dropdown-menu li:focus {
-  background: rgba(255, 255, 255, 0.38);
-}
-.colored #_cbhtml .is-dropdown .dropdown-menu li.selected,
-.colored .is-ui .is-dropdown .dropdown-menu li.selected {
-  background: rgba(255, 255, 255, 0.38);
-}
 .colored #_cbhtml .elementstyles .elm-list,
 .colored .is-ui .elementstyles .elm-list {
   color: rgba(0, 0, 0, 0.95);
@@ -1275,3 +1266,23 @@
 .colored .scroll-darker *::-webkit-scrollbar-thumb {
   background-color: rgba(78, 78, 78, 0.62);
 }
+.colored .custom-select .select-styled span {
+  color: #000;
+}
+.colored .custom-select input {
+  background: #e9ecf9;
+}
+.colored .custom-select .select-options {
+  border: transparent 1px solid;
+  background-color: #e9ecf9;
+  color: #000;
+}
+.colored .custom-select .select-options li {
+  color: #000;
+}
+.colored .custom-select .select-options li:hover {
+  background-color: rgba(255, 255, 255, 0.38);
+}
+.colored .custom-select .select-options li.selected {
+  background-color: rgba(255, 255, 255, 0.38);
+}