@innovastudio/contentbuilder 1.0.80 → 1.0.81

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@innovastudio/contentbuilder",
-  "version": "1.0.80",
+  "version": "1.0.81",
   "description": "",
   "main": "public/contentbuilder/contentbuilder.esm.js",
   "files": [

package/public/contentbuilder/contentbuilder.css

@@ -195,6 +195,7 @@ button:focus {
   font-size: 13px;
   letter-spacing: 1px;
   font-weight: 300px;
+  /*  general use */
   /*
   .rte-align-options,
   .rte-formatting-options,
@@ -543,6 +544,40 @@ button:focus {
 .is-ui .is-elementrte-tool > div:not(.is-draggable) {
   padding: 8px 10px 8px 10px;
 }
+#_cbhtml .is-general-options,
+.is-ui .is-general-options {
+  color: #000;
+  background: #fff;
+}
+#_cbhtml .is-general-options button,
+#_cbhtml .is-general-options div[role=button],
+.is-ui .is-general-options button,
+.is-ui .is-general-options div[role=button] {
+  background-color: transparent;
+  color: #121212;
+  width: 45px;
+  height: 40px;
+  margin: 0;
+  box-shadow: none;
+}
+#_cbhtml .is-general-options button.on,
+#_cbhtml .is-general-options div[role=button].on,
+.is-ui .is-general-options button.on,
+.is-ui .is-general-options div[role=button].on {
+  background: whitesmoke;
+}
+#_cbhtml .is-general-options button:hover,
+#_cbhtml .is-general-options div[role=button]:hover,
+.is-ui .is-general-options button:hover,
+.is-ui .is-general-options div[role=button]:hover {
+  background: whitesmoke !important;
+}
+#_cbhtml .is-general-options button svg,
+#_cbhtml .is-general-options div[role=button] svg,
+.is-ui .is-general-options button svg,
+.is-ui .is-general-options div[role=button] svg {
+  fill: #000;
+}
 #_cbhtml .is-rte-tool,
 #_cbhtml .is-elementrte-tool,
 #_cbhtml .is-rte-pop.rte-more-options,
@@ -557,6 +592,51 @@ button:focus {
   background: #fff;
   box-shadow: rgba(0, 0, 0, 0.05) 0px 5px 9px 0px;
 }
+#_cbhtml .is-rte-tool div[role=button],
+#_cbhtml .is-elementrte-tool div[role=button],
+#_cbhtml .is-rte-pop.rte-more-options div[role=button],
+#_cbhtml .is-rte-pop.elementrte-more-options div[role=button],
+.is-ui .is-rte-tool div[role=button],
+.is-ui .is-elementrte-tool div[role=button],
+.is-ui .is-rte-pop.rte-more-options div[role=button],
+.is-ui .is-rte-pop.elementrte-more-options div[role=button] {
+  background-color: transparent;
+  color: #121212;
+  width: 45px;
+  height: 40px;
+  margin: 0;
+  box-shadow: none;
+}
+#_cbhtml .is-rte-tool div[role=button].on,
+#_cbhtml .is-elementrte-tool div[role=button].on,
+#_cbhtml .is-rte-pop.rte-more-options div[role=button].on,
+#_cbhtml .is-rte-pop.elementrte-more-options div[role=button].on,
+.is-ui .is-rte-tool div[role=button].on,
+.is-ui .is-elementrte-tool div[role=button].on,
+.is-ui .is-rte-pop.rte-more-options div[role=button].on,
+.is-ui .is-rte-pop.elementrte-more-options div[role=button].on {
+  background: whitesmoke;
+}
+#_cbhtml .is-rte-tool div[role=button]:hover,
+#_cbhtml .is-elementrte-tool div[role=button]:hover,
+#_cbhtml .is-rte-pop.rte-more-options div[role=button]:hover,
+#_cbhtml .is-rte-pop.elementrte-more-options div[role=button]:hover,
+.is-ui .is-rte-tool div[role=button]:hover,
+.is-ui .is-elementrte-tool div[role=button]:hover,
+.is-ui .is-rte-pop.rte-more-options div[role=button]:hover,
+.is-ui .is-rte-pop.elementrte-more-options div[role=button]:hover {
+  background: whitesmoke;
+}
+#_cbhtml .is-rte-tool div[role=button] svg,
+#_cbhtml .is-elementrte-tool div[role=button] svg,
+#_cbhtml .is-rte-pop.rte-more-options div[role=button] svg,
+#_cbhtml .is-rte-pop.elementrte-more-options div[role=button] svg,
+.is-ui .is-rte-tool div[role=button] svg,
+.is-ui .is-elementrte-tool div[role=button] svg,
+.is-ui .is-rte-pop.rte-more-options div[role=button] svg,
+.is-ui .is-rte-pop.elementrte-more-options div[role=button] svg {
+  fill: #000;
+}
 #_cbhtml .is-rte-tool button,
 #_cbhtml .is-elementrte-tool button,
 #_cbhtml .is-rte-pop.rte-more-options button,

package/public/contentbuilder/contentbuilder.esm.js

@@ -253,14 +253,26 @@ class Util {
     }
   }
 
-  confirm(message, callback) {
+  confirm(message, callback, yesno, yestext) {
     const dom = this.dom;
-    let html = `<div class="is-modal is-confirm">
+    let html = '';
+    html = `<div class="is-modal is-confirm">
             <div class="is-modal-content" style="padding-bottom:20px;">
                 <p>${message}</p>
                 <button title="${this.out('Delete')}" class="input-ok classic">${this.out('Delete')}</button>
             </div>
         </div>`;
+
+    if (yesno) {
+      html = `<div class="is-modal is-confirm">
+                <div class="is-modal-content" style="padding-bottom:20px;">
+                    <p>${message}</p>
+                    <button title="${this.out('Cancel')}" class="input-cancel classic-secondary">${this.out('Cancel')}</button>
+                    <button title="${yestext}" class="input-ok classic-primary">${yestext}</button>
+                </div>
+            </div>`;
+    }
+
     const builderStuff = this.builder.builderStuff;
     let confirmmodal = builderStuff.querySelector('.is-confirm');
 
@@ -283,6 +295,16 @@ class Util {
 
       callback(true);
     });
+    let buttoncancel = confirmmodal.querySelector('.is-confirm .input-cancel');
+    dom.addEventListener(buttoncancel, 'click', e => {
+      this.hideModal(confirmmodal);
+      confirmmodal.parentNode.removeChild(confirmmodal); //remove modal
+      //do task
+
+      callback(false);
+      e.preventDefault();
+      e.stopImmediatePropagation();
+    });
   }
   /*
   Note: