@innovastudio/contentbox 1.4.69 → 1.4.70
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
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@innovastudio/contentbox",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.4.
|
|
4
|
+
"version": "1.4.70",
|
|
5
5
|
"description": "",
|
|
6
6
|
"main": "public/contentbox/contentbox.esm.js",
|
|
7
7
|
"files": [
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"webpack-dev-server": "^4.0.0"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@innovastudio/contentbuilder": "^1.3.
|
|
49
|
+
"@innovastudio/contentbuilder": "^1.3.81",
|
|
50
50
|
"js-beautify": "^1.14.0"
|
|
51
51
|
}
|
|
52
52
|
}
|
|
@@ -4029,10 +4029,42 @@ class EditSection {
|
|
|
4029
4029
|
<div>
|
|
4030
4030
|
<input id="inpSectionId" class="input-section-id" type="text" onkeypress="return /[0-9a-zA-Z_]/i.test(event.key)" style="height:38px">
|
|
4031
4031
|
</div>
|
|
4032
|
+
|
|
4033
|
+
<label for="inpSectionCssClasses" style="padding:20px 0 3px;">${out('Add Css Classes')}:</label>
|
|
4034
|
+
<div>
|
|
4035
|
+
<input id="inpSectionCssClasses" class="input-section-classes" type="text" style="height:38px">
|
|
4036
|
+
</div>
|
|
4032
4037
|
</div>
|
|
4033
4038
|
` + '<div id="divSectionGeneral" class="is-tab-content active" data-group="sectionsettings" style="display:flex;padding-top:0">' + '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Move Section') + ':</div>' + '<div style="display:flex">' + '<button title="' + out('Move Up') + '" class="cmd-section-up" style="">↑</button>' + '<button title="' + out('Move Down') + '" class="cmd-section-down">↓</button>' + '<button title="' + out('Move to Top') + '" class="cmd-section-top"><span style="transform:rotate(90deg);position:absolute;top:13px;left:15px;">⇤</span></button>' + '<button title="' + out('Move to Bottom') + '" class="cmd-section-bottom"><span style="transform:rotate(90deg);position:absolute;top:13px;left:15px;">⇥</span></button>' + '<button title="' + out('Duplicate') + '" class="cmd-section-duplicate" style="margin-left:20px;"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#ion-ios-copy-outline"></use></svg></button>' + '</div>' + '</div>';
|
|
4034
4039
|
html += '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Height') + ':</div>' + '<div style="display:flex">' + '<button title="' + out('Auto') + '" class="cmd-section-height" data-value="0">' + out('Auto') + '</button>' + '<button title="20%" class="cmd-section-height" data-value="20">20%</button>' + '<button title="25%" class="cmd-section-height" data-value="25">25%</button>' + '<button title="30%" class="cmd-section-height" data-value="30">30%</button>' + '<button title="40%" class="cmd-section-height" data-value="40">40%</button>' + '<button title="50%" class="cmd-section-height" data-value="50">50%</button>' + '</div>' + '<div style="display:flex">' + '<button title="60%" class="cmd-section-height" data-value="60" style="border-left:none;border-top:none;">60%</button>' + '<button title="70%" class="cmd-section-height" data-value="70" style="border-left:none;border-top:none;">70%</button>' + '<button title="75%" class="cmd-section-height" data-value="75" style="border-left:none;border-top:none;">75%</button>' + '<button title="80%" class="cmd-section-height" data-value="80" style="border-left:none;border-top:none;">80%</button>' + '<button title="90%" class="cmd-section-height" data-value="90" style="border-left:none;border-top:none;">90%</button>' + '<button title="100%" class="cmd-section-height" data-value="100" style="border-left:none;border-top:none;">100%</button>' + '</div>' + '</div>' + '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Spacing') + ':</div>' + '<div style="display:flex">' + '<button title="' + out('xxs') + '" class="cmd-box-spacing" data-value="xxs">' + out('xxs') + '</button>' + '<button title="' + out('xs') + '" class="cmd-box-spacing" data-value="default">' + out('xs') + '</button>' + '<button title="' + out('sm') + '" class="cmd-box-spacing" data-value="sm">' + out('sm') + '</button>' + '<button title="' + out('m') + '" class="cmd-box-spacing" data-value="m">' + out('m') + '</button>' + '<button title="' + out('lg') + '" class="cmd-box-spacing" data-value="lg">' + out('lg') + '</button>' + '<button title="' + out('Clear') + '" class="cmd-box-spacing" data-value=""><svg class="is-icon-flex"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '</div>';
|
|
4035
|
-
html += '<div class="div-section-spacesettings" style="display:flex;flex-direction:column;">' + '<div class="div-multi-boxes">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Between Boxes') + ':</div>' + '<div style="display:flex">' + '<button title="' + out('space') + '" class="cmd-betweenbox-spacing" data-value="space">' + out('space') + '</button>' + '<button title="' + out('no space') + '" class="cmd-betweenbox-spacing" data-value="no-space">' + out('no space') + '</button>' + '</div>' + '</div>' + '<div style="display:none;padding-top:20px;padding-bottom: 3px;">' + out('Stack') + ':</div>' + '<div style="display:none">' + '<button title="' + out('top') + '" class="cmd-section-stack" data-value="top">' + out('top') + '</button>' + '<button title="' + out('middle') + '" class="cmd-section-stack" data-value="middle">' + out('middle') + '</button>' + '<button title="' + out('bottom') + '" class="cmd-section-stack" data-value="bottom">' + out('bottom') + '</button>' + '<button title="' + out('Clear') + '" class="cmd-section-stack" data-value=""><svg class="is-icon-flex"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Background Color') + ':</div>' + '<div style="display:flex;">' + '<button title="' + out('Background Color') + '" class="input-section-bgcolor is-btn-color" style="margin-right:15px"></button>' + '<button title="' + out('Gradient') + '" class="input-section-gradient classic" data-value="+">' + out('Gradient') + '</button>' + '</div>' + '</div>' +
|
|
4040
|
+
html += '<div class="div-section-spacesettings" style="display:flex;flex-direction:column;">' + '<div class="div-multi-boxes">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Between Boxes') + ':</div>' + '<div style="display:flex">' + '<button title="' + out('space') + '" class="cmd-betweenbox-spacing" data-value="space">' + out('space') + '</button>' + '<button title="' + out('no space') + '" class="cmd-betweenbox-spacing" data-value="no-space">' + out('no space') + '</button>' + '</div>' + '</div>' + '<div style="display:none;padding-top:20px;padding-bottom: 3px;">' + out('Stack') + ':</div>' + '<div style="display:none">' + '<button title="' + out('top') + '" class="cmd-section-stack" data-value="top">' + out('top') + '</button>' + '<button title="' + out('middle') + '" class="cmd-section-stack" data-value="middle">' + out('middle') + '</button>' + '<button title="' + out('bottom') + '" class="cmd-section-stack" data-value="bottom">' + out('bottom') + '</button>' + '<button title="' + out('Clear') + '" class="cmd-section-stack" data-value=""><svg class="is-icon-flex"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Background Color') + ':</div>' + '<div style="display:flex;">' + '<button title="' + out('Background Color') + '" class="input-section-bgcolor is-btn-color" style="margin-right:15px"></button>' + '<button title="' + out('Gradient') + '" class="input-section-gradient classic" data-value="+">' + out('Gradient') + '</button>' + '</div>' + '</div>' + `
|
|
4041
|
+
|
|
4042
|
+
<div class="is-separator-" style="margin-top:30px"></div>
|
|
4043
|
+
|
|
4044
|
+
<div class="div-target" style="display: flex;justify-content: flex-end;padding: 5px 0 0;">
|
|
4045
|
+
<button title="${out('Desktop')}" class="input-device on" data-value="" style="width:40px;height:25px;">
|
|
4046
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-desktop"></use></svg>
|
|
4047
|
+
</button>
|
|
4048
|
+
<button title="${out('Tablet')}" class="input-device" data-value="sm" style="width:40px;height:25px;">
|
|
4049
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>
|
|
4050
|
+
</button>
|
|
4051
|
+
<button title="${out('Mobile')}" class="input-device" data-value="xs" style="width:40px;height:25px;">
|
|
4052
|
+
<svg class="is-icon-flex" style="width:13px;height:13px"><use xlink:href="#icon-device-mobile"></use></svg>
|
|
4053
|
+
</button>
|
|
4054
|
+
</div>
|
|
4055
|
+
|
|
4056
|
+
<div style="padding-top:0;padding-bottom:3px;">${out('Visibility')}:</div>
|
|
4057
|
+
<div class="div-visibility" style="display:flex;">
|
|
4058
|
+
<button title="${out('Visible')}" class="input-visible on" data-value="sm" style="width:100px;height:34px;">
|
|
4059
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-eye"></use></svg>
|
|
4060
|
+
<span>${out('Visible')}</span>
|
|
4061
|
+
</button>
|
|
4062
|
+
<button title="${out('Hidden')}" class="input-hidden" data-value="xs" style="width:100px;height:34px;">
|
|
4063
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-eye-off"></use></svg>
|
|
4064
|
+
<span>${out('Hidden')}</span>
|
|
4065
|
+
</button>
|
|
4066
|
+
</div>
|
|
4067
|
+
` + '</div>' + '<div id="divSectionAnimation" class="is-tab-content" data-group="sectionsettings" style="display:none;padding-top:0">' + '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('Start') + ':</div>' + '<div style="display:flex;flex-flow:wrap;">' + '<button title="' + out('Slide Left') + '" class="cmd-section-anim-start" data-value="slide-left">' + out('Slide Left') + '</button>' + '<button title="' + out('Slide Right') + '" class="cmd-section-anim-start" data-value="slide-right">' + out('Slide Right') + '</button>' + '<button title="' + out('Zoom In') + '" class="cmd-section-anim-start" data-value="zoom-in">' + out('Zoom In') + '</button>' + // '<button title="' + out('Zoom Out') + '" class="cmd-section-anim-start" data-value="zoom-out">' + out('Zoom Out') + '</button>' +
|
|
4036
4068
|
'<button title="' + out('Clear') + '" class="cmd-section-anim-start" data-value=""><svg class="is-icon-flex"><use xlink:href="#icon-clean"></use></svg></button>' + '</div>' + '</div>';
|
|
4037
4069
|
html += '<div style="display:flex;flex-direction:column;">' + '<div style="padding-top:20px;padding-bottom: 3px;">' + out('End') + ':</div>' + '<div style="display:flex;flex-flow:wrap;">' + '<button title="' + out('Slide Left') + '" class="cmd-section-anim-end" data-value="slide-left">' + out('Slide Left') + '</button>' + '<button title="' + out('Slide Right') + '" class="cmd-section-anim-end" data-value="slide-right">' + out('Slide Right') + '</button>' + // '<button title="' + out('Slide Back') + '" class="cmd-section-anim-end" data-value="slide-back">' + out('Slide Back') + '</button>' +
|
|
4038
4070
|
// '<button title="' + out('Overlap') + '" class="cmd-section-anim-end" data-value="overlap">' + out('Overlap') + '</button>' +
|
|
@@ -4361,6 +4393,30 @@ class EditSection {
|
|
|
4361
4393
|
} //Trigger Change event
|
|
4362
4394
|
|
|
4363
4395
|
|
|
4396
|
+
this.builder.onChange();
|
|
4397
|
+
});
|
|
4398
|
+
let inpSectionCssClasses = modalEditSection.querySelector('.input-section-classes');
|
|
4399
|
+
inpSectionCssClasses.addEventListener('change', () => {
|
|
4400
|
+
this.builder.editor.saveForUndo();
|
|
4401
|
+
const section = this.builder.activeSection;
|
|
4402
|
+
let arrCurrentClasses = [];
|
|
4403
|
+
let currentClasses = section.getAttribute('data-class');
|
|
4404
|
+
if (currentClasses) arrCurrentClasses = currentClasses.split(' ');
|
|
4405
|
+
let arrNewClasses = [];
|
|
4406
|
+
let newClasses = inpSectionCssClasses.value;
|
|
4407
|
+
arrNewClasses = newClasses.split(' ');
|
|
4408
|
+
arrCurrentClasses.forEach(item => {
|
|
4409
|
+
if (!arrNewClasses.includes(item)) {
|
|
4410
|
+
section.classList.remove(item);
|
|
4411
|
+
}
|
|
4412
|
+
});
|
|
4413
|
+
arrNewClasses.forEach(item => {
|
|
4414
|
+
if (item !== '') section.classList.add(item);
|
|
4415
|
+
}); // save
|
|
4416
|
+
|
|
4417
|
+
section.setAttribute('data-class', newClasses);
|
|
4418
|
+
if (section.getAttribute('data-class') === '') section.removeAttribute('data-class'); //Trigger Change event
|
|
4419
|
+
|
|
4364
4420
|
this.builder.onChange();
|
|
4365
4421
|
});
|
|
4366
4422
|
inpSectionId.addEventListener('keyup', () => {
|
|
@@ -4374,7 +4430,68 @@ class EditSection {
|
|
|
4374
4430
|
section.removeAttribute('id');
|
|
4375
4431
|
info.innerHTML = '';
|
|
4376
4432
|
}
|
|
4433
|
+
}); // Section Visibility
|
|
4434
|
+
|
|
4435
|
+
let btns = modalEditSection.querySelectorAll('.input-device');
|
|
4436
|
+
btns.forEach(btn => {
|
|
4437
|
+
btn.addEventListener('click', () => {
|
|
4438
|
+
let section = this.builder.activeSection;
|
|
4439
|
+
if (!section) return;
|
|
4440
|
+
let elms = modalEditSection.querySelectorAll('.input-device');
|
|
4441
|
+
elms.forEach(elm => {
|
|
4442
|
+
elm.classList.remove('on');
|
|
4443
|
+
});
|
|
4444
|
+
btn.classList.add('on');
|
|
4445
|
+
this.realtimeVisibility(section);
|
|
4446
|
+
});
|
|
4447
|
+
});
|
|
4448
|
+
let btnVisible = modalEditSection.querySelector('.input-visible');
|
|
4449
|
+
let btnHidden = modalEditSection.querySelector('.input-hidden');
|
|
4450
|
+
btnVisible.addEventListener('click', () => {
|
|
4451
|
+
let section = this.builder.activeSection;
|
|
4452
|
+
if (!section) return;
|
|
4453
|
+
section.classList.remove('hideonmobile');
|
|
4454
|
+
let divTarget = modalEditSection.querySelector('.div-target');
|
|
4455
|
+
let target = this.builder.editor.responsive.readTarget(divTarget);
|
|
4456
|
+
|
|
4457
|
+
if (target === 'xs') {
|
|
4458
|
+
section.classList.remove('xs-hidden');
|
|
4459
|
+
} else if (target === 'sm') {
|
|
4460
|
+
section.classList.remove('sm-hidden');
|
|
4461
|
+
} else if (target === '') {
|
|
4462
|
+
section.classList.remove('desktop-hidden');
|
|
4463
|
+
}
|
|
4464
|
+
|
|
4465
|
+
btnVisible.classList.add('on');
|
|
4466
|
+
btnHidden.classList.remove('on');
|
|
4467
|
+
});
|
|
4468
|
+
btnHidden.addEventListener('click', () => {
|
|
4469
|
+
let section = this.builder.activeSection;
|
|
4470
|
+
if (!section) return;
|
|
4471
|
+
section.classList.remove('hideonmobile');
|
|
4472
|
+
let divTarget = modalEditSection.querySelector('.div-target');
|
|
4473
|
+
let target = this.builder.editor.responsive.readTarget(divTarget);
|
|
4474
|
+
|
|
4475
|
+
if (target === 'xs') {
|
|
4476
|
+
section.classList.add('xs-hidden');
|
|
4477
|
+
} else if (target === 'sm') {
|
|
4478
|
+
section.classList.add('sm-hidden');
|
|
4479
|
+
} else if (target === '') {
|
|
4480
|
+
section.classList.add('desktop-hidden');
|
|
4481
|
+
}
|
|
4482
|
+
|
|
4483
|
+
btnVisible.classList.remove('on');
|
|
4484
|
+
btnHidden.classList.add('on');
|
|
4377
4485
|
});
|
|
4486
|
+
} // Section Visibility
|
|
4487
|
+
|
|
4488
|
+
|
|
4489
|
+
realtimeVisibility(cell) {
|
|
4490
|
+
let divTarget = this.modalEditSection.querySelector('.div-target');
|
|
4491
|
+
let divVisibility = this.modalEditSection.querySelector('.div-visibility');
|
|
4492
|
+
let target = this.builder.editor.responsive.readTarget(divTarget);
|
|
4493
|
+
let valVisibility = this.builder.editor.responsive.getVisibility(cell, target);
|
|
4494
|
+
this.builder.editor.responsive.showVisibility(divVisibility, valVisibility);
|
|
4378
4495
|
}
|
|
4379
4496
|
|
|
4380
4497
|
read() {
|
|
@@ -4386,8 +4503,12 @@ class EditSection {
|
|
|
4386
4503
|
|
|
4387
4504
|
if (sectionId) {
|
|
4388
4505
|
inpSectionId.value = sectionId;
|
|
4389
|
-
}
|
|
4506
|
+
}
|
|
4390
4507
|
|
|
4508
|
+
let inpSectionClasses = modalEditSection.querySelector('.input-section-classes');
|
|
4509
|
+
inpSectionClasses.value = '';
|
|
4510
|
+
const classes = activeSection.getAttribute('data-class');
|
|
4511
|
+
inpSectionClasses.value = classes; // Clean old unused is-bg-light/dark
|
|
4391
4512
|
|
|
4392
4513
|
let elms = this.builder.activeSection.querySelectorAll('.is-bg-light');
|
|
4393
4514
|
elms.forEach(elm => {
|
|
@@ -4565,7 +4686,10 @@ class EditSection {
|
|
|
4565
4686
|
btnSectionBgColor.style.backgroundColor = bgcolor; //preview
|
|
4566
4687
|
} else {
|
|
4567
4688
|
btnSectionBgColor.style.backgroundColor = '';
|
|
4568
|
-
}
|
|
4689
|
+
} // Section Visibility
|
|
4690
|
+
|
|
4691
|
+
|
|
4692
|
+
this.realtimeVisibility(activeSection);
|
|
4569
4693
|
}
|
|
4570
4694
|
|
|
4571
4695
|
close() {
|
|
@@ -18246,6 +18370,7 @@ class Util {
|
|
|
18246
18370
|
Array.prototype.forEach.call(subblocks, subblock => {
|
|
18247
18371
|
if (col.getAttribute('data-html-' + i)) {
|
|
18248
18372
|
subblock.innerHTML = decodeURIComponent(col.getAttribute('data-html-' + i));
|
|
18373
|
+
subblock.contentEditable = true;
|
|
18249
18374
|
}
|
|
18250
18375
|
|
|
18251
18376
|
i++;
|
|
@@ -28734,6 +28859,7 @@ class HtmlUtil {
|
|
|
28734
28859
|
let index = 1;
|
|
28735
28860
|
let subblocks = block.querySelectorAll('[data-subblock]');
|
|
28736
28861
|
Array.prototype.forEach.call(subblocks, subblock => {
|
|
28862
|
+
if (subblock.closest('.glide__slide--clone')) return;
|
|
28737
28863
|
let html = subblock.innerHTML;
|
|
28738
28864
|
block.setAttribute('data-html-' + index, encodeURIComponent(html));
|
|
28739
28865
|
index++;
|
|
@@ -29561,6 +29687,47 @@ const prepareSvgIcons = builder => {
|
|
|
29561
29687
|
<symbol viewBox="0 0 512 512" id="ion-volume-medium">
|
|
29562
29688
|
<path d="M270 407.7V104.4L175.3 192H71v128h104.3zm56.3-52.1c20.5-27.8 32.8-62.3 32.8-99.6 0-37.4-12.3-71.8-32.8-99.6l-20.4 15.3c17.4 23.6 27.8 52.7 27.8 84.3 0 31.6-10.4 60.7-27.8 84.3l20.4 15.3zm66.5 46c30-40.7 48-91 48-145.6s-18-104.9-48-145.6l-20.4 15.3c26.9 36.4 43 81.4 43 130.3 0 48.9-16.1 93.8-43 130.3l20.4 15.3z"/>
|
|
29563
29689
|
</symbol>
|
|
29690
|
+
|
|
29691
|
+
|
|
29692
|
+
|
|
29693
|
+
<symbol id="icon-devices" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29694
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29695
|
+
<rect x="13" y="8" width="8" height="12" rx="1"></rect>
|
|
29696
|
+
<path d="M18 8v-3a1 1 0 0 0 -1 -1h-13a1 1 0 0 0 -1 1v12a1 1 0 0 0 1 1h9"></path>
|
|
29697
|
+
<line x1="16" y1="9" x2="18" y2="9"></line>
|
|
29698
|
+
</symbol>
|
|
29699
|
+
<symbol id="icon-device-desktop" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29700
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29701
|
+
<rect x="3" y="4" width="18" height="12" rx="1"></rect>
|
|
29702
|
+
<line x1="7" y1="20" x2="17" y2="20"></line>
|
|
29703
|
+
<line x1="9" y1="16" x2="9" y2="20"></line>
|
|
29704
|
+
<line x1="15" y1="16" x2="15" y2="20"></line>
|
|
29705
|
+
</symbol>
|
|
29706
|
+
<symbol id="icon-device-mobile" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29707
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29708
|
+
<rect x="6" y="3" width="12" height="18" rx="2"></rect>
|
|
29709
|
+
<line x1="11" y1="4" x2="13" y2="4"></line>
|
|
29710
|
+
<line x1="12" y1="17" x2="12" y2="17.01"></line>
|
|
29711
|
+
</symbol>
|
|
29712
|
+
<symbol id="icon-device-laptop" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29713
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29714
|
+
<line x1="3" y1="19" x2="21" y2="19"></line>
|
|
29715
|
+
<rect x="5" y="6" width="14" height="10" rx="1"></rect>
|
|
29716
|
+
</symbol>
|
|
29717
|
+
<symbol id="icon-device-tablet" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29718
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29719
|
+
<rect x="5" y="3" width="14" height="18" rx="1"></rect>
|
|
29720
|
+
<circle cx="12" cy="17" r="1"></circle>
|
|
29721
|
+
</symbol>
|
|
29722
|
+
|
|
29723
|
+
<symbol id="icon-eye" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29724
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29725
|
+
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0m13 0c-2.667 4.667 -6 7 -10 7s-7.333 -2.333 -10 -7c2.667 -4.667 6 -7 10 -7s7.333 2.333 10 7"></path>
|
|
29726
|
+
</symbol>
|
|
29727
|
+
<symbol id="icon-eye-off" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
|
29728
|
+
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
29729
|
+
<path d="M9.88 9.878a3 3 0 1 0 4.243 4.242m.581 -3.42a3.012 3.012 0 0 0 -1.45 -1.426m-3.877 -3.913a9.469 9.469 0 0 1 2.623 -.361c4 0 7.333 2.333 10 7c-.778 1.362 -1.613 2.524 -2.504 3.489m-2.138 1.859c-1.629 1.101 -3.415 1.652 -5.358 1.652c-4 0 -7.333 -2.333 -10 -7c1.374 -2.404 2.924 -4.189 4.652 -5.354m-3.652 -3.646l18 18"></path>
|
|
29730
|
+
</symbol>
|
|
29564
29731
|
</defs>
|
|
29565
29732
|
</svg>`;
|
|
29566
29733
|
builder.dom.appendHtml(builder.builderStuff, html);
|
|
@@ -67020,7 +67187,7 @@ class Module {
|
|
|
67020
67187
|
var moduleDesc = module.getAttribute('data-module-desc');
|
|
67021
67188
|
|
|
67022
67189
|
if (moduleDesc) {
|
|
67023
|
-
moduleModal.querySelector('.is-modal-bar').innerHTML = moduleDesc + `<button class="is-modal-close" tabindex="-1" title="${util.out('Close')}">
|
|
67190
|
+
moduleModal.querySelector('.is-modal-bar').innerHTML = this.util.out(moduleDesc) + `<button class="is-modal-close" tabindex="-1" title="${util.out('Close')}">
|
|
67024
67191
|
<svg class="is-icon-flex" style="width:30px;height:30px;"><use xlink:href="#ion-ios-close-empty"></use></svg>
|
|
67025
67192
|
</button>`;
|
|
67026
67193
|
} else {
|
|
@@ -67349,9 +67516,10 @@ class Code {
|
|
|
67349
67516
|
viewhtml = this.builderStuff.querySelector('.viewhtml');
|
|
67350
67517
|
}
|
|
67351
67518
|
|
|
67352
|
-
let textarea = viewhtml.querySelector('textarea');
|
|
67353
|
-
let beautify = JsBeautify.html;
|
|
67354
|
-
html = beautify(html);
|
|
67519
|
+
let textarea = viewhtml.querySelector('textarea'); // Commented, to prevent {id} get formatted.
|
|
67520
|
+
// let beautify = JsBeautify.html;
|
|
67521
|
+
// html = beautify(html);
|
|
67522
|
+
|
|
67355
67523
|
textarea.value = html;
|
|
67356
67524
|
this.htmlUtil.view('code');
|
|
67357
67525
|
});
|
|
@@ -71188,13 +71356,39 @@ class ColumnTool {
|
|
|
71188
71356
|
<button title="${util.out('Clear')}" class="input-cell-textcolor" data-command=""><svg class="is-icon-flex" style="flex:none;width:18px;height:18px;margin-top: 2px;"><use xlink:href="#ion-ios-close-empty"></use></svg></button>
|
|
71189
71357
|
</div>
|
|
71190
71358
|
|
|
71191
|
-
<div style="padding
|
|
71359
|
+
<div style="padding:30px 0 10px;">
|
|
71192
71360
|
<label class="label-cell-grayscale label-checkbox" for="chkCellGrayscale"><input id="chkCellGrayscale" class="chk-cell-grayscale" type="checkbox" /> ${util.out('Grayscale')}</label>
|
|
71193
71361
|
</div>
|
|
71194
71362
|
|
|
71195
|
-
<div style="padding:20px 0 10px;">
|
|
71363
|
+
<div style="display:none;padding:20px 0 10px;">
|
|
71196
71364
|
<label class="label-cell-hideonmobile label-checkbox" for="chkHideColumnOnMobile"><input id="chkHideColumnOnMobile" class="chk-cell-hideonmobile" type="checkbox" /> ${util.out('Hide Column on Mobile')}</label>
|
|
71197
71365
|
</div>
|
|
71366
|
+
|
|
71367
|
+
<div class="is-separator"></div>
|
|
71368
|
+
|
|
71369
|
+
<div class="div-target" style="display: flex;justify-content: flex-end;padding: 5px 0 0;">
|
|
71370
|
+
<button title="${util.out('Desktop')}" class="input-device on" data-value="" style="width:40px;height:25px;">
|
|
71371
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-desktop"></use></svg>
|
|
71372
|
+
</button>
|
|
71373
|
+
<button title="${util.out('Tablet')}" class="input-device" data-value="sm" style="width:40px;height:25px;">
|
|
71374
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>
|
|
71375
|
+
</button>
|
|
71376
|
+
<button title="${util.out('Mobile')}" class="input-device" data-value="xs" style="width:40px;height:25px;">
|
|
71377
|
+
<svg class="is-icon-flex" style="width:13px;height:13px"><use xlink:href="#icon-device-mobile"></use></svg>
|
|
71378
|
+
</button>
|
|
71379
|
+
</div>
|
|
71380
|
+
|
|
71381
|
+
<div style="padding-top:0;padding-bottom:3px;">${util.out('Visibility')}:</div>
|
|
71382
|
+
<div class="div-visibility" style="display:flex;">
|
|
71383
|
+
<button title="${util.out('Visible')}" class="input-visible on" data-value="sm" style="width:100px;height:34px;">
|
|
71384
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-eye"></use></svg>
|
|
71385
|
+
<span>${util.out('Visible')}</span>
|
|
71386
|
+
</button>
|
|
71387
|
+
<button title="${util.out('Hidden')}" class="input-hidden" data-value="xs" style="width:100px;height:34px;">
|
|
71388
|
+
<svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-eye-off"></use></svg>
|
|
71389
|
+
<span>${util.out('Hidden')}</span>
|
|
71390
|
+
</button>
|
|
71391
|
+
</div>
|
|
71198
71392
|
|
|
71199
71393
|
<!--
|
|
71200
71394
|
<div style="display:none;padding-top:20px;padding-bottom:3px;">${util.out('Enlarge Row')}:</div>
|
|
@@ -72804,6 +72998,58 @@ class ColumnTool {
|
|
|
72804
72998
|
if (!cell) return;
|
|
72805
72999
|
if (inpClickSrc.value === '') return;
|
|
72806
73000
|
this.builder.openMedia(cell);
|
|
73001
|
+
}); // Responsive Visibility
|
|
73002
|
+
|
|
73003
|
+
let btns = this.cellSettings.querySelectorAll('.input-device');
|
|
73004
|
+
btns.forEach(btn => {
|
|
73005
|
+
btn.addEventListener('click', () => {
|
|
73006
|
+
let cell = this.util.cellSelected();
|
|
73007
|
+
if (!cell) return;
|
|
73008
|
+
let elms = this.cellSettings.querySelectorAll('.input-device');
|
|
73009
|
+
elms.forEach(elm => {
|
|
73010
|
+
elm.classList.remove('on');
|
|
73011
|
+
});
|
|
73012
|
+
btn.classList.add('on');
|
|
73013
|
+
this.realtimeVisibility(cell);
|
|
73014
|
+
});
|
|
73015
|
+
});
|
|
73016
|
+
let btnVisible = this.cellSettings.querySelector('.input-visible');
|
|
73017
|
+
let btnHidden = this.cellSettings.querySelector('.input-hidden');
|
|
73018
|
+
btnVisible.addEventListener('click', () => {
|
|
73019
|
+
let cell = this.util.cellSelected();
|
|
73020
|
+
if (!cell) return;
|
|
73021
|
+
cell.classList.remove('hideonmobile');
|
|
73022
|
+
let divTarget = this.cellSettings.querySelector('.div-target');
|
|
73023
|
+
let target = this.builder.responsive.readTarget(divTarget);
|
|
73024
|
+
|
|
73025
|
+
if (target === 'xs') {
|
|
73026
|
+
cell.classList.remove('xs-hidden');
|
|
73027
|
+
} else if (target === 'sm') {
|
|
73028
|
+
cell.classList.remove('sm-hidden');
|
|
73029
|
+
} else if (target === '') {
|
|
73030
|
+
cell.classList.remove('desktop-hidden');
|
|
73031
|
+
}
|
|
73032
|
+
|
|
73033
|
+
btnVisible.classList.add('on');
|
|
73034
|
+
btnHidden.classList.remove('on');
|
|
73035
|
+
});
|
|
73036
|
+
btnHidden.addEventListener('click', () => {
|
|
73037
|
+
let cell = this.util.cellSelected();
|
|
73038
|
+
if (!cell) return;
|
|
73039
|
+
cell.classList.remove('hideonmobile');
|
|
73040
|
+
let divTarget = this.cellSettings.querySelector('.div-target');
|
|
73041
|
+
let target = this.builder.responsive.readTarget(divTarget);
|
|
73042
|
+
|
|
73043
|
+
if (target === 'xs') {
|
|
73044
|
+
cell.classList.add('xs-hidden');
|
|
73045
|
+
} else if (target === 'sm') {
|
|
73046
|
+
cell.classList.add('sm-hidden');
|
|
73047
|
+
} else if (target === '') {
|
|
73048
|
+
cell.classList.add('desktop-hidden');
|
|
73049
|
+
}
|
|
73050
|
+
|
|
73051
|
+
btnVisible.classList.remove('on');
|
|
73052
|
+
btnHidden.classList.add('on');
|
|
72807
73053
|
});
|
|
72808
73054
|
}
|
|
72809
73055
|
|
|
@@ -72994,6 +73240,16 @@ class ColumnTool {
|
|
|
72994
73240
|
let btn = this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomright"');
|
|
72995
73241
|
dom.addClass(btn, 'on');
|
|
72996
73242
|
}
|
|
73243
|
+
|
|
73244
|
+
this.realtimeVisibility(cell);
|
|
73245
|
+
}
|
|
73246
|
+
|
|
73247
|
+
realtimeVisibility(cell) {
|
|
73248
|
+
let divTarget = this.cellSettings.querySelector('.div-target');
|
|
73249
|
+
let divVisibility = this.cellSettings.querySelector('.div-visibility');
|
|
73250
|
+
let target = this.builder.responsive.readTarget(divTarget);
|
|
73251
|
+
let valVisibility = this.builder.responsive.getVisibility(cell, target);
|
|
73252
|
+
this.builder.responsive.showVisibility(divVisibility, valVisibility);
|
|
72997
73253
|
}
|
|
72998
73254
|
|
|
72999
73255
|
openImagePicker(currentUrl, callback, btn) {
|
|
@@ -74409,17 +74665,19 @@ class ElementSpacingStyles {
|
|
|
74409
74665
|
</select>
|
|
74410
74666
|
</div>
|
|
74411
74667
|
</div>
|
|
74412
|
-
|
|
74413
|
-
<div style="
|
|
74414
|
-
|
|
74415
|
-
|
|
74416
|
-
<div>
|
|
74417
|
-
<
|
|
74668
|
+
|
|
74669
|
+
<div style="display:none">
|
|
74670
|
+
<div style="margin-top: 25px;font-weight: bold;width:100%">${util.out('Responsive Positioning')}:</div>
|
|
74671
|
+
|
|
74672
|
+
<div class="is-settings" style="width:100%;">
|
|
74673
|
+
<div>
|
|
74674
|
+
<label for="chkResetMarginLeft" style="letter-spacing: 0.5px;"><input type="checkbox" id="chkResetMarginLeft" value="" /> ${util.out('Reset margin left on small screen')} </label>
|
|
74675
|
+
</div>
|
|
74418
74676
|
</div>
|
|
74419
|
-
|
|
74420
|
-
|
|
74421
|
-
|
|
74422
|
-
|
|
74677
|
+
<div class="is-settings" style="margin-top:0;width:100%;">
|
|
74678
|
+
<div>
|
|
74679
|
+
<label for="chkResetMarginRight" style="letter-spacing: 0.5px;"><input type="checkbox" id="chkResetMarginRight" value="" /> ${util.out('Reset margin right on small screen')} </label>
|
|
74680
|
+
</div>
|
|
74423
74681
|
</div>
|
|
74424
74682
|
</div>
|
|
74425
74683
|
`;
|
|
@@ -78519,6 +78777,11 @@ class ElementTool {
|
|
|
78519
78777
|
if (ok) {
|
|
78520
78778
|
this.builder.uo.saveForUndo();
|
|
78521
78779
|
let elm = this.builder.activeElement;
|
|
78780
|
+
let subblock = false;
|
|
78781
|
+
|
|
78782
|
+
if (elm.closest('.is-subblock')) {
|
|
78783
|
+
subblock = true;
|
|
78784
|
+
}
|
|
78522
78785
|
/*
|
|
78523
78786
|
if(dom.hasClass(elm.parentNode, 'cell-active') || elm.parentNode.hasAttribute('data-subblock')) {
|
|
78524
78787
|
// Level 1
|
|
@@ -78544,6 +78807,7 @@ class ElementTool {
|
|
|
78544
78807
|
}
|
|
78545
78808
|
*/
|
|
78546
78809
|
|
|
78810
|
+
|
|
78547
78811
|
elm.parentNode.removeChild(elm);
|
|
78548
78812
|
this.elementTool.style.display = 'none';
|
|
78549
78813
|
let cell = this.builder.activeCol;
|
|
@@ -78574,7 +78838,21 @@ class ElementTool {
|
|
|
78574
78838
|
subblock.innerHTML = '<div class="spacer height-40" contentEditable="false"></div>';
|
|
78575
78839
|
}
|
|
78576
78840
|
});
|
|
78577
|
-
util.clearControls();
|
|
78841
|
+
util.clearControls();
|
|
78842
|
+
|
|
78843
|
+
if (subblock) {
|
|
78844
|
+
let block = this.builder.activeCol;
|
|
78845
|
+
let subblocks = block.querySelectorAll('[data-subblock]');
|
|
78846
|
+
var index = 1;
|
|
78847
|
+
Array.prototype.forEach.call(subblocks, subblock => {
|
|
78848
|
+
if (subblock.closest('.glide__slide--clone')) return;
|
|
78849
|
+
let html = subblock.innerHTML;
|
|
78850
|
+
block.setAttribute('data-html-' + index, encodeURIComponent(html));
|
|
78851
|
+
index++;
|
|
78852
|
+
});
|
|
78853
|
+
util.refreshModuleLayout(block);
|
|
78854
|
+
} //Trigger Change event
|
|
78855
|
+
|
|
78578
78856
|
|
|
78579
78857
|
this.builder.opts.onChange();
|
|
78580
78858
|
}
|
|
@@ -83414,7 +83692,8 @@ class Rte {
|
|
|
83414
83692
|
// Column contains custom code.
|
|
83415
83693
|
customcode = true;
|
|
83416
83694
|
|
|
83417
|
-
if (
|
|
83695
|
+
if (elm.closest('.is-subblock')) {
|
|
83696
|
+
// dom.parentsHasAttribute(elm, 'data-subblock')
|
|
83418
83697
|
subblock = true;
|
|
83419
83698
|
}
|
|
83420
83699
|
}
|
|
@@ -83440,7 +83719,7 @@ class Rte {
|
|
|
83440
83719
|
this.showAlignButtons();
|
|
83441
83720
|
this.positionToolbar();
|
|
83442
83721
|
}
|
|
83443
|
-
} else if (dom.hasClass(elm, 'spacer') || elm.tagName.toLowerCase() === 'video' || dom.hasClass(elm, 'ovl') || col.getAttribute('data-html')) {
|
|
83722
|
+
} else if (dom.hasClass(elm, 'spacer') || elm.tagName.toLowerCase() === 'video' || dom.hasClass(elm, 'ovl') || col.getAttribute('data-html') && !subblock) {
|
|
83444
83723
|
//|| col===elm
|
|
83445
83724
|
if (this.elementRteTool.style.display === 'none' || this.elementRteTool.style.display === '') {
|
|
83446
83725
|
this.elementRteTool.style.display = 'flex';
|
|
@@ -86877,6 +87156,7 @@ class Resizeable {
|
|
|
86877
87156
|
|
|
86878
87157
|
const onDown = e => {
|
|
86879
87158
|
calc(e);
|
|
87159
|
+
if (e.target.closest('.glide__arrows')) return false;
|
|
86880
87160
|
const isResizing = onRightEdge || onBottomEdge || onTopEdge || onLeftEdge;
|
|
86881
87161
|
clicked = {
|
|
86882
87162
|
x: x,
|
|
@@ -88566,6 +88846,54 @@ class MediaPicker {
|
|
|
88566
88846
|
|
|
88567
88847
|
}
|
|
88568
88848
|
|
|
88849
|
+
class Responsive {
|
|
88850
|
+
constructor(builder) {
|
|
88851
|
+
this.builder = builder;
|
|
88852
|
+
const util = this.builder.util;
|
|
88853
|
+
const builderStuff = this.builder.builderStuff;
|
|
88854
|
+
this.util = util;
|
|
88855
|
+
this.builderStuff = builderStuff;
|
|
88856
|
+
const dom = this.builder.dom;
|
|
88857
|
+
this.dom = dom;
|
|
88858
|
+
}
|
|
88859
|
+
|
|
88860
|
+
getVisibility(elm, target) {
|
|
88861
|
+
if (target === 'xs') return !elm.classList.contains('xs-hidden');
|
|
88862
|
+
if (target === 'sm') return !elm.classList.contains('sm-hidden');
|
|
88863
|
+
if (target === '') return !elm.classList.contains('desktop-hidden');
|
|
88864
|
+
}
|
|
88865
|
+
|
|
88866
|
+
setVisibility(visibility, elm, target) {
|
|
88867
|
+
if (target === 'xs') {
|
|
88868
|
+
if (visibility) elm.classList.remove('xs-hidden');else elm.classList.add('xs-hidden');
|
|
88869
|
+
}
|
|
88870
|
+
|
|
88871
|
+
if (target === 'sm') {
|
|
88872
|
+
if (visibility) elm.classList.remove('sm-hidden');else elm.classList.add('sm-hidden');
|
|
88873
|
+
}
|
|
88874
|
+
|
|
88875
|
+
if (target === '') {
|
|
88876
|
+
if (visibility) elm.classList.remove('desktop-hidden');else elm.classList.add('desktop-hidden');
|
|
88877
|
+
}
|
|
88878
|
+
}
|
|
88879
|
+
|
|
88880
|
+
readTarget(area) {
|
|
88881
|
+
const inp = area.querySelector('.input-device.on');
|
|
88882
|
+
return inp.getAttribute('data-value');
|
|
88883
|
+
}
|
|
88884
|
+
|
|
88885
|
+
showVisibility(area, visibility) {
|
|
88886
|
+
if (visibility) {
|
|
88887
|
+
area.querySelector('.input-visible').classList.add('on');
|
|
88888
|
+
area.querySelector('.input-hidden').classList.remove('on');
|
|
88889
|
+
} else {
|
|
88890
|
+
area.querySelector('.input-visible').classList.remove('on');
|
|
88891
|
+
area.querySelector('.input-hidden').classList.add('on');
|
|
88892
|
+
}
|
|
88893
|
+
}
|
|
88894
|
+
|
|
88895
|
+
}
|
|
88896
|
+
|
|
88569
88897
|
class ContentBuilder {
|
|
88570
88898
|
constructor(opts = {}) {
|
|
88571
88899
|
let defaults = {
|
|
@@ -89284,11 +89612,15 @@ class ContentBuilder {
|
|
|
89284
89612
|
|
|
89285
89613
|
this.win = win;
|
|
89286
89614
|
this.doc = doc;
|
|
89615
|
+
this.doc.body.classList.add('data-editor');
|
|
89287
89616
|
const dom = new Dom(this);
|
|
89288
89617
|
this.dom = dom;
|
|
89289
89618
|
const util = new Util(this); // General utilities
|
|
89290
89619
|
|
|
89291
|
-
this.util = util;
|
|
89620
|
+
this.util = util;
|
|
89621
|
+
const responsive = new Responsive(this); // General utilities
|
|
89622
|
+
|
|
89623
|
+
this.responsive = responsive; // Content stuff
|
|
89292
89624
|
|
|
89293
89625
|
if (this.iframe) {
|
|
89294
89626
|
let contentStuff = doc.querySelector('.content-stuff');
|
|
@@ -89450,7 +89782,8 @@ class ContentBuilder {
|
|
|
89450
89782
|
k = false;
|
|
89451
89783
|
let m = false,
|
|
89452
89784
|
n = false,
|
|
89453
|
-
o = false
|
|
89785
|
+
o = false,
|
|
89786
|
+
p = false;
|
|
89454
89787
|
let isSpecialElement = false;
|
|
89455
89788
|
let element = target;
|
|
89456
89789
|
|
|
@@ -89458,6 +89791,7 @@ class ContentBuilder {
|
|
|
89458
89791
|
if (!element.tagName) break;
|
|
89459
89792
|
if (element.tagName === 'BODY' || element.tagName === 'HTML') break;
|
|
89460
89793
|
if (this.dom.hasClass(element, 'is-builder')) a = true;
|
|
89794
|
+
if (this.dom.hasClass(element, 'is-subblock')) p = true;
|
|
89461
89795
|
if (this.dom.hasClass(element, 'is-modal')) b = true;
|
|
89462
89796
|
if (this.dom.hasClass(element, 'is-side') || this.dom.hasClass(element, 'is-sidebar')) c = true;
|
|
89463
89797
|
if (this.dom.hasClass(element, 'is-pop')) d = true;
|
|
@@ -89524,7 +89858,7 @@ class ContentBuilder {
|
|
|
89524
89858
|
}
|
|
89525
89859
|
}
|
|
89526
89860
|
|
|
89527
|
-
if (!(a || b || c || d || f || g || h || i || j || o || isSpecialElement) || rowClicked && !i || containerClicked) {
|
|
89861
|
+
if (!(a || p || b || c || d || f || g || h || i || j || o || isSpecialElement) || rowClicked && !i || containerClicked) {
|
|
89528
89862
|
// Click anywhere but is not inside builder area, modal, popup, tool or rte, then clear row/column (cell) selection
|
|
89529
89863
|
if (!this.dom.getSelected()) {
|
|
89530
89864
|
// if(!document.querySelector('.is-modal.active')) { // Additional (to prevent lost focus)
|
|
@@ -90246,6 +90580,7 @@ class ContentBuilder {
|
|
|
90246
90580
|
}
|
|
90247
90581
|
|
|
90248
90582
|
destroy() {
|
|
90583
|
+
this.doc.body.classList.remove('data-editor');
|
|
90249
90584
|
document.removeEventListener('click', this.doDocumentClick, false);
|
|
90250
90585
|
document.removeEventListener('keydown', this.doDocumentKeydown, false);
|
|
90251
90586
|
document.removeEventListener('mousedown', this.doDocumentMousedown, false);
|
|
@@ -103883,7 +104218,8 @@ class ContentBox {
|
|
|
103883
104218
|
display: flex !important;
|
|
103884
104219
|
}
|
|
103885
104220
|
.hard-select .box-select .is-overlay {
|
|
103886
|
-
z-index: -1;
|
|
104221
|
+
//z-index: -1;
|
|
104222
|
+
top:1px;left:1px;right:1px;bottom:1px;
|
|
103887
104223
|
}
|
|
103888
104224
|
.hard-select .section-select .is-section-tool {
|
|
103889
104225
|
display: block !important;
|