@innovastudio/contentbox 1.4.53 → 1.4.55

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.53",
4
+ "version": "1.4.55",
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.58",
49
+ "@innovastudio/contentbuilder": "^1.3.59",
50
50
  "js-beautify": "^1.14.0"
51
51
  }
52
52
  }
@@ -478,6 +478,12 @@ const prepareSvgIcons$1 = builder => {
478
478
  <rect x="5" y="6" width="14" height="10" rx="1"></rect>
479
479
  </symbol>
480
480
 
481
+ <symbol id="icon-device-tablet" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
482
+ <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
483
+ <rect x="5" y="3" width="14" height="18" rx="1"></rect>
484
+ <circle cx="12" cy="17" r="1"></circle>
485
+ </symbol>
486
+
481
487
  </defs>
482
488
  </svg>`;
483
489
  const builderStuff = builder.builderStuff;
@@ -694,8 +700,13 @@ class SideBar {
694
700
 
695
701
  <div style="padding-top:15px;width:100%;">
696
702
  <div class="is-label"><span>${out('Enable Animation')}</span>:</div>
697
- <div style="padding-top: 5px;">
703
+ <div style="padding-top: 5px;width:100%;display:flex;align-items:center;justify-content: space-between;">
698
704
  <label class="switch"><input class="cmd-live-preview" type="checkbox" checked=""><span class="slider round"></span></label>
705
+ ${this.builder.advancedTimeline ? `
706
+ <button tabindex="-1" title="${out('Edit')}" class="cmd-timeline-edit" style="width:30px;height:30px;cursor:pointer;">
707
+ <svg class="is-icon-flex"><use xlink:href="#icon-pencil"></use></svg>
708
+ </button>
709
+ ` : ''}
699
710
  </div>
700
711
  </div>
701
712
 
@@ -723,6 +734,11 @@ class SideBar {
723
734
  this.builder.editor.rte.zoomEnd(this.pageZoomSlider);
724
735
  };
725
736
 
737
+ const btnEditTimeline = this.pageQuickSettings.querySelector('.cmd-timeline-edit');
738
+ if (btnEditTimeline) btnEditTimeline.addEventListener('click', () => {
739
+ this.builder.timeline.edit();
740
+ });
741
+
726
742
  if (this.builder.useSidebar) {
727
743
  // jQuery('body').addClass('sidebar-active');
728
744
  let btns = document.querySelectorAll('.is-sidebar .is-sidebar-button');
@@ -28818,7 +28834,10 @@ class HtmlUtil {
28818
28834
  elms = tmp.querySelectorAll('[data-scroll-once]');
28819
28835
  dom$h.removeAttributes(elms, 'data-scroll-once'); // cleaning
28820
28836
 
28821
- elms = tmp.querySelectorAll('[data-bottom-top],[data-center],[data-center-bottom],[data-100-top],[data-50-top],[data-top],[data-top-bottom],[data-center-top],[data--300-bottom],[data--150-bottom],[data--50-bottom],[data-bottom],[data-100-bottom],[data-150-bottom],[data-400-bottom],' + '[data--400-bottom],[data--200-bottom],[data--100-bottom],[data-50-bottom],[data-200-bottom],[data-300-bottom],' + '[data-in],[data-in-150],[data-in-300],[data-cen--150],[data-cen],[data-cen-150],[data-out--300],[data-out--150],[data-out]');
28837
+ elms = tmp.querySelectorAll('[data-bottom-top],[data-center],[data-center-bottom],[data-100-top],[data-50-top],[data-top],[data-top-bottom],[data-center-top],[data--300-bottom],[data--150-bottom],[data--50-bottom],[data-bottom],[data-100-bottom],[data-150-bottom],[data-400-bottom],' + '[data--400-bottom],[data--200-bottom],[data--100-bottom],[data-50-bottom],[data-200-bottom],[data-300-bottom],' + '[data-in],[data-in-150],[data-in-300],' + '[data-cen--150],[data-cen],[data-cen-150],[data-out--300],[data-out--150],[data-out]' + '[data-t],[data-t-100],[data-t-200],[data-t-300],[data-t-400],' + '[data-t-500],[data-t-600],[data-t-700],[data-t-800],[data-t-900],[data-t-1000],' + '[data-t-1100],[data-t-1200],[data-t-1300],[data-t-1400],[data-t-1500],[data-t-1600],' + '[data-t-1700],[data-t-1800],[data-t-1900],[data-t-2000],[data-t-2100],[data-t-2200],' + '[data-t-2300],[data-t-2400],[data-t-2500],[data-t-2600],[data-t-2700],[data-t-2800]'); // elms = tmp.querySelectorAll('[data-bottom-top],[data-center],[data-center-bottom],[data-100-top],[data-50-top],[data-top],[data-top-bottom],[data-center-top],[data--300-bottom],[data--150-bottom],[data--50-bottom],[data-bottom],[data-100-bottom],[data-150-bottom],[data-400-bottom],' +
28838
+ // '[data--400-bottom],[data--200-bottom],[data--100-bottom],[data-50-bottom],[data-200-bottom],[data-300-bottom],' +
28839
+ // '[data-in],[data-in-150],[data-in-300],[data-cen--150],[data-cen],[data-cen-150],[data-out--300],[data-out--150],[data-out]');
28840
+
28822
28841
  Array.prototype.forEach.call(elms, elm => {
28823
28842
  elm.style.transition = '';
28824
28843
  elm.style.transform = '';
@@ -93964,7 +93983,7 @@ class AnimateScroll {
93964
93983
  </div>
93965
93984
 
93966
93985
  <div class="flex-wrap" style="margin-top:15px;">
93967
- <button title="${out('Disable Smooth Animation')}" class="cmd-disable-smoothanim" style="padding-left:15px;padding-right: 15px;">${out('Disable Smooth Animation')}</button>
93986
+ <button title="${out('Disable Easing')}" class="cmd-disable-smoothanim" style="padding-left:15px;padding-right: 15px;">${out('Disable Easing')}</button>
93968
93987
  <button title="${out('Hidden on Start')}" class="cmd-hidden-onstart" style="padding-left:15px;padding-right: 15px;">${out('Hidden on Start')}</button>
93969
93988
  </div>
93970
93989
 
@@ -94440,7 +94459,7 @@ class AnimateScroll {
94440
94459
  </div>
94441
94460
 
94442
94461
  <div class="flex-wrap" style="margin-top:20px;">
94443
- <button title="${out('Disable Smooth Animation')}" class="cmd-disable-smoothanim" data-value="data-center" style="padding-left:15px;padding-right: 15px;">${out('Disable Smooth Animation')}</button>
94462
+ <button title="${out('Disable Easing')}" class="cmd-disable-smoothanim" data-value="data-center" style="padding-left:15px;padding-right: 15px;">${out('Disable Easing')}</button>
94444
94463
  </div>
94445
94464
  </div>
94446
94465
 
@@ -97806,6 +97825,7 @@ class Timeline {
97806
97825
  bottom: 30px !important;
97807
97826
  left: auto !important;
97808
97827
  right: 30px !important;
97828
+ z-index: 10002 !important;
97809
97829
  }
97810
97830
 
97811
97831
  @media all and (max-width: 1919px) {
@@ -97863,7 +97883,7 @@ class Timeline {
97863
97883
  </div>
97864
97884
  <div style="position:absolute;box-sizing:border-box;top:0;left:0;width:100%;height:100%;border-top:transparent 35px solid;overflow-y:hidden;overflow-x:auto;">
97865
97885
 
97866
- <div style="width:1190px;">
97886
+ <div style="width:1180px;">
97867
97887
  <table class="table-timeline" style="margin:0 15px 10px;border-collapse:initial;">
97868
97888
  <tr class="table-header">
97869
97889
  <td style="text-align:center"> </td>
@@ -98378,14 +98398,17 @@ class Timeline {
98378
98398
  <option value="section">${out('Section')}</option>
98379
98399
  </select>
98380
98400
  </div>
98381
- <div class="flex-wrap" style="margin-right:50px">
98382
- <button title="${out('Large Screen')}" class="input-device on" data-value="" style="width:40px;height:34px;">
98401
+ <div class="flex-wrap" style="margin-right:30px">
98402
+ <button title="${out('Desktop')}" class="input-device on" data-value="" style="width:40px;height:34px;">
98383
98403
  <svg class="is-icon-flex" style="width:18px;height:18px"><use xlink:href="#icon-device-desktop"></use></svg>
98384
98404
  </button>
98385
- <button title="${out('Medium Screen')}" class="input-device" data-value="md" style="display:none;width:40px;height:34px;">
98405
+ <!--<button title="${out('Laptop/Tablet')}" class="input-device" data-value="md" style="width:40px;height:34px;">
98386
98406
  <svg class="is-icon-flex" style="width:18px;height:18px"><use xlink:href="#icon-device-laptop"></use></svg>
98407
+ </button>-->
98408
+ <button title="${out('Tablet')}" class="input-device" data-value="sm" style="width:40px;height:34px;">
98409
+ <svg class="is-icon-flex" style="width:18px;height:18px"><use xlink:href="#icon-device-tablet"></use></svg>
98387
98410
  </button>
98388
- <button title="${out('Small Screen')}" class="input-device" data-value="sm" style="width:40px;height:34px;">
98411
+ <button title="${out('Mobile')}" class="input-device" data-value="xs" style="width:40px;height:34px;">
98389
98412
  <svg class="is-icon-flex" style="width:13px;height:13px"><use xlink:href="#icon-device-mobile"></use></svg>
98390
98413
  </button>
98391
98414
  </div>
@@ -98402,16 +98425,21 @@ class Timeline {
98402
98425
  <button title="0" class="cmd-pin-space" data-value="medium" style="padding-left:15px;padding-right:15px;height:34px;">${out('Medium')}</button>
98403
98426
  <button title="20" class="cmd-pin-space" data-value="large" style="padding-left:15px;padding-right:15px;height:34px;">${out('Large')}</button>
98404
98427
  </div>
98405
- </div>
98406
-
98407
- <div class="flex-wrap" style="margin-left:50px">
98408
- <button title="${out('Disable Smooth Animation')}" class="cmd-disable-smoothanim" style="padding-left:15px;padding-right: 15px;">${out('Disable Smooth Animation')}</button>
98409
- <button title="${out('Hidden on Start')}" class="cmd-hidden-onstart" style="padding-left:15px;padding-right: 15px;">${out('Hidden on Start')}</button>
98428
+ <label for="chkPinDesktopOnly" style="margin:0;display:flex;">
98429
+ <input id="chkPinDesktopOnly" type="checkbox" style="margin:-1px 6px 0 0">
98430
+ <span>${out('Widescreen')}</span>.
98431
+ </label>
98410
98432
  </div>
98411
98433
 
98412
98434
  </div>
98413
98435
 
98414
98436
  <div class="flex-wrap" style="">
98437
+
98438
+ <div class="flex-wrap" style="margin-right:20px">
98439
+ <button title="${out('Disable Easing')}" class="cmd-disable-smoothanim" style="padding-left:15px;padding-right: 15px;">${out('Disable Easing')}</button>
98440
+ <button title="${out('Hidden on Start')}" class="cmd-hidden-onstart" style="padding-left:15px;padding-right: 15px;">${out('Hidden on Start')}</button>
98441
+ </div>
98442
+
98415
98443
  <button title="${out('Clear All')}" class="cmd-clear-timeline" style="height:34px;flex: none;width: auto;padding: 0px !important;box-shadow: none !important;background: transparent !important;">
98416
98444
  <svg class="is-icon-flex" style="width:10px;height:10px;"><use xlink:href="#icon-clean"></use></svg>
98417
98445
  <span style="margin-left:7px">${out('Clear All')}</span>
@@ -98601,7 +98629,7 @@ class Timeline {
98601
98629
 
98602
98630
  if (chkPinSection.checked) {
98603
98631
  section.classList.add('section-pin');
98604
- divPinSpacing.style.display = 'block';
98632
+ divPinSpacing.style.display = 'flex';
98605
98633
  let elms = divPinSpacing.querySelectorAll('.cmd-pin-space');
98606
98634
  elms.forEach(elm => {
98607
98635
  elm.classList.remove('on');
@@ -98614,6 +98642,21 @@ class Timeline {
98614
98642
  } //Trigger Change event
98615
98643
 
98616
98644
 
98645
+ this.builder.onChange();
98646
+ });
98647
+ const chkPinDesktopOnly = modalTimeline.querySelector('#chkPinDesktopOnly');
98648
+ chkPinDesktopOnly.addEventListener('click', () => {
98649
+ const section = this.builder.activeSection;
98650
+ if (!section) return;
98651
+ this.builder.editor.saveForUndo();
98652
+
98653
+ if (chkPinDesktopOnly.checked) {
98654
+ section.classList.add('m-pin-off');
98655
+ } else {
98656
+ section.classList.remove('m-pin-off');
98657
+ } //Trigger Change event
98658
+
98659
+
98617
98660
  this.builder.onChange();
98618
98661
  });
98619
98662
  const btnPinSpacing = divPinSpacing.querySelectorAll('.cmd-pin-space');
@@ -98900,12 +98943,20 @@ class Timeline {
98900
98943
 
98901
98944
  if (activeSection.classList.contains('section-pin')) {
98902
98945
  chkPinSection.checked = true;
98903
- divPinSpacing.style.display = 'block';
98946
+ divPinSpacing.style.display = 'flex';
98904
98947
  } else {
98905
98948
  chkPinSection.checked = false;
98906
98949
  divPinSpacing.style.display = 'none';
98907
98950
  }
98908
98951
 
98952
+ const chkPinDesktopOnly = this.modalTimeline.querySelector('#chkPinDesktopOnly');
98953
+
98954
+ if (activeSection.classList.contains('m-pin-off')) {
98955
+ chkPinDesktopOnly.checked = true;
98956
+ } else {
98957
+ chkPinDesktopOnly.checked = false;
98958
+ }
98959
+
98909
98960
  let elms = divPinSpacing.querySelectorAll('.cmd-pin-space');
98910
98961
  elms.forEach(elm => {
98911
98962
  elm.classList.remove('on');
@@ -98943,6 +98994,15 @@ class Timeline {
98943
98994
  this.fillValue(i * 100, activeElement);
98944
98995
  }
98945
98996
  }
98997
+ /*
98998
+ xs: Mobile: <= 414 (iPhone XR)
98999
+ sm: Tablet Portrait: <= 768 (iPad Mini 768x1024)
99000
+ md: Tablet Landscape: <= 1180 (iPad Air 1180x820)
99001
+ lg: Laptop: <= 1440
99002
+ xl: Desktop: <= 1920
99003
+ xxl: Desktop: > 1920
99004
+ */
99005
+
98946
99006
 
98947
99007
  fillValue(i, activeElement) {
98948
99008
  let s = '';
@@ -98950,14 +99010,11 @@ class Timeline {
98950
99010
  let css;
98951
99011
  let device = this.getDevice();
98952
99012
 
98953
- if (device === 'md') {
98954
- // 970-1280
98955
- css = activeElement.getAttribute('data-md-t' + s);
99013
+ if (device === 'xs') {
99014
+ css = activeElement.getAttribute('data-xs-t' + s);
98956
99015
  } else if (device === 'sm') {
98957
- // <970
98958
99016
  css = activeElement.getAttribute('data-sm-t' + s);
98959
99017
  } else {
98960
- // >1280
98961
99018
  css = activeElement.getAttribute('data-t' + s);
98962
99019
  }
98963
99020
 
@@ -99355,39 +99412,37 @@ class Timeline {
99355
99412
  this.builder.editor.saveForUndo();
99356
99413
  let device = this.getDevice();
99357
99414
 
99358
- if (device === 'md') {
99359
- // 970-1280
99360
- if (s !== '') activeElement.setAttribute('data-md-t', s);else activeElement.removeAttribute('data-md-t');
99361
- if (s_100 !== '') activeElement.setAttribute('data-md-t-100', s_100);else activeElement.removeAttribute('data-md-t-100');
99362
- if (s_200 !== '') activeElement.setAttribute('data-md-t-200', s_200);else activeElement.removeAttribute('data-md-t-200');
99363
- if (s_300 !== '') activeElement.setAttribute('data-md-t-300', s_300);else activeElement.removeAttribute('data-md-t-300');
99364
- if (s_400 !== '') activeElement.setAttribute('data-md-t-400', s_400);else activeElement.removeAttribute('data-md-t-400');
99365
- if (s_500 !== '') activeElement.setAttribute('data-md-t-500', s_500);else activeElement.removeAttribute('data-md-t-500');
99366
- if (s_600 !== '') activeElement.setAttribute('data-md-t-600', s_600);else activeElement.removeAttribute('data-md-t-600');
99367
- if (s_700 !== '') activeElement.setAttribute('data-md-t-700', s_700);else activeElement.removeAttribute('data-md-t-700');
99368
- if (s_800 !== '') activeElement.setAttribute('data-md-t-800', s_800);else activeElement.removeAttribute('data-md-t-800');
99369
- if (s_900 !== '') activeElement.setAttribute('data-md-t-900', s_900);else activeElement.removeAttribute('data-md-t-900');
99370
- if (s_1000 !== '') activeElement.setAttribute('data-md-t-1000', s_1000);else activeElement.removeAttribute('data-md-t-1000');
99371
- if (s_1100 !== '') activeElement.setAttribute('data-md-t-1100', s_1100);else activeElement.removeAttribute('data-md-t-1100');
99372
- if (s_1200 !== '') activeElement.setAttribute('data-md-t-1200', s_1200);else activeElement.removeAttribute('data-md-t-1200');
99373
- if (s_1300 !== '') activeElement.setAttribute('data-md-t-1300', s_1300);else activeElement.removeAttribute('data-md-t-1300');
99374
- if (s_1400 !== '') activeElement.setAttribute('data-md-t-1400', s_1400);else activeElement.removeAttribute('data-md-t-1400');
99375
- if (s_1500 !== '') activeElement.setAttribute('data-md-t-1500', s_1500);else activeElement.removeAttribute('data-md-t-1500');
99376
- if (s_1600 !== '') activeElement.setAttribute('data-md-t-1600', s_1600);else activeElement.removeAttribute('data-md-t-1600');
99377
- if (s_1700 !== '') activeElement.setAttribute('data-md-t-1700', s_1700);else activeElement.removeAttribute('data-md-t-1700');
99378
- if (s_1800 !== '') activeElement.setAttribute('data-md-t-1800', s_1800);else activeElement.removeAttribute('data-md-t-1800');
99379
- if (s_1900 !== '') activeElement.setAttribute('data-md-t-1900', s_1900);else activeElement.removeAttribute('data-md-t-1900');
99380
- if (s_2000 !== '') activeElement.setAttribute('data-md-t-2000', s_2000);else activeElement.removeAttribute('data-md-t-2000');
99381
- if (s_2100 !== '') activeElement.setAttribute('data-md-t-2100', s_2100);else activeElement.removeAttribute('data-md-t-2100');
99382
- if (s_2200 !== '') activeElement.setAttribute('data-md-t-2200', s_2200);else activeElement.removeAttribute('data-md-t-2200');
99383
- if (s_2300 !== '') activeElement.setAttribute('data-md-t-2300', s_2300);else activeElement.removeAttribute('data-md-t-2300');
99384
- if (s_2400 !== '') activeElement.setAttribute('data-md-t-2400', s_2400);else activeElement.removeAttribute('data-md-t-2400');
99385
- if (s_2500 !== '') activeElement.setAttribute('data-md-t-2500', s_2500);else activeElement.removeAttribute('data-md-t-2500');
99386
- if (s_2600 !== '') activeElement.setAttribute('data-md-t-2600', s_2600);else activeElement.removeAttribute('data-md-t-2600');
99387
- if (s_2700 !== '') activeElement.setAttribute('data-md-t-2700', s_2700);else activeElement.removeAttribute('data-md-t-2700');
99388
- if (s_2800 !== '') activeElement.setAttribute('data-md-t-2800', s_2800);else activeElement.removeAttribute('data-md-t-2800');
99415
+ if (device === 'xs') {
99416
+ if (s !== '') activeElement.setAttribute('data-xs-t', s);else activeElement.removeAttribute('data-xs-t');
99417
+ if (s_100 !== '') activeElement.setAttribute('data-xs-t-100', s_100);else activeElement.removeAttribute('data-xs-t-100');
99418
+ if (s_200 !== '') activeElement.setAttribute('data-xs-t-200', s_200);else activeElement.removeAttribute('data-xs-t-200');
99419
+ if (s_300 !== '') activeElement.setAttribute('data-xs-t-300', s_300);else activeElement.removeAttribute('data-xs-t-300');
99420
+ if (s_400 !== '') activeElement.setAttribute('data-xs-t-400', s_400);else activeElement.removeAttribute('data-xs-t-400');
99421
+ if (s_500 !== '') activeElement.setAttribute('data-xs-t-500', s_500);else activeElement.removeAttribute('data-xs-t-500');
99422
+ if (s_600 !== '') activeElement.setAttribute('data-xs-t-600', s_600);else activeElement.removeAttribute('data-xs-t-600');
99423
+ if (s_700 !== '') activeElement.setAttribute('data-xs-t-700', s_700);else activeElement.removeAttribute('data-xs-t-700');
99424
+ if (s_800 !== '') activeElement.setAttribute('data-xs-t-800', s_800);else activeElement.removeAttribute('data-xs-t-800');
99425
+ if (s_900 !== '') activeElement.setAttribute('data-xs-t-900', s_900);else activeElement.removeAttribute('data-xs-t-900');
99426
+ if (s_1000 !== '') activeElement.setAttribute('data-xs-t-1000', s_1000);else activeElement.removeAttribute('data-xs-t-1000');
99427
+ if (s_1100 !== '') activeElement.setAttribute('data-xs-t-1100', s_1100);else activeElement.removeAttribute('data-xs-t-1100');
99428
+ if (s_1200 !== '') activeElement.setAttribute('data-xs-t-1200', s_1200);else activeElement.removeAttribute('data-xs-t-1200');
99429
+ if (s_1300 !== '') activeElement.setAttribute('data-xs-t-1300', s_1300);else activeElement.removeAttribute('data-xs-t-1300');
99430
+ if (s_1400 !== '') activeElement.setAttribute('data-xs-t-1400', s_1400);else activeElement.removeAttribute('data-xs-t-1400');
99431
+ if (s_1500 !== '') activeElement.setAttribute('data-xs-t-1500', s_1500);else activeElement.removeAttribute('data-xs-t-1500');
99432
+ if (s_1600 !== '') activeElement.setAttribute('data-xs-t-1600', s_1600);else activeElement.removeAttribute('data-xs-t-1600');
99433
+ if (s_1700 !== '') activeElement.setAttribute('data-xs-t-1700', s_1700);else activeElement.removeAttribute('data-xs-t-1700');
99434
+ if (s_1800 !== '') activeElement.setAttribute('data-xs-t-1800', s_1800);else activeElement.removeAttribute('data-xs-t-1800');
99435
+ if (s_1900 !== '') activeElement.setAttribute('data-xs-t-1900', s_1900);else activeElement.removeAttribute('data-xs-t-1900');
99436
+ if (s_2000 !== '') activeElement.setAttribute('data-xs-t-2000', s_2000);else activeElement.removeAttribute('data-xs-t-2000');
99437
+ if (s_2100 !== '') activeElement.setAttribute('data-xs-t-2100', s_2100);else activeElement.removeAttribute('data-xs-t-2100');
99438
+ if (s_2200 !== '') activeElement.setAttribute('data-xs-t-2200', s_2200);else activeElement.removeAttribute('data-xs-t-2200');
99439
+ if (s_2300 !== '') activeElement.setAttribute('data-xs-t-2300', s_2300);else activeElement.removeAttribute('data-xs-t-2300');
99440
+ if (s_2400 !== '') activeElement.setAttribute('data-xs-t-2400', s_2400);else activeElement.removeAttribute('data-xs-t-2400');
99441
+ if (s_2500 !== '') activeElement.setAttribute('data-xs-t-2500', s_2500);else activeElement.removeAttribute('data-xs-t-2500');
99442
+ if (s_2600 !== '') activeElement.setAttribute('data-xs-t-2600', s_2600);else activeElement.removeAttribute('data-xs-t-2600');
99443
+ if (s_2700 !== '') activeElement.setAttribute('data-xs-t-2700', s_2700);else activeElement.removeAttribute('data-xs-t-2700');
99444
+ if (s_2800 !== '') activeElement.setAttribute('data-xs-t-2800', s_2800);else activeElement.removeAttribute('data-xs-t-2800');
99389
99445
  } else if (device === 'sm') {
99390
- // <970
99391
99446
  if (s !== '') activeElement.setAttribute('data-sm-t', s);else activeElement.removeAttribute('data-sm-t');
99392
99447
  if (s_100 !== '') activeElement.setAttribute('data-sm-t-100', s_100);else activeElement.removeAttribute('data-sm-t-100');
99393
99448
  if (s_200 !== '') activeElement.setAttribute('data-sm-t-200', s_200);else activeElement.removeAttribute('data-sm-t-200');
@@ -99418,7 +99473,6 @@ class Timeline {
99418
99473
  if (s_2700 !== '') activeElement.setAttribute('data-sm-t-2700', s_2700);else activeElement.removeAttribute('data-sm-t-2700');
99419
99474
  if (s_2800 !== '') activeElement.setAttribute('data-sm-t-2800', s_2800);else activeElement.removeAttribute('data-sm-t-2800');
99420
99475
  } else {
99421
- // >1280
99422
99476
  if (s !== '') activeElement.setAttribute('data-t', s);else activeElement.removeAttribute('data-t');
99423
99477
  if (s_100 !== '') activeElement.setAttribute('data-t-100', s_100);else activeElement.removeAttribute('data-t-100');
99424
99478
  if (s_200 !== '') activeElement.setAttribute('data-t-200', s_200);else activeElement.removeAttribute('data-t-200');
@@ -99480,39 +99534,37 @@ class Timeline {
99480
99534
  cleanup(activeElement) {
99481
99535
  let device = this.getDevice();
99482
99536
 
99483
- if (device === 'md') {
99484
- // 970-1280
99485
- activeElement.removeAttribute('data-md-t');
99486
- activeElement.removeAttribute('data-md-t-100');
99487
- activeElement.removeAttribute('data-md-t-200');
99488
- activeElement.removeAttribute('data-md-t-300');
99489
- activeElement.removeAttribute('data-md-t-400');
99490
- activeElement.removeAttribute('data-md-t-500');
99491
- activeElement.removeAttribute('data-md-t-600');
99492
- activeElement.removeAttribute('data-md-t-700');
99493
- activeElement.removeAttribute('data-md-t-800');
99494
- activeElement.removeAttribute('data-md-t-900');
99495
- activeElement.removeAttribute('data-md-t-1000');
99496
- activeElement.removeAttribute('data-md-t-1100');
99497
- activeElement.removeAttribute('data-md-t-1200');
99498
- activeElement.removeAttribute('data-md-t-1300');
99499
- activeElement.removeAttribute('data-md-t-1400');
99500
- activeElement.removeAttribute('data-md-t-1500');
99501
- activeElement.removeAttribute('data-md-t-1600');
99502
- activeElement.removeAttribute('data-md-t-1700');
99503
- activeElement.removeAttribute('data-md-t-1800');
99504
- activeElement.removeAttribute('data-md-t-1900');
99505
- activeElement.removeAttribute('data-md-t-2000');
99506
- activeElement.removeAttribute('data-md-t-2100');
99507
- activeElement.removeAttribute('data-md-t-2200');
99508
- activeElement.removeAttribute('data-md-t-2300');
99509
- activeElement.removeAttribute('data-md-t-2400');
99510
- activeElement.removeAttribute('data-md-t-2500');
99511
- activeElement.removeAttribute('data-md-t-2600');
99512
- activeElement.removeAttribute('data-md-t-2700');
99513
- activeElement.removeAttribute('data-md-t-2800');
99537
+ if (device === 'xs') {
99538
+ activeElement.removeAttribute('data-xs-t');
99539
+ activeElement.removeAttribute('data-xs-t-100');
99540
+ activeElement.removeAttribute('data-xs-t-200');
99541
+ activeElement.removeAttribute('data-xs-t-300');
99542
+ activeElement.removeAttribute('data-xs-t-400');
99543
+ activeElement.removeAttribute('data-xs-t-500');
99544
+ activeElement.removeAttribute('data-xs-t-600');
99545
+ activeElement.removeAttribute('data-xs-t-700');
99546
+ activeElement.removeAttribute('data-xs-t-800');
99547
+ activeElement.removeAttribute('data-xs-t-900');
99548
+ activeElement.removeAttribute('data-xs-t-1000');
99549
+ activeElement.removeAttribute('data-xs-t-1100');
99550
+ activeElement.removeAttribute('data-xs-t-1200');
99551
+ activeElement.removeAttribute('data-xs-t-1300');
99552
+ activeElement.removeAttribute('data-xs-t-1400');
99553
+ activeElement.removeAttribute('data-xs-t-1500');
99554
+ activeElement.removeAttribute('data-xs-t-1600');
99555
+ activeElement.removeAttribute('data-xs-t-1700');
99556
+ activeElement.removeAttribute('data-xs-t-1800');
99557
+ activeElement.removeAttribute('data-xs-t-1900');
99558
+ activeElement.removeAttribute('data-xs-t-2000');
99559
+ activeElement.removeAttribute('data-xs-t-2100');
99560
+ activeElement.removeAttribute('data-xs-t-2200');
99561
+ activeElement.removeAttribute('data-xs-t-2300');
99562
+ activeElement.removeAttribute('data-xs-t-2400');
99563
+ activeElement.removeAttribute('data-xs-t-2500');
99564
+ activeElement.removeAttribute('data-xs-t-2600');
99565
+ activeElement.removeAttribute('data-xs-t-2700');
99566
+ activeElement.removeAttribute('data-xs-t-2800');
99514
99567
  } else if (device === 'sm') {
99515
- // <970
99516
99568
  activeElement.removeAttribute('data-sm-t');
99517
99569
  activeElement.removeAttribute('data-sm-t-100');
99518
99570
  activeElement.removeAttribute('data-sm-t-200');
@@ -99543,7 +99595,6 @@ class Timeline {
99543
99595
  activeElement.removeAttribute('data-sm-t-2700');
99544
99596
  activeElement.removeAttribute('data-sm-t-2800');
99545
99597
  } else {
99546
- // >1280
99547
99598
  activeElement.removeAttribute('data-t');
99548
99599
  activeElement.removeAttribute('data-t-100');
99549
99600
  activeElement.removeAttribute('data-t-200');
@@ -99765,7 +99816,7 @@ class Timeline {
99765
99816
  if (this.builder.activeSection) this.builder.activeSection.classList.add('section-select'); // Close all opened sidebar
99766
99817
 
99767
99818
  this.builder.sidebar.closeSidebar();
99768
- this.modalAnimateScroll.classList.remove('active');
99819
+ this.builder.animateScroll.modalAnimateScroll.classList.remove('active');
99769
99820
  this.modalTimeline.classList.add('active'); // this.clickContent();
99770
99821
  // clean UI for selection only
99771
99822
 
@@ -100037,6 +100088,7 @@ class ContentBox {
100037
100088
  maxEmbedImageWidth: 1600,
100038
100089
  zoom: 0.6,
100039
100090
  shortenHTML: true,
100091
+ advancedTimeline: false,
100040
100092
  contentStyleWithSample: false,
100041
100093
  contentSizes: [300, 320, 340, 360, 380, 400, 420, 440, 460, 480, 500, 520, 540, 560, 580, 600, 620, 640, 660, 680, 700, 720, 740, 760, 780, 800, 820, 840, 860, 880, 900, 920, 940, 960, 970, 980, 1000, 1020, 1040, 1050, 1060, 1080, 1100, 1120, 1140, 1160, 1180, 1200, 1220, 1240, 1260, 1280, 1300, 1320, 1340, 1360, 1380, 1400, 1420, 1440, 1460, 1480, 1500, 1520, 1540, 1560, 1580, 1600, 1620, 1640, 1660, 1680, 1700, 1720, 1740, 1760, 1780, 1800, 1820, 1840, 1860, 1880, 1900, 1920, 1940, 1960, 1980, 2000, 2020, 2040, 2060, 2080, 2100, 2120, 2140, 2160, 2180, 2200, 2220, 2240, 2260, 2280, 2300, 2320, 2340, 2360, 2380, 2400, 2420, 2440, 2460, 2480, 2500, 2520, 2540, 2560, 2580, 2600, 2620, 2640, 2660, 2680, 2700],
100042
100094
  contentStyles: {