@sc-360-v2/storefront-cms-library 0.4.72 → 0.4.74

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.
@@ -94,15 +94,15 @@ $isFlexboxElementChild: ".flx > .wrapper > *";
94
94
  border-style: var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)));
95
95
  border-width: var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)));
96
96
  border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
97
- &[data-show-shadow] {
98
- box-shadow: var(
99
- --_show-shadow,
100
- var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
101
- var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
102
- var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
103
- var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
104
- );
105
- }
97
+ box-shadow: var(
98
+ --_show-shadow,
99
+ var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
100
+ var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
101
+ var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
102
+ var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
103
+ );
104
+ // &[data-show-shadow] {
105
+ // }
106
106
 
107
107
  // transform: scale(var(--_ctm-dn-zm-ie));
108
108
  scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
@@ -1,89 +1,89 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
- [data-div-type="element"] {
4
- &[data-element-type="layouter-item"] {
5
- // width: var(--_sf-con-nw-wh);
6
- // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
7
- // width: calc(1% * var(--_ctm-rep-ele-nw-wh-vl, auto));
8
- // width: 100%;
9
- // height: var(--_ctm-con-lt-ht);
10
- // margin: var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, --_tst-lt-mn));
11
-
12
- // width: 100%;
13
- // background: var(--_ctm-repe-dn-bd-cr);
14
-
15
- & > div {
16
- &.wrapper {
17
- width: 100%;
18
- height: 100%;
19
- padding: var(--_ctm-mob-layo-lt-pg, var(--_ctm-tab-layo-lt-pg, var(--_ctm-layo-lt-pg)));
20
-
21
- background-color: var(
22
- --_ctm-mob-layo-dn-bd-cr,
23
- var(--_ctm-tab-layo-dn-bd-cr, var(--_ctm-layo-dn-bd-cr))
24
- );
25
- background-image: var(
26
- --_ctm-mob-layo-dn-bd-ie,
27
- var(--_ctm-tab-layo-dn-bd-ie, var(--_ctm-layo-dn-bd-ie))
28
- );
29
- background-attachment: var(
30
- --_ctm-mob-layo-dn-bd-at,
31
- var(--_ctm-tab-layo-dn-bd-at, var(--_ctm-layo-dn-bd-at))
32
- );
33
- background-position: var(
34
- --_ctm-mob-layo-dn-bd-pn,
35
- var(--_ctm-tab-layo-dn-bd-pn, var(--_ctm-layo-dn-bd-pn))
36
- );
37
- background-repeat: var(
38
- --_ctm-mob-layo-dn-bd-rt,
39
- var(--_ctm-tab-layo-dn-bd-rt, var(--_ctm-layo-dn-bd-rt))
40
- );
41
- background-size: var(
42
- --_ctm-mob-layo-dn-bd-se,
43
- var(--_ctm-tab-layo-dn-bd-se, var(--_ctm-layo-dn-bd-se))
44
- );
45
- border-radius: var(
46
- --_ctm-mob-layo-dn-br-rs,
47
- var(--_ctm-tab-layo-dn-br-rs, var(--_ctm-layo-dn-br-rs))
48
- );
49
- border-color: var(
50
- --_ctm-mob-layo-dn-br-cr,
51
- var(--_ctm-tab-layo-dn-br-cr, var(--_ctm-layo-dn-br-cr))
52
- );
53
- border-style: var(
54
- --_ctm-mob-layo-dn-br-se,
55
- var(--_ctm-tab-layo-dn-br-se, var(--_ctm-layo-dn-br-se))
56
- );
57
- border-width: var(
58
- --_ctm-mob-layo-dn-br-wh,
59
- var(--_ctm-tab-layo-dn-br-wh, var(--_ctm-layo-dn-br-wh))
60
- );
61
- box-shadow: var(
62
- --_hover-show-shadow,
63
- var(
64
- --_sf-hr-bx-sw,
65
- var(
66
- --_show-shadow,
67
- var(
68
- --_ctm-mob-dn-dt-se-sw-ae,
69
- var(--_ctm-tab-dn-dt-se-sw-ae, var(--_ctm-dn-dt-se-sw-ae))
70
- )
71
- var(
72
- --_ctm-mob-dn-dt-se-sw-br,
73
- var(--_ctm-tab-dn-dt-se-sw-br, var(--_ctm-dn-dt-se-sw-br))
74
- )
75
- var(
76
- --_ctm-mob-dn-dt-se-sw-sd,
77
- var(--_ctm-tab-dn-dt-se-sw-sd, var(--_ctm-dn-dt-se-sw-sd))
78
- )
79
- var(
80
- --_ctm-mob-dn-dt-se-sw-cr,
81
- var(--_ctm-tab-dn-dt-se-sw-cr, var(--_ctm-dn-dt-se-sw-cr))
82
- )
83
- )
84
- )
85
- );
86
- }
87
- }
88
- }
89
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ [data-div-type="element"] {
4
+ &[data-element-type="layouter-item"] {
5
+ // width: var(--_sf-con-nw-wh);
6
+ // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
7
+ // width: calc(1% * var(--_ctm-rep-ele-nw-wh-vl, auto));
8
+ // width: 100%;
9
+ // height: var(--_ctm-con-lt-ht);
10
+ // margin: var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, --_tst-lt-mn));
11
+
12
+ // width: 100%;
13
+ // background: var(--_ctm-repe-dn-bd-cr);
14
+
15
+ & > div {
16
+ &.wrapper {
17
+ width: 100%;
18
+ height: 100%;
19
+ padding: var(--_ctm-mob-layo-lt-pg, var(--_ctm-tab-layo-lt-pg, var(--_ctm-layo-lt-pg)));
20
+
21
+ background-color: var(
22
+ --_ctm-mob-layo-dn-bd-cr,
23
+ var(--_ctm-tab-layo-dn-bd-cr, var(--_ctm-layo-dn-bd-cr))
24
+ );
25
+ background-image: var(
26
+ --_ctm-mob-layo-dn-bd-ie,
27
+ var(--_ctm-tab-layo-dn-bd-ie, var(--_ctm-layo-dn-bd-ie))
28
+ );
29
+ background-attachment: var(
30
+ --_ctm-mob-layo-dn-bd-at,
31
+ var(--_ctm-tab-layo-dn-bd-at, var(--_ctm-layo-dn-bd-at))
32
+ );
33
+ background-position: var(
34
+ --_ctm-mob-layo-dn-bd-pn,
35
+ var(--_ctm-tab-layo-dn-bd-pn, var(--_ctm-layo-dn-bd-pn))
36
+ );
37
+ background-repeat: var(
38
+ --_ctm-mob-layo-dn-bd-rt,
39
+ var(--_ctm-tab-layo-dn-bd-rt, var(--_ctm-layo-dn-bd-rt))
40
+ );
41
+ background-size: var(
42
+ --_ctm-mob-layo-dn-bd-se,
43
+ var(--_ctm-tab-layo-dn-bd-se, var(--_ctm-layo-dn-bd-se))
44
+ );
45
+ border-radius: var(
46
+ --_ctm-mob-layo-dn-br-rs,
47
+ var(--_ctm-tab-layo-dn-br-rs, var(--_ctm-layo-dn-br-rs))
48
+ );
49
+ border-color: var(
50
+ --_ctm-mob-layo-dn-br-cr,
51
+ var(--_ctm-tab-layo-dn-br-cr, var(--_ctm-layo-dn-br-cr))
52
+ );
53
+ border-style: var(
54
+ --_ctm-mob-layo-dn-br-se,
55
+ var(--_ctm-tab-layo-dn-br-se, var(--_ctm-layo-dn-br-se))
56
+ );
57
+ border-width: var(
58
+ --_ctm-mob-layo-dn-br-wh,
59
+ var(--_ctm-tab-layo-dn-br-wh, var(--_ctm-layo-dn-br-wh))
60
+ );
61
+ box-shadow: var(
62
+ --_hover-show-shadow,
63
+ var(
64
+ --_sf-hr-bx-sw,
65
+ var(
66
+ --_show-shadow,
67
+ var(
68
+ --_ctm-mob-layo-dn-sw-ae,
69
+ var(--_ctm-tab-layo-dn-sw-ae, var(--_ctm-layo-dn-sw-ae))
70
+ )
71
+ var(
72
+ --_ctm-mob-layo-dn-sw-br,
73
+ var(--_ctm-tab-layo-dn-sw-br, var(--_ctm-layo-dn-sw-br))
74
+ )
75
+ var(
76
+ --_ctm-mob-layo-dn-sw-sd,
77
+ var(--_ctm-tab-layo-dn-sw-sd, var(--_ctm-layo-dn-sw-sd))
78
+ )
79
+ var(
80
+ --_ctm-mob-layo-dn-sw-cr,
81
+ var(--_ctm-tab-layo-dn-sw-cr, var(--_ctm-layo-dn-sw-cr))
82
+ )
83
+ )
84
+ )
85
+ );
86
+ }
87
+ }
88
+ }
89
+ }
@@ -1,80 +1,90 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
- @use "./functions.scss" as *;
4
- $flex: "flx";
5
- $grid: "grd";
6
- $flexRow: "rw";
7
- $flexRowReverse: "rw-rv";
8
- $flexColumn: "cln";
9
- $flexColumnReverse: "cln-rv";
10
- [data-div-type="element"] {
11
- &[data-element-type="layouter-pro-item"] {
12
- // width: var(--_sf-con-nw-wh);
13
- // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
14
- // width: calc(1% * var(--_ctm-rep-ele-nw-wh-vl, auto));
15
- // width: 100%;
16
- // height: var(--_ctm-con-lt-ht);
17
- // margin: var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, --_tst-lt-mn));
18
-
19
- // width: 100%;
20
- // background: var(--_ctm-repe-dn-bd-cr);
21
- width: prepareMediaVariable(--_ctm-layout-lt-wh);
22
-
23
- & > div {
24
- &.wrapper {
25
- width: 100%;
26
- // height: 100%;
27
- min-height: prepareMediaVariable(--_ctm-layout-lt-mn-ht);
28
- padding: prepareMediaVariable(--_ctm-layout-lt-pg);
29
-
30
- background-color: prepareMediaVariable(--_ctm-layout-dn-bd-cr);
31
- background-image: prepareMediaVariable(--_ctm-layout-dn-bd-ie);
32
- background-attachment: prepareMediaVariable(--_ctm-layout-dn-bd-at);
33
- background-position: prepareMediaVariable(--_ctm-layout-dn-bd-pn);
34
- background-repeat: prepareMediaVariable(--_ctm-layout-dn-bd-rt);
35
- background-size: prepareMediaVariable(--_ctm-layout-dn-bd-se);
36
- border-radius: prepareMediaVariable(--_ctm-layout-dn-br-rs);
37
-
38
- // flex-direction: column;
39
- // gap: prepareMediaVariable(--_ctm-layout-lt-im-gp);
40
- // align-items: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
41
- display: var(--_d-flex) !important;
42
- column-gap: prepareMediaVariable(--_ctm-layout-lt-cn-gp);
43
- row-gap: prepareMediaVariable(--_ctm-layout-lt-rw-gp);
44
-
45
- &:is(.#{$flex} > *) {
46
- display: var(--_d-flex) !important;
47
- flex-wrap: prepareMediaVariable(--_ctm-layout-lt-fx-wp);
48
- overflow: prepareMediaVariable(--_ctm-layout-lt-fx-ow);
49
-
50
- &.#{$flexRow} {
51
- flex-direction: row;
52
- align-items: prepareMediaVariable(--_ctm-layout-lt-an-is);
53
- justify-content: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
54
- }
55
- &.#{$flexRowReverse} {
56
- flex-direction: row-reverse;
57
- align-items: prepareMediaVariable(--_ctm-layout-lt-an-is);
58
- justify-content: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
59
- }
60
- &.#{$flexColumn} {
61
- flex-direction: column;
62
- justify-content: prepareMediaVariable(--_ctm-layout-lt-an-is);
63
- align-items: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
64
- }
65
- &.#{$flexColumnReverse} {
66
- flex-direction: column-reverse;
67
- justify-content: prepareMediaVariable(--_ctm-layout-lt-an-is);
68
- align-items: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
69
- }
70
- }
71
-
72
- &[data-show-border="true"] {
73
- border-color: prepareMediaVariable(--_ctm-layout-dn-br-cr);
74
- border-style: prepareMediaVariable(--_ctm-layout-dn-br-se);
75
- border-width: prepareMediaVariable(--_ctm-layout-dn-br-wh);
76
- }
77
- }
78
- }
79
- }
80
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ @use "./functions.scss" as *;
4
+ $flex: "flx";
5
+ $grid: "grd";
6
+ $flexRow: "rw";
7
+ $flexRowReverse: "rw-rv";
8
+ $flexColumn: "cln";
9
+ $flexColumnReverse: "cln-rv";
10
+ [data-div-type="element"] {
11
+ &[data-element-type="layouter-pro-item"] {
12
+ // width: var(--_sf-con-nw-wh);
13
+ // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
14
+ // width: calc(1% * var(--_ctm-rep-ele-nw-wh-vl, auto));
15
+ // width: 100%;
16
+ // height: var(--_ctm-con-lt-ht);
17
+ // margin: var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, --_tst-lt-mn));
18
+
19
+ // width: 100%;
20
+ // background: var(--_ctm-repe-dn-bd-cr);
21
+ width: prepareMediaVariable(--_ctm-layout-lt-wh);
22
+
23
+ & > div {
24
+ &.wrapper {
25
+ width: 100%;
26
+ // height: 100%;
27
+ min-height: prepareMediaVariable(--_ctm-layout-lt-mn-ht);
28
+ padding: prepareMediaVariable(--_ctm-layout-lt-pg);
29
+
30
+ background-color: prepareMediaVariable(--_ctm-layout-dn-bd-cr);
31
+ background-image: prepareMediaVariable(--_ctm-layout-dn-bd-ie);
32
+ background-attachment: prepareMediaVariable(--_ctm-layout-dn-bd-at);
33
+ background-position: prepareMediaVariable(--_ctm-layout-dn-bd-pn);
34
+ background-repeat: prepareMediaVariable(--_ctm-layout-dn-bd-rt);
35
+ background-size: prepareMediaVariable(--_ctm-layout-dn-bd-se);
36
+ border-radius: prepareMediaVariable(--_ctm-layout-dn-br-rs);
37
+
38
+ // flex-direction: column;
39
+ // gap: prepareMediaVariable(--_ctm-layout-lt-im-gp);
40
+ // align-items: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
41
+ display: var(--_d-flex) !important;
42
+ column-gap: prepareMediaVariable(--_ctm-layout-lt-cn-gp);
43
+ row-gap: prepareMediaVariable(--_ctm-layout-lt-rw-gp);
44
+
45
+ &:is(.#{$flex} > *) {
46
+ display: var(--_d-flex) !important;
47
+ flex-wrap: prepareMediaVariable(--_ctm-layout-lt-fx-wp);
48
+ overflow: prepareMediaVariable(--_ctm-layout-lt-fx-ow);
49
+
50
+ &.#{$flexRow} {
51
+ flex-direction: row;
52
+ align-items: prepareMediaVariable(--_ctm-layout-lt-an-is);
53
+ justify-content: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
54
+ }
55
+ &.#{$flexRowReverse} {
56
+ flex-direction: row-reverse;
57
+ align-items: prepareMediaVariable(--_ctm-layout-lt-an-is);
58
+ justify-content: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
59
+ }
60
+ &.#{$flexColumn} {
61
+ flex-direction: column;
62
+ justify-content: prepareMediaVariable(--_ctm-layout-lt-an-is);
63
+ align-items: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
64
+ }
65
+ &.#{$flexColumnReverse} {
66
+ flex-direction: column-reverse;
67
+ justify-content: prepareMediaVariable(--_ctm-layout-lt-an-is);
68
+ align-items: prepareMediaVariable(--_ctm-layout-lt-jy-ct);
69
+ }
70
+ }
71
+
72
+ &[data-show-border="true"] {
73
+ border-color: prepareMediaVariable(--_ctm-layout-dn-br-cr);
74
+ border-style: prepareMediaVariable(--_ctm-layout-dn-br-se);
75
+ border-width: prepareMediaVariable(--_ctm-layout-dn-br-wh);
76
+ }
77
+
78
+ &[data-show-boxshadow="true"] {
79
+ box-shadow: var(
80
+ --_hide-grid-shadow,
81
+ prepareMediaVariable(--_ctm-layout-dn-sw-ae)
82
+ prepareMediaVariable(--_ctm-layout-dn-sw-br)
83
+ prepareMediaVariable(--_ctm-layout-dn-sw-sd)
84
+ prepareMediaVariable(--_ctm-layout-dn-sw-cr)
85
+ );
86
+ }
87
+ }
88
+ }
89
+ }
90
+ }
@@ -67,24 +67,37 @@ $sliderControlDragging: "[flex-slider-control-moving='true']";
67
67
  --_sf-hr-bx-sw,
