@designcrowd/library.brand-page 5.15.24 → 5.15.25-2

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.
Files changed (33) hide show
  1. package/lib/src/{CreatedOnBrandCrowd-de-de-D7rRFKgr.js → CreatedOnBrandCrowd-de-de-DvyH2DZQ.js} +1 -1
  2. package/lib/src/{CreatedOnBrandCrowd-en-us-CaTNBPEK.js → CreatedOnBrandCrowd-en-us-BkhFX5IH.js} +1 -1
  3. package/lib/src/{CreatedOnBrandCrowd-es-es-zdp6A-zF.js → CreatedOnBrandCrowd-es-es-BXVsJsEz.js} +1 -1
  4. package/lib/src/{CreatedOnBrandCrowd-fr-fr-TS3XLzo6.js → CreatedOnBrandCrowd-fr-ca-xVXVxfTs.js} +1 -1
  5. package/lib/src/{CreatedOnBrandCrowd-fr-ca-TS3XLzo6.js → CreatedOnBrandCrowd-fr-fr-xVXVxfTs.js} +1 -1
  6. package/lib/src/{CreatedOnBrandCrowd-pt-pt-DkyF49-j.js → CreatedOnBrandCrowd-pt-br-BClAECgN.js} +1 -1
  7. package/lib/src/{CreatedOnBrandCrowd-pt-br-DkyF49-j.js → CreatedOnBrandCrowd-pt-pt-BClAECgN.js} +1 -1
  8. package/lib/src/{CreatedOnDcom-de-de-BckUcm9C.js → CreatedOnDcom-de-de-DlzLknwo.js} +1 -1
  9. package/lib/src/{CreatedOnDcom-en-us-CqgIo3AG.js → CreatedOnDcom-en-us-NjczWDeO.js} +1 -1
  10. package/lib/src/{CreatedOnDcom-es-es-DOEOu0Gx.js → CreatedOnDcom-es-es-Dazo-CXa.js} +1 -1
  11. package/lib/src/{CreatedOnDcom-fr-ca-DjbwfTN3.js → CreatedOnDcom-fr-ca-DXzP_BfL.js} +1 -1
  12. package/lib/src/{CreatedOnDcom-fr-fr-By17z-yX.js → CreatedOnDcom-fr-fr-DSBumzDY.js} +1 -1
  13. package/lib/src/{CreatedOnDcom-pt-br-D9AAR_em.js → CreatedOnDcom-pt-br-DrQC5tTd.js} +1 -1
  14. package/lib/src/{CreatedOnDcom-pt-pt-Bz8SLuU2.js → CreatedOnDcom-pt-pt-CJubdGWs.js} +1 -1
  15. package/lib/src/brand-page/utils/migration/migration-07.js +1 -1
  16. package/lib/src/brand-page-maker/components/template-preview/TemplatePreview.mixin.d.ts +287 -1
  17. package/lib/src/brand-page-maker/components/template-preview/TemplatePreview.mixin.js +60 -5
  18. package/lib/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.js +11 -1
  19. package/lib/src/css/library.brand-page-brandCrowd.min.css +43 -19
  20. package/lib/src/css/library.brand-page-brandPage.min.css +43 -19
  21. package/lib/src/css/library.brand-page-designCom.min.css +43 -19
  22. package/lib/src/css/library.brand-page-preview.min.css +43 -19
  23. package/lib/src/index.mjs +1 -1
  24. package/lib/src/{lib-CgMLUv91.js → lib-BGjUW0Xe.js} +5839 -5764
  25. package/lib/src/shared/template-settings/store/template-settings-store.js +22 -5
  26. package/package.json +1 -1
  27. package/src/brand-page/components/page/Page.vue +2 -2
  28. package/src/brand-page/utils/migration/migration-07.ts +6 -4
  29. package/src/brand-page-maker/components/template-preview/TemplatePreview.mixin.ts +87 -6
  30. package/src/brand-page-maker/components/template-preview/TemplatePreview.vue +42 -4
  31. package/src/brand-page-maker/components/template-preview-with-state/TemplatePreviewWithState.vue +4 -6
  32. package/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.ts +16 -1
  33. package/src/shared/template-settings/store/template-settings-store.ts +29 -8
package/lib/src/css/library.brand-page-brandCrowd.min.css CHANGED
@@ -1396,6 +1396,12 @@ a.maker-anchor {
1396
1396
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1397
1397
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
1398
1398
  }
