@innovastudio/contentbuilder 1.4.15 → 1.4.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -4549,6 +4549,7 @@ button:focus-visible {
|
|
|
4549
4549
|
.row-active .is-col-tool {
|
|
4550
4550
|
display: flex;
|
|
4551
4551
|
width: auto;
|
|
4552
|
+
padding: 0 !important;
|
|
4552
4553
|
}
|
|
4553
4554
|
|
|
4554
4555
|
.is-builder[rowoutline] .row-active .is-col-tool {
|
|
@@ -4581,6 +4582,10 @@ button:focus-visible {
|
|
|
4581
4582
|
justify-content: center;
|
|
4582
4583
|
align-items: center;
|
|
4583
4584
|
background: #169af7;
|
|
4585
|
+
margin: 0;
|
|
4586
|
+
padding: 0;
|
|
4587
|
+
border: none;
|
|
4588
|
+
border-radius: 0;
|
|
4584
4589
|
}
|
|
4585
4590
|
.is-tool.is-row-tool .row-handle svg {
|
|
4586
4591
|
width: 13px;
|
|
@@ -4656,6 +4661,10 @@ button:focus-visible {
|
|
|
4656
4661
|
justify-content: center;
|
|
4657
4662
|
align-items: center;
|
|
4658
4663
|
background: transparent;
|
|
4664
|
+
margin: 0;
|
|
4665
|
+
padding: 0;
|
|
4666
|
+
border: none;
|
|
4667
|
+
border-radius: 0;
|
|
4659
4668
|
}
|
|
4660
4669
|
.is-builder[gray] .is-tool.is-row-tool .row-handle svg {
|
|
4661
4670
|
width: 11px;
|
|
@@ -6930,7 +6930,7 @@ class Util {
|
|
|
6930
6930
|
${this.getFontPreview()}
|
|
6931
6931
|
</ul>
|
|
6932
6932
|
|
|
6933
|
-
<script
|
|
6933
|
+
<script>
|
|
6934
6934
|
|
|
6935
6935
|
const close = () => {
|
|
6936
6936
|
parent.focus();
|
|
@@ -7173,7 +7173,7 @@ class Util {
|
|
|
7173
7173
|
<li role="option" tabindex="0" data-provider="" data-font-family="serif"><div></div><img src="${path}serif.png"></li>
|
|
7174
7174
|
</ul>
|
|
7175
7175
|
|
|
7176
|
-
<script
|
|
7176
|
+
<script>
|
|
7177
7177
|
|
|
7178
7178
|
const close = () => {
|
|
7179
7179
|
parent.focus();
|
|
@@ -7247,13 +7247,13 @@ class Util {
|
|
|
7247
7247
|
<title>Page</title>
|
|
7248
7248
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7249
7249
|
<meta name="description" content="">
|
|
7250
|
-
<link rel="shortcut icon" href="#"
|
|
7250
|
+
<link rel="shortcut icon" href="#">
|
|
7251
7251
|
|
|
7252
|
-
<link href="[%PATH%]/assets/minimalist-blocks/content.css" rel="stylesheet"
|
|
7252
|
+
<link href="[%PATH%]/assets/minimalist-blocks/content.css" rel="stylesheet">
|
|
7253
7253
|
|
|
7254
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet"
|
|
7255
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet"
|
|
7256
|
-
<script src="[%PATH%]/assets/scripts/glide/glide.js"
|
|
7254
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet">
|
|
7255
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet">
|
|
7256
|
+
<script src="[%PATH%]/assets/scripts/glide/glide.js"></script>
|
|
7257
7257
|
|
|
7258
7258
|
<style>
|
|
7259
7259
|
.container {
|
|
@@ -7283,13 +7283,13 @@ class Util {
|
|
|
7283
7283
|
<title>Page</title>
|
|
7284
7284
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7285
7285
|
<meta name="description" content="">
|
|
7286
|
-
<link rel="shortcut icon" href="#"
|
|
7286
|
+
<link rel="shortcut icon" href="#">
|
|
7287
7287
|
|
|
7288
|
-
<link href="[%PATH%]/assets/minimalist-blocks/content-tailwind.css" rel="stylesheet"
|
|
7288
|
+
<link href="[%PATH%]/assets/minimalist-blocks/content-tailwind.css" rel="stylesheet">
|
|
7289
7289
|
|
|
7290
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet"
|
|
7291
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet"
|
|
7292
|
-
<script src="[%PATH%]/assets/scripts/glide/glide.js"
|
|
7290
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet">
|
|
7291
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet">
|
|
7292
|
+
<script src="[%PATH%]/assets/scripts/glide/glide.js"></script>
|
|
7293
7293
|
|
|
7294
7294
|
<link rel="stylesheet" href="[%PATH%]/assets/frameworks/tailwindcss/styles.css">
|
|
7295
7295
|
<!-- To build your own, please see: https://tailwindcss.com/docs/installation -->
|
|
@@ -7322,15 +7322,15 @@ class Util {
|
|
|
7322
7322
|
<title>Page</title>
|
|
7323
7323
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7324
7324
|
<meta name="description" content="">
|
|
7325
|
-
<link rel="shortcut icon" href="#"
|
|
7325
|
+
<link rel="shortcut icon" href="#">
|
|
7326
7326
|
|
|
7327
7327
|
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
|
|
7328
7328
|
|
|
7329
|
-
<link href="[%PATH%]/assets/minimalist-blocks/content.css" rel="stylesheet"
|
|
7329
|
+
<link href="[%PATH%]/assets/minimalist-blocks/content.css" rel="stylesheet">
|
|
7330
7330
|
|
|
7331
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet"
|
|
7332
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet"
|
|
7333
|
-
<script src="[%PATH%]/assets/scripts/glide/glide.js"
|
|
7331
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet">
|
|
7332
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet">
|
|
7333
|
+
<script src="[%PATH%]/assets/scripts/glide/glide.js"></script>
|
|
7334
7334
|
|
|
7335
7335
|
<style>
|
|
7336
7336
|
.container {margin: 140px auto; max-width: 800px; width:100%; padding:0 35px; box-sizing: border-box;}
|
|
@@ -7359,16 +7359,16 @@ class Util {
|
|
|
7359
7359
|
<title>Page</title>
|
|
7360
7360
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
7361
7361
|
<meta name="description" content="">
|
|
7362
|
-
<link rel="shortcut icon" href="#"
|
|
7362
|
+
<link rel="shortcut icon" href="#">
|
|
7363
7363
|
|
|
7364
7364
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.5.3/css/foundation.min.css">
|
|
7365
7365
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.5.3/css/foundation-float.min.css">
|
|
7366
7366
|
|
|
7367
|
-
<link href="[%PATH%]/assets/minimalist-blocks/content.css" rel="stylesheet"
|
|
7367
|
+
<link href="[%PATH%]/assets/minimalist-blocks/content.css" rel="stylesheet">
|
|
7368
7368
|
|
|
7369
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet"
|
|
7370
|
-
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet"
|
|
7371
|
-
<script src="[%PATH%]/assets/scripts/glide/glide.js"
|
|
7369
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.core.css" rel="stylesheet">
|
|
7370
|
+
<link href="[%PATH%]/assets/scripts/glide/css/glide.theme.css" rel="stylesheet">
|
|
7371
|
+
<script src="[%PATH%]/assets/scripts/glide/glide.js"></script>
|
|
7372
7372
|
|
|
7373
7373
|
<style>
|
|
7374
7374
|
.container {
|
|
@@ -16316,7 +16316,7 @@ class Snippets {
|
|
|
16316
16316
|
<title></title>
|
|
16317
16317
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
16318
16318
|
<meta name="description" content="">
|
|
16319
|
-
<script src="${snippetUrl}"
|
|
16319
|
+
<script src="${snippetUrl}"></script>
|
|
16320
16320
|
<style>
|
|
16321
16321
|
body {
|
|
16322
16322
|
// background: #fff;
|
|
@@ -57465,7 +57465,7 @@ class RowTool {
|
|
|
57465
57465
|
<label class="label-row-grayscale label-checkbox" for="chkRowGrayscale"><input id="chkRowGrayscale" class="chk-row-grayscale" type="checkbox" /> ${util.out('Grayscale')}</label>
|
|
57466
57466
|
</div>
|
|
57467
57467
|
|
|
57468
|
-
<div class="div-row-wrapcolumns" style="display:
|
|
57468
|
+
<div class="div-row-wrapcolumns" style="display:none;flex-direction:column;padding-bottom:7px">
|
|
57469
57469
|
<div style="padding-top:20px;padding-bottom:3px;">${util.out('Wrap Columns (Breakpoint)')}:</div>
|
|
57470
57470
|
<div style="padding-top:3px;padding-bottom:5px;display:flex;align-items: center;">
|
|
57471
57471
|
|
|
@@ -57517,6 +57517,31 @@ class RowTool {
|
|
|
57517
57517
|
</button>
|
|
57518
57518
|
</div>
|
|
57519
57519
|
|
|
57520
|
+
<div class="div-colsperline" style="flex-direction:column">
|
|
57521
|
+
<label style="margin:20px 0 0;display:flex;flex-direction:column">
|
|
57522
|
+
<span style="margin:0 4px 3px 0">${util.out('Columns per Line')}:</span>
|
|
57523
|
+
|
|
57524
|
+
|
|
57525
|
+
<select class="input-numofcols" style="width:50%;display:none">
|
|
57526
|
+
<option value="">Default</option>
|
|
57527
|
+
<option value="2">2 columns per row</option>
|
|
57528
|
+
<option value="3">3 columns per row</option>
|
|
57529
|
+
<option value="4">4 columns per row</option>
|
|
57530
|
+
<option value="5">5 columns per row</option>
|
|
57531
|
+
<option value="6">6 columns per row</option>
|
|
57532
|
+
</select>
|
|
57533
|
+
</label>
|
|
57534
|
+
<div class="flex">
|
|
57535
|
+
<button title="1" class="input-colsperline on" data-value="1" style="width:40px;height:25px;">1</button>
|
|
57536
|
+
<button title="2" class="input-colsperline" data-value="2" style="width:40px;height:25px;">2</button>
|
|
57537
|
+
<button title="3" class="input-colsperline" data-value="3" style="width:40px;height:25px;">3</button>
|
|
57538
|
+
<button title="4" class="input-colsperline" data-value="4" style="width:40px;height:25px;">4</button>
|
|
57539
|
+
<button title="5" class="input-colsperline" data-value="5" style="width:40px;height:25px;">5</button>
|
|
57540
|
+
<button title="6" class="input-colsperline" data-value="6" style="width:40px;height:25px;">6</button>
|
|
57541
|
+
<button title="${util.out('Default')}" class="input-colsperline" data-value="" style="width:120px;height:25px;">${util.out('Default')}</button>
|
|
57542
|
+
</div>
|
|
57543
|
+
</div>
|
|
57544
|
+
|
|
57520
57545
|
<div id="divReverseColumns" style="diplay:none">
|
|
57521
57546
|
<label for="chkReverseColumns" style="margin:20px 0 0;display:flex"><input id="chkReverseColumns" type="checkbox" style="margin:0 7px 0 0"/><span>${util.out('Reverse Columns')}</span></label>
|
|
57522
57547
|
</div>
|
|
@@ -57552,7 +57577,9 @@ class RowTool {
|
|
|
57552
57577
|
this.imageSource = imageSource;
|
|
57553
57578
|
this.imageAdjust = imageAdjust;
|
|
57554
57579
|
this.imageAdjust2 = imageAdjust2;
|
|
57555
|
-
this.divRowGeneral = builderStuff.querySelector('#divRowGeneral');
|
|
57580
|
+
this.divRowGeneral = builderStuff.querySelector('#divRowGeneral');
|
|
57581
|
+
const divColsPerLine = rowSettings.querySelector('.div-colsperline');
|
|
57582
|
+
if (!this.builder.enableColumnsPerLine) divColsPerLine.style.display = 'none'; // Open Row Settings
|
|
57556
57583
|
|
|
57557
57584
|
let elm = rowMore.querySelector('.row-settings');
|
|
57558
57585
|
if (elm) dom.addEventListener(elm, 'click', () => {
|
|
@@ -57732,66 +57759,30 @@ class RowTool {
|
|
|
57732
57759
|
|
|
57733
57760
|
|
|
57734
57761
|
this.builder.opts.onChange();
|
|
57735
|
-
}); // Breakpoint
|
|
57736
|
-
|
|
57737
|
-
rowSettings.querySelectorAll('input[name="boxWrap"]').forEach(input => {
|
|
57738
|
-
input.addEventListener('change', () => {
|
|
57739
|
-
let row = util.rowSelected();
|
|
57740
|
-
if (!row) return;
|
|
57741
|
-
this.builder.uo.saveForUndo();
|
|
57742
|
-
|
|
57743
|
-
if (input.value === 'xs') {
|
|
57744
|
-
row.classList.remove('sm-wrap');
|
|
57745
|
-
row.classList.remove('md-wrap');
|
|
57746
|
-
} else if (input.value === 'sm') {
|
|
57747
|
-
row.classList.remove('md-wrap');
|
|
57748
|
-
row.classList.add('sm-wrap');
|
|
57749
|
-
} else if (input.value === 'md') {
|
|
57750
|
-
row.classList.remove('sm-wrap');
|
|
57751
|
-
row.classList.add('md-wrap');
|
|
57752
|
-
} //Trigger Change event
|
|
57753
|
-
|
|
57754
|
-
|
|
57755
|
-
this.builder.opts.onChange();
|
|
57756
|
-
});
|
|
57757
57762
|
});
|
|
57758
|
-
|
|
57759
|
-
|
|
57760
|
-
|
|
57761
|
-
|
|
57762
|
-
|
|
57763
|
-
|
|
57764
|
-
|
|
57765
|
-
|
|
57766
|
-
|
|
57767
|
-
|
|
57768
|
-
|
|
57769
|
-
|
|
57770
|
-
|
|
57771
|
-
|
|
57772
|
-
|
|
57773
|
-
|
|
57774
|
-
|
|
57775
|
-
|
|
57776
|
-
|
|
57777
|
-
}
|
|
57778
|
-
|
|
57779
|
-
|
|
57780
|
-
|
|
57781
|
-
} else {
|
|
57782
|
-
row.classList.remove('md-column-reverse');
|
|
57783
|
-
}
|
|
57784
|
-
} else if (target === '') {
|
|
57785
|
-
if (chkReverseBoxes.checked) {
|
|
57786
|
-
row.classList.add('desktop-column-reverse');
|
|
57787
|
-
} else {
|
|
57788
|
-
row.classList.remove('desktop-column-reverse');
|
|
57789
|
-
}
|
|
57790
|
-
} //Trigger Change event
|
|
57791
|
-
|
|
57792
|
-
|
|
57793
|
-
this.builder.settings.onChange();
|
|
57794
|
-
}); // Responsive Visibility
|
|
57763
|
+
/*
|
|
57764
|
+
// Breakpoint
|
|
57765
|
+
rowSettings.querySelectorAll('input[name="boxWrap"]').forEach((input) => {
|
|
57766
|
+
input.addEventListener('change', ()=>{
|
|
57767
|
+
let row = util.rowSelected();
|
|
57768
|
+
if(!row) return;
|
|
57769
|
+
this.builder.uo.saveForUndo();
|
|
57770
|
+
if(input.value==='xs') {
|
|
57771
|
+
row.classList.remove('sm-wrap');
|
|
57772
|
+
row.classList.remove('md-wrap');
|
|
57773
|
+
} else if(input.value==='sm') {
|
|
57774
|
+
row.classList.remove('md-wrap');
|
|
57775
|
+
row.classList.add('sm-wrap');
|
|
57776
|
+
} else if(input.value==='md') {
|
|
57777
|
+
row.classList.remove('sm-wrap');
|
|
57778
|
+
row.classList.add('md-wrap');
|
|
57779
|
+
}
|
|
57780
|
+
//Trigger Change event
|
|
57781
|
+
this.builder.opts.onChange();
|
|
57782
|
+
});
|
|
57783
|
+
});
|
|
57784
|
+
*/
|
|
57785
|
+
// Responsive Visibility
|
|
57795
57786
|
|
|
57796
57787
|
let btns = this.rowSettings.querySelectorAll('.input-device');
|
|
57797
57788
|
btns.forEach(btn => {
|
|
@@ -57853,6 +57844,98 @@ class RowTool {
|
|
|
57853
57844
|
btnHidden.classList.add('on'); //Trigger Change event
|
|
57854
57845
|
|
|
57855
57846
|
this.builder.opts.onChange();
|
|
57847
|
+
}); // Cols per line
|
|
57848
|
+
|
|
57849
|
+
btns = this.rowSettings.querySelectorAll('.input-colsperline');
|
|
57850
|
+
btns.forEach(btn => {
|
|
57851
|
+
btn.addEventListener('click', () => {
|
|
57852
|
+
let row = util.rowSelected();
|
|
57853
|
+
if (!row) return;
|
|
57854
|
+
this.builder.uo.saveForUndo();
|
|
57855
|
+
let elms = this.rowSettings.querySelectorAll('.input-colsperline');
|
|
57856
|
+
elms.forEach(elm => {
|
|
57857
|
+
elm.classList.remove('on');
|
|
57858
|
+
});
|
|
57859
|
+
btn.classList.add('on');
|
|
57860
|
+
let val = btn.getAttribute('data-value');
|
|
57861
|
+
let divTarget = this.rowSettings.querySelector('.div-target');
|
|
57862
|
+
let target = this.builder.responsive.readTarget(divTarget);
|
|
57863
|
+
|
|
57864
|
+
if (target === 'xs') {
|
|
57865
|
+
row.classList.remove('xs-items-1');
|
|
57866
|
+
row.classList.remove('xs-items-2');
|
|
57867
|
+
row.classList.remove('xs-items-3');
|
|
57868
|
+
row.classList.remove('xs-items-4');
|
|
57869
|
+
row.classList.remove('xs-items-5');
|
|
57870
|
+
row.classList.remove('xs-items-6');
|
|
57871
|
+
if (val !== '') row.classList.add(`xs-items-${val}`);
|
|
57872
|
+
} else if (target === 'sm') {
|
|
57873
|
+
row.classList.remove('sm-items-1');
|
|
57874
|
+
row.classList.remove('sm-items-2');
|
|
57875
|
+
row.classList.remove('sm-items-3');
|
|
57876
|
+
row.classList.remove('sm-items-4');
|
|
57877
|
+
row.classList.remove('sm-items-5');
|
|
57878
|
+
row.classList.remove('sm-items-6');
|
|
57879
|
+
if (val !== '') row.classList.add(`sm-items-${val}`);
|
|
57880
|
+
} else if (target === 'md') {
|
|
57881
|
+
row.classList.remove('md-items-1');
|
|
57882
|
+
row.classList.remove('md-items-2');
|
|
57883
|
+
row.classList.remove('md-items-3');
|
|
57884
|
+
row.classList.remove('md-items-4');
|
|
57885
|
+
row.classList.remove('md-items-5');
|
|
57886
|
+
row.classList.remove('md-items-6');
|
|
57887
|
+
if (val !== '') row.classList.add(`md-items-${val}`);
|
|
57888
|
+
} else if (target === '') {
|
|
57889
|
+
row.classList.remove('desktop-items-1');
|
|
57890
|
+
row.classList.remove('desktop-items-2');
|
|
57891
|
+
row.classList.remove('desktop-items-3');
|
|
57892
|
+
row.classList.remove('desktop-items-4');
|
|
57893
|
+
row.classList.remove('desktop-items-5');
|
|
57894
|
+
row.classList.remove('desktop-items-6');
|
|
57895
|
+
if (val !== '') row.classList.add(`desktop-items-${val}`);
|
|
57896
|
+
} //Trigger Change event
|
|
57897
|
+
|
|
57898
|
+
|
|
57899
|
+
this.builder.settings.onChange();
|
|
57900
|
+
});
|
|
57901
|
+
}); // Reverse
|
|
57902
|
+
|
|
57903
|
+
const chkReverseColumns = this.rowSettings.querySelector('#chkReverseColumns');
|
|
57904
|
+
chkReverseColumns.addEventListener('click', () => {
|
|
57905
|
+
let row = util.rowSelected();
|
|
57906
|
+
if (!row) return;
|
|
57907
|
+
this.builder.uo.saveForUndo();
|
|
57908
|
+
let divTarget = this.rowSettings.querySelector('.div-target');
|
|
57909
|
+
let target = this.builder.responsive.readTarget(divTarget);
|
|
57910
|
+
|
|
57911
|
+
if (target === 'xs') {
|
|
57912
|
+
if (chkReverseColumns.checked) {
|
|
57913
|
+
row.classList.add('xs-column-reverse');
|
|
57914
|
+
} else {
|
|
57915
|
+
row.classList.remove('xs-column-reverse');
|
|
57916
|
+
}
|
|
57917
|
+
} else if (target === 'sm') {
|
|
57918
|
+
if (chkReverseColumns.checked) {
|
|
57919
|
+
row.classList.add('sm-column-reverse');
|
|
57920
|
+
} else {
|
|
57921
|
+
row.classList.remove('sm-column-reverse');
|
|
57922
|
+
}
|
|
57923
|
+
} else if (target === 'md') {
|
|
57924
|
+
if (chkReverseColumns.checked) {
|
|
57925
|
+
row.classList.add('md-column-reverse');
|
|
57926
|
+
} else {
|
|
57927
|
+
row.classList.remove('md-column-reverse');
|
|
57928
|
+
}
|
|
57929
|
+
} else if (target === '') {
|
|
57930
|
+
if (chkReverseColumns.checked) {
|
|
57931
|
+
row.classList.add('desktop-column-reverse');
|
|
57932
|
+
} else {
|
|
57933
|
+
row.classList.remove('desktop-column-reverse');
|
|
57934
|
+
}
|
|
57935
|
+
} //Trigger Change event
|
|
57936
|
+
|
|
57937
|
+
|
|
57938
|
+
this.builder.settings.onChange();
|
|
57856
57939
|
}); //More
|
|
57857
57940
|
|
|
57858
57941
|
let inpRowId = rowSettings.querySelector('.input-row-id');
|
|
@@ -58022,21 +58105,34 @@ class RowTool {
|
|
|
58022
58105
|
let divVisibility = this.rowSettings.querySelector('.div-visibility');
|
|
58023
58106
|
let target = this.builder.responsive.readTarget(divTarget);
|
|
58024
58107
|
let valVisibility = this.builder.responsive.getVisibility(row, target);
|
|
58025
|
-
this.builder.responsive.showVisibility(divVisibility, valVisibility); //
|
|
58108
|
+
this.builder.responsive.showVisibility(divVisibility, valVisibility); // const divColsPerLine = this.rowSettings.querySelector('.div-colsperline');
|
|
58109
|
+
|
|
58110
|
+
let btns = this.rowSettings.querySelectorAll('.input-colsperline');
|
|
58111
|
+
btns.forEach(btn => {
|
|
58112
|
+
btn.classList.remove('on');
|
|
58113
|
+
}); // Column reverse
|
|
58026
58114
|
|
|
58027
58115
|
let valReverse = false;
|
|
58028
58116
|
|
|
58029
58117
|
if (target === 'xs') {
|
|
58030
58118
|
valReverse = row.classList.contains('xs-column-reverse');
|
|
58119
|
+
this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display = 'none';
|
|
58120
|
+
if (row.classList.contains('xs-items-1')) this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add('on');else if (row.classList.contains('xs-items-2')) this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add('on');else if (row.classList.contains('xs-items-3')) this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add('on');else if (row.classList.contains('xs-items-4')) this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add('on');else if (row.classList.contains('xs-items-5')) this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add('on');else if (row.classList.contains('xs-items-6')) this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add('on');else this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add('on');
|
|
58031
58121
|
if (!initialOpen) this.builder.livePreview.resizePreview(375);
|
|
58032
58122
|
} else if (target === 'sm') {
|
|
58033
58123
|
valReverse = row.classList.contains('sm-column-reverse');
|
|
58124
|
+
this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display = 'flex';
|
|
58125
|
+
if (row.classList.contains('sm-items-1')) this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add('on');else if (row.classList.contains('sm-items-2')) this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add('on');else if (row.classList.contains('sm-items-3')) this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add('on');else if (row.classList.contains('sm-items-4')) this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add('on');else if (row.classList.contains('sm-items-5')) this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add('on');else if (row.classList.contains('sm-items-6')) this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add('on');else this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add('on');
|
|
58034
58126
|
if (!initialOpen) this.builder.livePreview.resizePreview(768);
|
|
58035
58127
|
} else if (target === 'md') {
|
|
58036
58128
|
valReverse = row.classList.contains('md-column-reverse');
|
|
58129
|
+
this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display = 'flex';
|
|
58130
|
+
if (row.classList.contains('md-items-1')) this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add('on');else if (row.classList.contains('md-items-2')) this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add('on');else if (row.classList.contains('md-items-3')) this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add('on');else if (row.classList.contains('md-items-4')) this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add('on');else if (row.classList.contains('md-items-5')) this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add('on');else if (row.classList.contains('md-items-6')) this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add('on');else this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add('on');
|
|
58037
58131
|
if (!initialOpen) this.builder.livePreview.resizePreview(1024);
|
|
58038
58132
|
} else {
|
|
58039
58133
|
valReverse = row.classList.contains('desktop-column-reverse');
|
|
58134
|
+
this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display = 'flex';
|
|
58135
|
+
if (row.classList.contains('desktop-items-1')) this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add('on');else if (row.classList.contains('desktop-items-2')) this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add('on');else if (row.classList.contains('desktop-items-3')) this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add('on');else if (row.classList.contains('desktop-items-4')) this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add('on');else if (row.classList.contains('desktop-items-5')) this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add('on');else if (row.classList.contains('desktop-items-6')) this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add('on');else this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add('on');
|
|
58040
58136
|
if (!initialOpen) this.builder.livePreview.resizePreview(1920);
|
|
58041
58137
|
}
|
|
58042
58138
|
|
|
@@ -58363,14 +58459,17 @@ class RowTool {
|
|
|
58363
58459
|
} else {
|
|
58364
58460
|
divReverseBoxes.style.display = 'none';
|
|
58365
58461
|
}
|
|
58366
|
-
|
|
58367
|
-
|
|
58368
|
-
|
|
58462
|
+
/*
|
|
58463
|
+
// Breakpoint
|
|
58464
|
+
if(actualRow.classList.contains('md-wrap')) {
|
|
58465
|
+
this.rowSettings.querySelector('#rdoColMdWrap').checked = true;
|
|
58369
58466
|
} else if (actualRow.classList.contains('sm-wrap')) {
|
|
58370
|
-
|
|
58467
|
+
this.rowSettings.querySelector('#rdoColSmWrap').checked = true;
|
|
58371
58468
|
} else {
|
|
58372
|
-
|
|
58373
|
-
}
|
|
58469
|
+
this.rowSettings.querySelector('#rdoColXsWrap').checked = true;
|
|
58470
|
+
}
|
|
58471
|
+
*/
|
|
58472
|
+
//More
|
|
58374
58473
|
|
|
58375
58474
|
|
|
58376
58475
|
let inpRowId = this.rowSettings.querySelector('.input-row-id');
|
|
@@ -61077,7 +61176,8 @@ class ColumnTool {
|
|
|
61077
61176
|
const dom = this.dom; //---- New Col Tool ----
|
|
61078
61177
|
|
|
61079
61178
|
this.columnTool = col.parentNode.querySelector('.is-col-tool');
|
|
61080
|
-
this.columnTool.style.left = col.offsetLeft + 'px';
|
|
61179
|
+
this.columnTool.style.left = col.offsetLeft + 'px';
|
|
61180
|
+
this.columnTool.style.top = col.offsetTop + 'px'; //---- /New Col Tool ----
|
|
61081
61181
|
|
|
61082
61182
|
const btnIncrease = this.columnMore.querySelector('.cell-increase');
|
|
61083
61183
|
const btnDecrease = this.columnMore.querySelector('.cell-decrease');
|
|
@@ -72726,7 +72826,7 @@ class Rte {
|
|
|
72726
72826
|
<title>Fonts</title>
|
|
72727
72827
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
72728
72828
|
<meta name="description" content="">
|
|
72729
|
-
<link href="${path}css/ionicons.min.css" rel="stylesheet"
|
|
72829
|
+
<link href="${path}css/ionicons.min.css" rel="stylesheet">
|
|
72730
72830
|
<style id="mainstyle">
|
|
72731
72831
|
html, body {height:100%}
|
|
72732
72832
|
body {overflow:hidden;margin:0;
|
|
@@ -72841,7 +72941,7 @@ class Rte {
|
|
|
72841
72941
|
${this.getIcons()}
|
|
72842
72942
|
</div>
|
|
72843
72943
|
|
|
72844
|
-
<script
|
|
72944
|
+
<script>
|
|
72845
72945
|
const setValue = (elm) => {
|
|
72846
72946
|
if(!elm.className) elm = elm.childNodes[0];
|
|
72847
72947
|
parent._cb.addIcon(elm.className);
|
|
@@ -73035,7 +73135,7 @@ class Rte {
|
|
|
73035
73135
|
element = element.parentNode;
|
|
73036
73136
|
}
|
|
73037
73137
|
|
|
73038
|
-
dom.appendHtml(element, '<link href="//fonts.googleapis.com/css2?family=' + fontname + o + '" rel="stylesheet" property="stylesheet"
|
|
73138
|
+
dom.appendHtml(element, '<link href="//fonts.googleapis.com/css2?family=' + fontname + o + '" rel="stylesheet" property="stylesheet">');
|
|
73039
73139
|
}
|
|
73040
73140
|
}
|
|
73041
73141
|
|
|
@@ -73229,9 +73329,9 @@ class Rte {
|
|
|
73229
73329
|
if (this.builder.fontPath) {
|
|
73230
73330
|
const cssFileName = fontfamily.split(',')[0].toLowerCase().replace(/'/g, '').replace(/"/g, '').replace(/\s/g, '-') + '.css';
|
|
73231
73331
|
cssUrl = this.builder.fontPath + cssFileName;
|
|
73232
|
-
dom.appendHtml(element, `<link data-name="fontfamily" href="${cssUrl}" rel="stylesheet" property="stylesheet"
|
|
73332
|
+
dom.appendHtml(element, `<link data-name="fontfamily" href="${cssUrl}" rel="stylesheet" property="stylesheet">`);
|
|
73233
73333
|
} else {
|
|
73234
|
-
dom.appendHtml(element, '<link href="//fonts.googleapis.com/css2?family=' + fontname + d + o + '" rel="stylesheet" property="stylesheet"
|
|
73334
|
+
dom.appendHtml(element, '<link href="//fonts.googleapis.com/css2?family=' + fontname + d + o + '" rel="stylesheet" property="stylesheet">');
|
|
73235
73335
|
}
|
|
73236
73336
|
}
|
|
73237
73337
|
}
|
|
@@ -73252,7 +73352,7 @@ class Rte {
|
|
|
73252
73352
|
if (this.builder.fontPath) {
|
|
73253
73353
|
const cssFileName = fontfamily.split(',')[0].toLowerCase().replace(/'/g, '').replace(/"/g, '').replace(/\s/g, '-') + '.css';
|
|
73254
73354
|
cssUrl = this.builder.fontPath + cssFileName;
|
|
73255
|
-
dom.appendHtml(element, `<link data-name="fontfamily" href="${cssUrl}" rel="stylesheet" property="stylesheet"
|
|
73355
|
+
dom.appendHtml(element, `<link data-name="fontfamily" href="${cssUrl}" rel="stylesheet" property="stylesheet">`);
|
|
73256
73356
|
}
|
|
73257
73357
|
}
|
|
73258
73358
|
}
|
|
@@ -76994,7 +77094,7 @@ class LivePreview {
|
|
|
76994
77094
|
|
|
76995
77095
|
for (let i = 0; i < styles.length; i++) {
|
|
76996
77096
|
if (styles[i].href.indexOf('.css') != -1 && styles[i].href.indexOf('contentbox.css') == -1 && styles[i].href.indexOf('contentbuilder.css') == -1) {
|
|
76997
|
-
csslinks += '<link href="' + styles[i].href + '" rel="stylesheet"
|
|
77097
|
+
csslinks += '<link href="' + styles[i].href + '" rel="stylesheet">';
|
|
76998
77098
|
}
|
|
76999
77099
|
}
|
|
77000
77100
|
|
|
@@ -77006,7 +77106,7 @@ class LivePreview {
|
|
|
77006
77106
|
scripts[i].src.indexOf('static/js/') == -1 && //react
|
|
77007
77107
|
scripts[i].src.indexOf('src/') == -1 && //vue
|
|
77008
77108
|
scripts[i].src.indexOf('index') == -1 && scripts[i].src.indexOf('contentbox.js') == -1 && scripts[i].src.indexOf('contentbox.min.js') == -1 && scripts[i].src.indexOf('contentbuilder.js') == -1 && scripts[i].src.indexOf('contentbuilder.min.js') == -1 && scripts[i].src.indexOf('plugin.js') == -1 && scripts[i].src.indexOf('config.js') == -1 && scripts[i].src.indexOf('en.js') == -1 && scripts[i].src.indexOf('rangy') == -1 && scripts[i].src.indexOf('monaco-editor') == -1 && scripts[i].src.indexOf('minimalist-blocks') == -1) {
|
|
77009
|
-
jsincludes1 += '<script src="' + scripts[i].src + '"
|
|
77109
|
+
jsincludes1 += '<script src="' + scripts[i].src + '"></script>';
|
|
77010
77110
|
}
|
|
77011
77111
|
}
|
|
77012
77112
|
|
|
@@ -77018,7 +77118,7 @@ class LivePreview {
|
|
|
77018
77118
|
scripts[i].src.indexOf('static/js/') == -1 && //react
|
|
77019
77119
|
scripts[i].src.indexOf('src/') == -1 && //vue
|
|
77020
77120
|
scripts[i].src.indexOf('index') == -1 && scripts[i].src.indexOf('contentbox.js') == -1 && scripts[i].src.indexOf('contentbox.min.js') == -1 && scripts[i].src.indexOf('contentbuilder.js') == -1 && scripts[i].src.indexOf('contentbuilder.min.js') == -1 && scripts[i].src.indexOf('plugin.js') == -1 && scripts[i].src.indexOf('config.js') == -1 && scripts[i].src.indexOf('en.js') == -1 && scripts[i].src.indexOf('rangy') == -1 && scripts[i].src.indexOf('monaco-editor') == -1 && scripts[i].src.indexOf('minimalist-blocks') == -1) {
|
|
77021
|
-
jsincludes2 += '<script src="' + scripts[i].src + '"
|
|
77121
|
+
jsincludes2 += '<script src="' + scripts[i].src + '"></script>';
|
|
77022
77122
|
}
|
|
77023
77123
|
}
|
|
77024
77124
|
|
|
@@ -77028,7 +77128,7 @@ class LivePreview {
|
|
|
77028
77128
|
let content = this.builder.html();
|
|
77029
77129
|
doc = iframe.contentWindow.document;
|
|
77030
77130
|
doc.open();
|
|
77031
|
-
doc.write('<html>' + '<head>' + basehref + '<meta charset="utf-8">' + '<title></title>' + '<style>#_cbhtml > *:not(.is-lightbox) {display:none}</style>' + csslinks + (this.builder.useLightbox ? '<link href="' + this.builder.assetPath + 'scripts/lightbox/lightbox.css" rel="stylesheet"
|
|
77131
|
+
doc.write('<html>' + '<head>' + basehref + '<meta charset="utf-8">' + '<title></title>' + '<style>#_cbhtml > *:not(.is-lightbox) {display:none}</style>' + csslinks + (this.builder.useLightbox ? '<link href="' + this.builder.assetPath + 'scripts/lightbox/lightbox.css" rel="stylesheet">' : '') + '<style>' + '.slider-image { display:block !important; }' + '.container {margin:35px auto 0; max-width: ' + maxwidth + '; width:100%; padding:0 20px; box-sizing: border-box;}' + '</style>' + '<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>' + jsincludes1 + '</head>' + '<body>' + '<div class="container preview">' + content + '</div>' + jsincludes2 + (this.builder.useLightbox ? '<script src="' + this.builder.assetPath + 'scripts/lightbox/lightbox.js"></script><script>window.lightbox.init();</script>' : '') + '</body>' + '</html>');
|
|
77032
77132
|
doc.close();
|
|
77033
77133
|
}
|
|
77034
77134
|
|
|
@@ -77617,7 +77717,8 @@ class ContentBuilder {
|
|
|
77617
77717
|
useCssClasses: true,
|
|
77618
77718
|
useButtonPlugin: false,
|
|
77619
77719
|
enableDragResize: true,
|
|
77620
|
-
simpleTextSettings: false
|
|
77720
|
+
simpleTextSettings: false,
|
|
77721
|
+
enableColumnsPerLine: true
|
|
77621
77722
|
}; // obj.preserveSelection = true; (can be set programmatically) to prevent click that clears selection on external custom modal.
|
|
77622
77723
|
|
|
77623
77724
|
this.opts = Object.assign(this, defaults, opts);
|
|
@@ -79629,7 +79730,6 @@ class ContentBuilder {
|
|
|
79629
79730
|
if (this.filesAdded.indexOf('[' + filename + ']') === -1) {
|
|
79630
79731
|
var inc = document.createElement('link');
|
|
79631
79732
|
inc.setAttribute('rel', 'stylesheet');
|
|
79632
|
-
inc.setAttribute('type', 'text/css');
|
|
79633
79733
|
inc.setAttribute('href', filename);
|
|
79634
79734
|
document.getElementsByTagName('head')[0].appendChild(inc);
|
|
79635
79735
|
this.filesAdded += '[' + filename + ']';
|