68
68
  var(
69
69
  --_show-shadow,
70
- var(--_ctm-mob-dn-dt-se-sw-ae, var(--_ctm-tab-dn-dt-se-sw-ae, var(--_ctm-dn-dt-se-sw-ae)))
70
+ var(
71
+ --_ctm-mob-lay-dn-dt-se-sw-ae,
72
+ var(--_ctm-tab-lay-dn-dt-se-sw-ae, var(--_ctm-lay-dn-dt-se-sw-ae))
73
+ )
71
74
  var(
72
- --_ctm-mob-dn-dt-se-sw-br,
73
- var(--_ctm-tab-dn-dt-se-sw-br, var(--_ctm-dn-dt-se-sw-br))
75
+ --_ctm-mob-lay-dn-dt-se-sw-br,
76
+ var(--_ctm-tab-lay-dn-dt-se-sw-br, var(--_ctm-lay-dn-dt-se-sw-br))
74
77
  )
75
78
  var(
76
- --_ctm-mob-dn-dt-se-sw-sd,
77
- var(--_ctm-tab-dn-dt-se-sw-sd, var(--_ctm-dn-dt-se-sw-sd))
79
+ --_ctm-mob-lay-dn-dt-se-sw-sd,
80
+ var(--_ctm-tab-lay-dn-dt-se-sw-sd, var(--_ctm-lay-dn-dt-se-sw-sd))
78
81
  )
79
82
  var(
80
- --_ctm-mob-dn-dt-se-sw-cr,
81
- var(--_ctm-tab-dn-dt-se-sw-cr, var(--_ctm-dn-dt-se-sw-cr))
83
+ --_ctm-mob-lay-dn-dt-se-sw-cr,
84
+ var(--_ctm-tab-lay-dn-dt-se-sw-cr, var(--_ctm-lay-dn-dt-se-sw-cr))
82
85
  )
83
86
  )