1399
+ .tw-scale-150 {
1400
+ --tw-scale-x: 1.5;
1401
+ --tw-scale-y: 1.5;
1402
+ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1403
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
1404
+ }
1399
1405
  .tw-transform {
1400
1406
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1401
1407
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
@@ -7067,14 +7073,14 @@ body {
7067
7073
  line-height: 1.5;
7068
7074
  }
7069
7075
 
7070
- .brand-page-root[data-v-4eac537a] {
7076
+ .brand-page-root[data-v-d4cc0d12] {
7071
7077
  height: 100%;
7072
7078
  }
7073
- .sortable[data-v-4eac537a] {
7079
+ .sortable[data-v-d4cc0d12] {
7074
7080
  outline-color: #F7768C;
7075
7081
  outline-width: 0.2rem;
7076
7082
  }
7077
- .brand-page[data-v-4eac537a] {
7083
+ .brand-page[data-v-d4cc0d12] {
7078
7084
  -webkit-box-sizing: border-box;
7079
7085
  box-sizing: border-box;
7080
7086
  display: -webkit-box;
@@ -7086,7 +7092,7 @@ body {
7086
7092
  -ms-flex-direction: column;
7087
7093
  flex-direction: column;
7088
7094
  }
7089
- .brand-page__inner--default[data-v-4eac537a] {
7095
+ .brand-page__inner--default[data-v-d4cc0d12] {
7090
7096
  position: relative;
7091
7097
  z-index: 10;
7092
7098
  display: -webkit-box;
@@ -7098,16 +7104,16 @@ body {
7098
7104
  -ms-flex-direction: column;
7099
7105
  flex-direction: column;
7100
7106
  }
7101
- .brand-page__inner--desktop[data-v-4eac537a] {
7107
+ .brand-page__inner--desktop[data-v-d4cc0d12] {
7102
7108
  min-height: 100vh;
7103
7109
  }
7104
- .brand-site__header[data-v-4eac537a] {
7110
+ .brand-site__header[data-v-d4cc0d12] {
7105
7111
  container-type: inline-size;
7106
7112
  }
7107
- .brand-page__header[data-v-4eac537a] {
7113
+ .brand-page__header[data-v-d4cc0d12] {
7108
7114
  padding-top: var(--page-padding);
7109
7115
  }
7110
- .brand-page__content--default[data-v-4eac537a] {
7116
+ .brand-page__content--default[data-v-d4cc0d12] {
7111
7117
  margin-left: auto;
7112
7118
  margin-right: auto;
7113
7119
  margin-bottom: 2.5rem;
@@ -7124,7 +7130,7 @@ body {
7124
7130
  flex-direction: column;
7125
7131
  max-width: var(--page-max-width);
7126
7132
  }
7127
- .brand-page__content--desktop[data-v-4eac537a] {
7133
+ .brand-page__content--desktop[data-v-d4cc0d12] {
7128
7134
  margin-left: auto;
7129
7135
  margin-right: auto;
7130
7136
  display: -webkit-box;
@@ -7140,15 +7146,15 @@ body {
7140
7146
  flex-direction: column;
7141
7147
  max-width: 100%;
7142
7148
  }
7143
- .brand-page__content--inner[data-v-4eac537a] {
7149
+ .brand-page__content--inner[data-v-d4cc0d12] {
7144
7150
  padding-left: var(--page-padding);
7145
7151
  padding-right: var(--page-padding);
7146
7152
  }
7147
- .brand-page__content--inner--brandsite[data-v-4eac537a] {
7153
+ .brand-page__content--inner--brandsite[data-v-d4cc0d12] {
7148
7154
  max-width: var(--brandsite-max-width);
7149
7155
  margin: 0 auto;
7150
7156
  }
7151
- .brand-page__content--outline-selected[data-v-4eac537a] {
7157
+ .brand-page__content--outline-selected[data-v-d4cc0d12] {
7152
7158
  position: relative;
7153
7159
  z-index: 10;
7154
7160
  outline-color: #F7768C;
@@ -7156,20 +7162,20 @@ body {
7156
7162
  outline-style: dashed;
7157
7163
  outline-offset: -0.25rem;
7158
7164
  }
7159
- .brand-page__content--outline-footer-selected[data-v-4eac537a] {
7165
+ .brand-page__content--outline-footer-selected[data-v-d4cc0d12] {
7160
7166
  outline-color: #f7768c;
7161
7167
  outline-width: 0.2rem;
7162
7168
  outline-style: dashed;
7163
7169
  outline-offset: -0.25rem;
7164
7170
  }
7165
7171
  @media (max-width: 640px) {
7166
- .brand-page__content--inner--full-width[data-v-4eac537a] {
7172
+ .brand-page__content--inner--full-width[data-v-d4cc0d12] {
7167
7173
  padding-left: 0;
7168
7174
  padding-right: 0;
7169
7175
  }
7170
7176
  }
7171
7177
  @media (min-width: 640px) {
7172
- .brand-page__content--inner--full-width[data-v-4eac537a] {
7178
+ .brand-page__content--inner--full-width[data-v-d4cc0d12] {
7173
7179
  padding-left: var(--page-padding);
7174
7180
  padding-right: var(--page-padding);
7175
7181
  }
@@ -8627,11 +8633,11 @@ input[type='number'][data-v-28a532b4] {
8627
8633
  }
8628
8634
  }
8629
8635
 
8630
- .template-preview[data-v-c5fa6125] {
8636
+ .template-preview[data-v-0684c5a3] {
8631
8637
  position: relative;
8632
8638
  background-attachment: initial !important
8633
8639
  }
8634
- .template-preview__overlay[data-v-c5fa6125] {
8640
+ .template-preview__overlay[data-v-0684c5a3] {
8635
8641
  position: absolute;
8636
8642
  top: 0px;
8637
8643
  left: 0px;
@@ -8642,10 +8648,28 @@ input[type='number'][data-v-28a532b4] {
8642
8648
  cursor: pointer;
8643
8649
  opacity: 0
8644
8650
  }
8645
- .template-preview__page[data-v-c5fa6125] {
8651
+ .template-preview__image-container[data-v-0684c5a3] {
8652
+ pointer-events: none;
8653
+ height: 100%;
8654
+ width: 100%
8655
+ }
8656
+ .template-preview__image[data-v-0684c5a3] {
8657
+ height: 100%;
8658
+ width: 100%;
8659
+ -o-object-fit: fill;
8660
+ object-fit: fill;
8661
+ -webkit-transition: -webkit-filter 0.2s ease;
8662
+ transition: -webkit-filter 0.2s ease;
8663
+ transition: filter 0.2s ease;
8664
+ transition: filter 0.2s ease, -webkit-filter 0.2s ease
8665
+ }
8666
+ .template-preview__page[data-v-0684c5a3] {
8646
8667
  pointer-events: none
8647
8668
  }
8648
- .template-preview[data-v-c5fa6125] .c-shape-background {
8669
+ .template-preview[data-v-0684c5a3] .c-shape-background {
8670
+ position: absolute
8671
+ }
8672
+ .template-preview__image[data-v-0684c5a3] .c-shape-background {
8649
8673
  position: absolute
8650
8674
  }
8651
8675
 
package/lib/src/css/library.brand-page-brandPage.min.css CHANGED
@@ -1818,6 +1818,12 @@ a.maker-anchor {
1818
1818
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1819
1819
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1820
1820
  }
1821
+ .tw-scale-150 {
1822
+ --tw-scale-x: 1.5;
1823
+ --tw-scale-y: 1.5;
1824
+ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1825
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1826
+ }
1821
1827
  .tw-transform {
1822
1828
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1823
1829
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -7395,14 +7401,14 @@ body {
7395
7401
  line-height: 1.5;
7396
7402
  }
7397
7403
 
7398
- .brand-page-root[data-v-4eac537a] {
7404
+ .brand-page-root[data-v-d4cc0d12] {
7399
7405
  height: 100%;
7400
7406
  }
7401
- .sortable[data-v-4eac537a] {
7407
+ .sortable[data-v-d4cc0d12] {
7402
7408
  outline-color: #F7768C;
7403
7409
  outline-width: 0.2rem;
7404
7410
  }
7405
- .brand-page[data-v-4eac537a] {
7411
+ .brand-page[data-v-d4cc0d12] {
7406
7412
  -webkit-box-sizing: border-box;
7407
7413
  box-sizing: border-box;
7408
7414
  display: -webkit-box;
@@ -7414,7 +7420,7 @@ body {
7414
7420
  -ms-flex-direction: column;
7415
7421
  flex-direction: column;
7416
7422
  }
7417
- .brand-page__inner--default[data-v-4eac537a] {
7423
+ .brand-page__inner--default[data-v-d4cc0d12] {
7418
7424
  position: relative;
7419
7425
  z-index: 10;
7420
7426
  display: -webkit-box;
@@ -7426,16 +7432,16 @@ body {
7426
7432
  -ms-flex-direction: column;
7427
7433
  flex-direction: column;
7428
7434
  }
7429
- .brand-page__inner--desktop[data-v-4eac537a] {
7435
+ .brand-page__inner--desktop[data-v-d4cc0d12] {
7430
7436
  min-height: 100vh;
7431
7437
  }
7432
- .brand-site__header[data-v-4eac537a] {
7438
+ .brand-site__header[data-v-d4cc0d12] {
7433
7439
  container-type: inline-size;
7434
7440
  }
7435
- .brand-page__header[data-v-4eac537a] {
7441
+ .brand-page__header[data-v-d4cc0d12] {
7436
7442
  padding-top: var(--page-padding);
7437
7443
  }
7438
- .brand-page__content--default[data-v-4eac537a] {
7444
+ .brand-page__content--default[data-v-d4cc0d12] {
7439
7445
  margin-left: auto;
7440
7446
  margin-right: auto;
7441
7447
  margin-bottom: 2.5rem;
@@ -7452,7 +7458,7 @@ body {
7452
7458
  flex-direction: column;
7453
7459
  max-width: var(--page-max-width);
7454
7460
  }
7455
- .brand-page__content--desktop[data-v-4eac537a] {
7461
+ .brand-page__content--desktop[data-v-d4cc0d12] {
7456
7462
  margin-left: auto;
7457
7463
  margin-right: auto;
7458
7464
  display: -webkit-box;
@@ -7468,15 +7474,15 @@ body {
7468
7474
  flex-direction: column;
7469
7475
  max-width: 100%;
7470
7476
  }
7471
- .brand-page__content--inner[data-v-4eac537a] {
7477
+ .brand-page__content--inner[data-v-d4cc0d12] {
7472
7478
  padding-left: var(--page-padding);
7473
7479
  padding-right: var(--page-padding);
7474
7480
  }
7475
- .brand-page__content--inner--brandsite[data-v-4eac537a] {
7481
+ .brand-page__content--inner--brandsite[data-v-d4cc0d12] {
7476
7482
  max-width: var(--brandsite-max-width);
7477
7483
  margin: 0 auto;
7478
7484
  }
7479
- .brand-page__content--outline-selected[data-v-4eac537a] {
7485
+ .brand-page__content--outline-selected[data-v-d4cc0d12] {
7480
7486
  position: relative;
7481
7487
  z-index: 10;
7482
7488
  outline-color: #F7768C;
@@ -7484,20 +7490,20 @@ body {
7484
7490
  outline-style: dashed;
7485
7491
  outline-offset: -0.25rem;
7486
7492
  }
7487
- .brand-page__content--outline-footer-selected[data-v-4eac537a] {
7493
+ .brand-page__content--outline-footer-selected[data-v-d4cc0d12] {
7488
7494
  outline-color: #f7768c;
7489
7495
  outline-width: 0.2rem;
7490
7496
  outline-style: dashed;
7491
7497
  outline-offset: -0.25rem;
7492
7498
  }
7493
7499
  @media (max-width: 640px) {
7494
- .brand-page__content--inner--full-width[data-v-4eac537a] {
7500
+ .brand-page__content--inner--full-width[data-v-d4cc0d12] {
7495
7501
  padding-left: 0;
7496
7502
  padding-right: 0;
7497
7503
  }
7498
7504
  }
7499
7505
  @media (min-width: 640px) {
7500
- .brand-page__content--inner--full-width[data-v-4eac537a] {
7506
+ .brand-page__content--inner--full-width[data-v-d4cc0d12] {
7501
7507
  padding-left: var(--page-padding);
7502
7508
  padding-right: var(--page-padding);
7503
7509
  }
@@ -8955,11 +8961,11 @@ input[type='number'][data-v-28a532b4] {
8955
8961
  }
8956
8962
  }
8957
8963
 
8958
- .template-preview[data-v-c5fa6125] {
8964
+ .template-preview[data-v-0684c5a3] {
8959
8965
  position: relative;
8960
8966
  background-attachment: initial !important
8961
8967
  }
8962
- .template-preview__overlay[data-v-c5fa6125] {
8968
+ .template-preview__overlay[data-v-0684c5a3] {
8963
8969
  position: absolute;
8964
8970
  top: 0px;
8965
8971
  left: 0px;
@@ -8970,10 +8976,28 @@ input[type='number'][data-v-28a532b4] {
8970
8976
  cursor: pointer;
8971
8977
  opacity: 0
8972
8978
  }
8973
- .template-preview__page[data-v-c5fa6125] {
8979
+ .template-preview__image-container[data-v-0684c5a3] {
8980
+ pointer-events: none;
8981
+ height: 100%;
8982
+ width: 100%
8983
+ }
8984
+ .template-preview__image[data-v-0684c5a3] {
8985
+ height: 100%;
8986
+ width: 100%;
8987
+ -o-object-fit: fill;
8988
+ object-fit: fill;
8989
+ -webkit-transition: -webkit-filter 0.2s ease;
8990
+ transition: -webkit-filter 0.2s ease;
8991
+ transition: filter 0.2s ease;
8992
+ transition: filter 0.2s ease, -webkit-filter 0.2s ease
8993
+ }
8994
+ .template-preview__page[data-v-0684c5a3] {
8974
8995
  pointer-events: none
8975
8996
  }
8976
- .template-preview[data-v-c5fa6125] .c-shape-background {
8997
+ .template-preview[data-v-0684c5a3] .c-shape-background {
8998
+ position: absolute
8999
+ }
9000
+ .template-preview__image[data-v-0684c5a3] .c-shape-background {
8977
9001
  position: absolute
8978
9002
  }
8979
9003
 
package/lib/src/css/library.brand-page-designCom.min.css CHANGED
@@ -1414,6 +1414,12 @@ a:not(.tw-lowercase) {
1414
1414
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1415
1415
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
1416
1416
  }
1417
+ .tw-scale-150 {
1418
+ --tw-scale-x: 1.5;
1419
+ --tw-scale-y: 1.5;
1420
+ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1421
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
1422
+ }
1417
1423
  .tw-transform {
1418
1424
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1419
1425
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
@@ -7085,14 +7091,14 @@ body {
7085
7091
  line-height: 1.5;
7086
7092
  }
7087
7093
 
7088
- .brand-page-root[data-v-4eac537a] {
7094
+ .brand-page-root[data-v-d4cc0d12] {
7089
7095
  height: 100%;
7090
7096
  }
7091
- .sortable[data-v-4eac537a] {
7097
+ .sortable[data-v-d4cc0d12] {
7092
7098
  outline-color: #b2bdfb;
7093
7099
  outline-width: 0.2rem;
7094
7100
  }
7095
- .brand-page[data-v-4eac537a] {
7101
+ .brand-page[data-v-d4cc0d12] {
7096
7102
  -webkit-box-sizing: border-box;
7097
7103
  box-sizing: border-box;
7098
7104
  display: -webkit-box;
@@ -7104,7 +7110,7 @@ body {
7104
7110
  -ms-flex-direction: column;
7105
7111
  flex-direction: column;
7106
7112
  }
7107
- .brand-page__inner--default[data-v-4eac537a] {
7113
+ .brand-page__inner--default[data-v-d4cc0d12] {
7108
7114
  position: relative;
7109
7115
  z-index: 10;
7110
7116
  display: -webkit-box;
@@ -7116,16 +7122,16 @@ body {
7116
7122
  -ms-flex-direction: column;
7117
7123
  flex-direction: column;
7118
7124
  }
7119
- .brand-page__inner--desktop[data-v-4eac537a] {
7125
+ .brand-page__inner--desktop[data-v-d4cc0d12] {
7120
7126
  min-height: 100vh;
7121
7127
  }
7122
- .brand-site__header[data-v-4eac537a] {
7128
+ .brand-site__header[data-v-d4cc0d12] {
7123
7129
  container-type: inline-size;
7124
7130
  }
7125
- .brand-page__header[data-v-4eac537a] {
7131
+ .brand-page__header[data-v-d4cc0d12] {
7126
7132
  padding-top: var(--page-padding);
7127
7133
  }
7128
- .brand-page__content--default[data-v-4eac537a] {
7134
+ .brand-page__content--default[data-v-d4cc0d12] {
7129
7135
  margin-left: auto;
7130
7136
  margin-right: auto;
7131
7137
  margin-bottom: 2.5rem;
@@ -7142,7 +7148,7 @@ body {
7142
7148
  flex-direction: column;
7143
7149
  max-width: var(--page-max-width);
7144
7150
  }
7145
- .brand-page__content--desktop[data-v-4eac537a] {
7151
+ .brand-page__content--desktop[data-v-d4cc0d12] {
7146
7152
  margin-left: auto;
7147
7153
  margin-right: auto;
7148
7154
  display: -webkit-box;
@@ -7158,15 +7164,15 @@ body {
7158
7164
  flex-direction: column;
7159
7165
  max-width: 100%;
7160
7166
  }
7161
- .brand-page__content--inner[data-v-4eac537a] {
7167
+ .brand-page__content--inner[data-v-d4cc0d12] {
7162
7168
  padding-left: var(--page-padding);
7163
7169
  padding-right: var(--page-padding);
7164
7170
  }
7165
- .brand-page__content--inner--brandsite[data-v-4eac537a] {
7171
+ .brand-page__content--inner--brandsite[data-v-d4cc0d12] {
7166
7172
  max-width: var(--brandsite-max-width);
7167
7173
  margin: 0 auto;
7168
7174
  }
7169
- .brand-page__content--outline-selected[data-v-4eac537a] {
7175
+ .brand-page__content--outline-selected[data-v-d4cc0d12] {
7170
7176
  position: relative;
7171
7177
  z-index: 10;
7172
7178
  outline-color: #b2bdfb;
@@ -7174,20 +7180,20 @@ body {
7174
7180
  outline-style: dashed;
7175
7181
  outline-offset: -0.25rem;
7176
7182
  }
7177
- .brand-page__content--outline-footer-selected[data-v-4eac537a] {
7183
+ .brand-page__content--outline-footer-selected[data-v-d4cc0d12] {
7178
7184
  outline-color: #f7768c;
7179
7185
  outline-width: 0.2rem;
7180
7186
  outline-style: dashed;
7181
7187
  outline-offset: -0.25rem;
7182
7188
  }
7183
7189
  @media (max-width: 640px) {
7184
- .brand-page__content--inner--full-width[data-v-4eac537a] {
7190
+ .brand-page__content--inner--full-width[data-v-d4cc0d12] {
7185
7191
  padding-left: 0;
7186
7192
  padding-right: 0;
7187
7193
  }
7188
7194
  }
7189
7195
  @media (min-width: 640px) {
7190
- .brand-page__content--inner--full-width[data-v-4eac537a] {
7196
+ .brand-page__content--inner--full-width[data-v-d4cc0d12] {
7191
7197
  padding-left: var(--page-padding);
7192
7198
  padding-right: var(--page-padding);
7193
7199
  }
@@ -8645,11 +8651,11 @@ input[type='number'][data-v-28a532b4] {
8645
8651
  }
8646
8652
  }
8647
8653
 
8648
- .template-preview[data-v-c5fa6125] {
8654
+ .template-preview[data-v-0684c5a3] {
8649
8655
  position: relative;
8650
8656
  background-attachment: initial !important
8651
8657
  }
8652
- .template-preview__overlay[data-v-c5fa6125] {
8658
+ .template-preview__overlay[data-v-0684c5a3] {
8653
8659
  position: absolute;
8654
8660
  top: 0px;
8655
8661
  left: 0px;
@@ -8660,10 +8666,28 @@ input[type='number'][data-v-28a532b4] {
8660
8666
  cursor: pointer;
8661
8667
  opacity: 0
8662
8668
  }
8663
- .template-preview__page[data-v-c5fa6125] {
8669
+ .template-preview__image-container[data-v-0684c5a3] {
8670
+ pointer-events: none;
8671
+ height: 100%;
8672
+ width: 100%
8673
+ }
8674
+ .template-preview__image[data-v-0684c5a3] {
8675
+ height: 100%;
8676
+ width: 100%;
8677
+ -o-object-fit: fill;
8678
+ object-fit: fill;
8679
+ -webkit-transition: -webkit-filter 0.2s ease;
8680
+ transition: -webkit-filter 0.2s ease;
8681
+ transition: filter 0.2s ease;
8682
+ transition: filter 0.2s ease, -webkit-filter 0.2s ease
8683
+ }
8684
+ .template-preview__page[data-v-0684c5a3] {
8664
8685
  pointer-events: none
8665
8686
  }
8666
- .template-preview[data-v-c5fa6125] .c-shape-background {
8687
+ .template-preview[data-v-0684c5a3] .c-shape-background {
8688
+ position: absolute
8689
+ }
8690
+ .template-preview__image[data-v-0684c5a3] .c-shape-background {
8667
8691
  position: absolute
8668
8692
  }
8669
8693
 
package/lib/src/css/library.brand-page-preview.min.css CHANGED
@@ -1396,6 +1396,12 @@ a.maker-anchor {
1396
1396
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1397
1397
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
1398
1398
  }
1399
+ .bp .tw-scale-150 {
1400
+ --tw-scale-x: 1.5;
1401
+ --tw-scale-y: 1.5;
1402
+ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1403
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
1404
+ }
1399
1405
  .bp .tw-transform {
1400
1406
  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1401
1407
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
@@ -6827,14 +6833,14 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6827
6833
  line-height: 1.5;
6828
6834
  }
6829
6835
 
6830
- .bp .brand-page-root[data-v-4eac537a] {
6836
+ .bp .brand-page-root[data-v-d4cc0d12] {
6831
6837
  height: 100%;
6832
6838
  }
6833
- .bp .sortable[data-v-4eac537a] {
6839
+ .bp .sortable[data-v-d4cc0d12] {
6834
6840
  outline-color: #F7768C;
6835
6841
  outline-width: 0.2rem;
6836
6842
  }
6837
- .bp .brand-page[data-v-4eac537a] {
6843
+ .bp .brand-page[data-v-d4cc0d12] {
6838
6844
  -webkit-box-sizing: border-box;
6839
6845
  box-sizing: border-box;
6840
6846
  display: -webkit-box;
@@ -6846,7 +6852,7 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6846
6852
  -ms-flex-direction: column;
6847
6853
  flex-direction: column;
6848
6854
  }
6849
- .bp .brand-page__inner--default[data-v-4eac537a] {
6855
+ .bp .brand-page__inner--default[data-v-d4cc0d12] {
6850
6856
  position: relative;
6851
6857
  z-index: 10;
6852
6858
  display: -webkit-box;
@@ -6858,16 +6864,16 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6858
6864
  -ms-flex-direction: column;
6859
6865
  flex-direction: column;
6860
6866
  }
6861
- .bp .brand-page__inner--desktop[data-v-4eac537a] {
6867
+ .bp .brand-page__inner--desktop[data-v-d4cc0d12] {
6862
6868
  min-height: 100vh;
6863
6869
  }
6864
- .bp .brand-site__header[data-v-4eac537a] {
6870
+ .bp .brand-site__header[data-v-d4cc0d12] {
6865
6871
  container-type: inline-size;
6866
6872
  }
6867
- .bp .brand-page__header[data-v-4eac537a] {
6873
+ .bp .brand-page__header[data-v-d4cc0d12] {
6868
6874
  padding-top: var(--page-padding);
6869
6875
  }
6870
- .bp .brand-page__content--default[data-v-4eac537a] {
6876
+ .bp .brand-page__content--default[data-v-d4cc0d12] {
6871
6877
  margin-left: auto;
6872
6878
  margin-right: auto;
6873
6879
  margin-bottom: 2.5rem;
@@ -6884,7 +6890,7 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6884
6890
  flex-direction: column;
6885
6891
  max-width: var(--page-max-width);
6886
6892
  }
6887
- .bp .brand-page__content--desktop[data-v-4eac537a] {
6893
+ .bp .brand-page__content--desktop[data-v-d4cc0d12] {
6888
6894
  margin-left: auto;
6889
6895
  margin-right: auto;
6890
6896
  display: -webkit-box;
@@ -6900,15 +6906,15 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6900
6906
  flex-direction: column;
6901
6907
  max-width: 100%;
6902
6908
  }
6903
- .bp .brand-page__content--inner[data-v-4eac537a] {
6909
+ .bp .brand-page__content--inner[data-v-d4cc0d12] {
6904
6910
  padding-left: var(--page-padding);
6905
6911
  padding-right: var(--page-padding);
6906
6912
  }
6907
- .bp .brand-page__content--inner--brandsite[data-v-4eac537a] {
6913
+ .bp .brand-page__content--inner--brandsite[data-v-d4cc0d12] {
6908
6914
  max-width: var(--brandsite-max-width);
6909
6915
  margin: 0 auto;
6910
6916
  }
6911
- .bp .brand-page__content--outline-selected[data-v-4eac537a] {
6917
+ .bp .brand-page__content--outline-selected[data-v-d4cc0d12] {
6912
6918
  position: relative;
6913
6919
  z-index: 10;
6914
6920
  outline-color: #F7768C;
@@ -6916,20 +6922,20 @@ input[data-v-4cd691db]::-webkit-inner-spin-button {
6916
6922
  outline-style: dashed;
6917
6923
  outline-offset: -0.25rem;
6918
6924
  }
6919
- .bp .brand-page__content--outline-footer-selected[data-v-4eac537a] {
6925
+ .bp .brand-page__content--outline-footer-selected[data-v-d4cc0d12] {
6920
6926
  outline-color: #f7768c;
6921
6927
  outline-width: 0.2rem;
6922
6928
  outline-style: dashed;
6923
6929
  outline-offset: -0.25rem;
6924
6930
  }
6925
6931
  @media (max-width: 640px) {
6926
- .bp .brand-page__content--inner--full-width[data-v-4eac537a] {
6932
+ .bp .brand-page__content--inner--full-width[data-v-d4cc0d12] {
6927
6933
  padding-left: 0;
6928
6934
  padding-right: 0;
6929
6935
  }
6930
6936
  }
6931
6937
  @media (min-width: 640px) {
6932
- .bp .brand-page__content--inner--full-width[data-v-4eac537a] {
6938
+ .bp .brand-page__content--inner--full-width[data-v-d4cc0d12] {
6933
6939
  padding-left: var(--page-padding);
6934
6940
  padding-right: var(--page-padding);
6935
6941
  }
@@ -8387,11 +8393,11 @@ input[type='number'][data-v-28a532b4] {
8387
8393
  }
8388
8394
  }
8389
8395
 
8390
- .bp .template-preview[data-v-c5fa6125] {
8396
+ .bp .template-preview[data-v-0684c5a3] {
8391
8397
  position: relative;
8392
8398
  background-attachment: initial !important
8393
8399
  }
8394
- .bp .template-preview__overlay[data-v-c5fa6125] {
8400
+ .bp .template-preview__overlay[data-v-0684c5a3] {
8395
8401
  position: absolute;
8396
8402
  top: 0px;
8397
8403
  left: 0px;
@@ -8402,10 +8408,28 @@ input[type='number'][data-v-28a532b4] {
8402
8408
  cursor: pointer;
8403
8409
  opacity: 0
8404
8410
  }
8405
- .bp .template-preview__page[data-v-c5fa6125] {
8411
+ .bp .template-preview__image-container[data-v-0684c5a3] {
8412
+ pointer-events: none;
8413
+ height: 100%;
8414
+ width: 100%
8415
+ }
8416
+ .bp .template-preview__image[data-v-0684c5a3] {
8417
+ height: 100%;
8418
+ width: 100%;
8419
+ -o-object-fit: fill;
8420
+ object-fit: fill;
8421
+ -webkit-transition: -webkit-filter 0.2s ease;
8422
+ transition: -webkit-filter 0.2s ease;
8423
+ transition: filter 0.2s ease;
8424
+ transition: filter 0.2s ease, -webkit-filter 0.2s ease
8425
+ }
8426
+ .bp .template-preview__page[data-v-0684c5a3] {
8406
8427
  pointer-events: none
8407
8428
  }
8408
- .bp .template-preview[data-v-c5fa6125] .c-shape-background {
8429
+ .bp .template-preview[data-v-0684c5a3] .c-shape-background {
8430
+ position: absolute
8431
+ }
8432
+ .bp .template-preview__image[data-v-0684c5a3] .c-shape-background {
8409
8433
  position: absolute
8410
8434
  }
8411
8435
 
package/lib/src/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { bD as E, ar as T, aU as I, a5 as s, aj as N, ai as S, af as A, bt as e, bK as O, cb as G, ca as C, c9 as D, c3 as P, b2 as t, b1 as R, bP as L, bQ as M, bX as o, bM as b, bO as r, bN as F, bR as n, bS as B, c2 as i, c0 as l, aq as g, c1 as Y, a8 as U, aZ as c, a$ as d, a_ as u, e as H, f as y, B as p, $ as K, d as V, a0 as k, j as X, an as m, Z as v, bs as h, bL as W, ay as x, aW as f, aS as z, b_ as Z, bZ as w, C as Q, b5 as j, D as q, b as J, a as $, bV as aa, b4 as _a, aX as Ea, aT as Ta, c7 as Ia, c8 as sa, bY as Na, bH as Sa, ad as Aa, b$ as ea, c4 as Oa, ba as Ga, aK as Ca, bg as Da, F as Pa, a7 as ta, a6 as Ra, h as La, a1 as Ma, b7 as oa, aV as ba, aR as ra, a3 as Fa, ak as na, l as Ba, K as ia, H as la, a9 as ga, bE as Ya, bb as Ua, bc as ca, bC as da, bi as ua, bk as Ha, b6 as ya, L as pa, aJ as Ka, bp as Va, aP as ka, bo as Xa, as as ma, ab as va, bW as ha, c5 as Wa, c6 as xa, aY as fa, N as za, aB as Za, aA as wa, aC as Qa, aw as ja, ax as qa, az as Ja, be as $a, bl as a_, b8 as __, o as E_, al as T_, am as I_, ag as s_, ah as N_, ae as S_, a4 as A_, m as e_, bq as O_, ap as G_, bI as C_, bJ as D_, bU as P_, ac as t_, bG as R_, br as L_, n as M_, S as o_, P as b_, aI as r_, bF as F_, bf as n_, bx as B_, bw as i_, bz as l_, bu as g_, bA as Y_, bB as U_, bv as c_, by as d_, aD as u_, aE as H_, bn as y_, bm as p_, aG as K_, aH as V_, aM as k_, b0 as X_, aL as m_, aN as v_, U as h_, aa as W_, aQ as x_, k as f_, bd as z_, ao as Z_, b9 as w_, bh as Q_, bj as j_, b3 as q_, Q as J_, a2 as $_, g as aE, bT as _E, r as EE, u as TE, M as IE, Y as sE, aF as NE, aO as SE, au as AE, p as eE, W as OE, t as GE, w as CE, at as DE, i as PE, av as tE, c as RE, q as LE, v as ME, V as oE, O as bE, s as rE, X as FE, A as nE, x as BE, y as iE, T as lE, E as gE, R as YE, G as UE, J as cE, z as dE, I as uE } from "./lib-CgMLUv91.js";
1
+ import { bD as E, ar as T, aU as I, a5 as s, aj as N, ai as S, af as A, bt as e, bK as O, cb as G, ca as C, c9 as D, c3 as P, b2 as t, b1 as R, bP as L, bQ as M, bX as o, bM as b, bO as r, bN as F, bR as n, bS as B, c2 as i, c0 as l, aq as g, c1 as Y, a8 as U, aZ as c, a$ as d, a_ as u, e as H, f as y, B as p, $ as K, d as V, a0 as k, j as X, an as m, Z as v, bs as h, bL as W, ay as x, aW as f, aS as z, b_ as Z, bZ as w, C as Q, b5 as j, D as q, b as J, a as $, bV as aa, b4 as _a, aX as Ea, aT as Ta, c7 as Ia, c8 as sa, bY as Na, bH as Sa, ad as Aa, b$ as ea, c4 as Oa, ba as Ga, aK as Ca, bg as Da, F as Pa, a7 as ta, a6 as Ra, h as La, a1 as Ma, b7 as oa, aV as ba, aR as ra, a3 as Fa, ak as na, l as Ba, K as ia, H as la, a9 as ga, bE as Ya, bb as Ua, bc as ca, bC as da, bi as ua, bk as Ha, b6 as ya, L as pa, aJ as Ka, bp as Va, aP as ka, bo as Xa, as as ma, ab as va, bW as ha, c5 as Wa, c6 as xa, aY as fa, N as za, aB as Za, aA as wa, aC as Qa, aw as ja, ax as qa, az as Ja, be as $a, bl as a_, b8 as __, o as E_, al as T_, am as I_, ag as s_, ah as N_, ae as S_, a4 as A_, m as e_, bq as O_, ap as G_, bI as C_, bJ as D_, bU as P_, ac as t_, bG as R_, br as L_, n as M_, S as o_, P as b_, aI as r_, bF as F_, bf as n_, bx as B_, bw as i_, bz as l_, bu as g_, bA as Y_, bB as U_, bv as c_, by as d_, aD as u_, aE as H_, bn as y_, bm as p_, aG as K_, aH as V_, aM as k_, b0 as X_, aL as m_, aN as v_, U as h_, aa as W_, aQ as x_, k as f_, bd as z_, ao as Z_, b9 as w_, bh as Q_, bj as j_, b3 as q_, Q as J_, a2 as $_, g as aE, bT as _E, r as EE, u as TE, M as IE, Y as sE, aF as NE, aO as SE, au as AE, p as eE, W as OE, t as GE, w as CE, at as DE, i as PE, av as tE, c as RE, q as LE, v as ME, V as oE, O as bE, s as rE, X as FE, A as nE, x as BE, y as iE, T as lE, E as gE, R as YE, G as UE, J as cE, z as dE, I as uE } from "./lib-BGjUW0Xe.js";
2
2
  import { createPinia as yE, setActivePinia as pE } from "pinia";
3
3
  export {
4
4
  E as ABOUT_SECTION_SETTINGS_CONFIG,