84
87
  )
85
88
  );
86
89
  padding: var(--_ctm-mob-lay-lt-pg, var(--_ctm-tab-lay-lt-pg, var(--_ctm-lay-lt-pg)));
87
90
 
91
+ --_sf-ic-sz-nn: var(
92
+ --_ctm-mob-lay-lt-aw-in-se,
93
+ var(--_ctm-tab-lay-lt-aw-in-se, var(--_ctm-lay-lt-aw-in-se, 40px))
94
+ );
95
+
96
+ --_sf-ed-vl-sz: var(
97
+ --_ctm-mob-lay-lt-dt-se,
98
+ var(--_ctm-tab-lay-lt-dt-se, var(--_ctm-lay-lt-dt-se, 10px))
99
+ );
100
+
88
101
  &.grd {
89
102
  & > div {
90
103
  &.wrapper {
@@ -352,10 +352,11 @@
352
352
  }
353
353
 
354
354
  //Dropdown
355
- .qty__dropdown__main {
355
+ .est__dropdown__main {
356
356
  position: relative;
357
357
  width: 100%;
358
358
  margin-top: 0px;
359
+ padding: 30px;
359
360
  label {
360
361
  font-size: 14px;
361
362
  color: var(--_gray-700);
@@ -363,7 +364,7 @@
363
364
  display: block;
364
365
  }
365
366
 
366
- .qty__dropdown {
367
+ .est__dropdown {
367
368
  cursor: pointer;
368
369
  position: relative;
369
370
  color: var(--_gray-700);
@@ -31,10 +31,11 @@
31
31
  opacity: var(--_sf-pg-ic-op, 0);
32
32
  transition: all 0.45s ease;
33
33
  } @else {
34
- min-height: var(
35
- --_ctm-mob-rep-lt-aw-in-se,
36
- var(--_ctm-tab-rep-lt-aw-in-se, var(--_ctm-rep-lt-aw-in-se, 40px))
37
- );
34
+ // min-height: var(
35
+ // --_ctm-mob-rep-lt-aw-in-se,
36
+ // var(--_ctm-tab-rep-lt-aw-in-se, var(--_ctm-rep-lt-aw-in-se, 40px))
37
+ // );
38
+ min-height: var(-_sf-ic-sz-nn);
38
39
  --_sf-t3-lt-vl-v2: var(--_sf-rp-ct-t3-left-vl, 50%);
39
40
  --_sf-t3-bt-bl-v2: var(--_sf-rp-ct-t3-bottom-vl, 20px);
40
41
  --_sf-t3-tr-bl-v2: var(--_sf-rp-ct-t3-transform-vl, translateX(-50%));
@@ -69,10 +70,10 @@
69
70
  right: var(--_sf-nv-lt-vl, 10px);
70
71
  }
71
72
  }
72
- --_sf-ic-sz-nn: var(
73
- --_ctm-mob-rep-lt-aw-in-se,
74
- var(--_ctm-tab-rep-lt-aw-in-se, var(--_ctm-rep-lt-aw-in-se, 40px))
75
- );
73
+ // --_sf-ic-sz-nn: var(
74
+ // --_ctm-mob-rep-lt-aw-in-se,
75
+ // var(--_ctm-tab-rep-lt-aw-in-se, var(--_ctm-rep-lt-aw-in-se, 40px))
76
+ // );
76
77
  width: var(--_sf-ic-sz-nn);
77
78
  // --_ctm-rep-lt-dt-se
78
79
  height: var(--_sf-ic-sz-nn);
@@ -141,13 +142,14 @@
141
142
  display: flex;
142
143
  align-items: center;
143
144
  gap: var(--_sf-dt-gp-vl, 8px);
145
+ max-width: 200px;
144
146
 
145
147
  & > button {
146
148
  &.embla__dot {
147
- --_sf-ed-vl-sz: var(
148
- --_ctm-mob-rep-lt-dt-se,
149
- var(--_ctm-tab-rep-lt-dt-se, var(--_ctm-rep-lt-dt-se, 10px))
150
- );
149
+ // --_sf-ed-vl-sz: var(
150
+ // --_ctm-mob-rep-lt-dt-se,
151
+ // var(--_ctm-tab-rep-lt-dt-se, var(--_ctm-rep-lt-dt-se, 10px))
152
+ // );
151
153
  @if ($type != 3) {
152
154
  transition: all 0.45s ease;
153
155
  width: var(--_sf-nv-pg-sz-ac, var(--_sf-ed-vl-sz, 10px));