@sc-360-v2/storefront-cms-library 0.2.57 → 0.2.58

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 (31) hide show
  1. package/dist/amount-estimator.scss +1 -1
  2. package/dist/breadcrumbs.scss +199 -0
  3. package/dist/builder.js +1 -1
  4. package/dist/bulk-variant-picker.scss +64 -7
  5. package/dist/cart.scss +49 -13
  6. package/dist/contact-us.scss +179 -0
  7. package/dist/icon-library.scss +70 -0
  8. package/dist/image-temp.scss +1 -0
  9. package/dist/layouter.scss +1 -0
  10. package/dist/payment-methods.scss +1 -1
  11. package/dist/pickup-locations.scss +1 -1
  12. package/dist/product-actions.scss +1 -1
  13. package/dist/product-highlights.scss +1 -1
  14. package/dist/product-inventory.scss +1 -1
  15. package/dist/product-promotions.scss +1 -1
  16. package/dist/quantity-selector.scss +1 -1
  17. package/dist/repeater-embla-controls.scss +4 -0
  18. package/dist/repeater.scss +8 -1
  19. package/dist/shipping-estimator.scss +1 -1
  20. package/dist/sort.scss +0 -1
  21. package/dist/stack.scss +5 -1
  22. package/dist/store-locations.scss +1 -1
  23. package/dist/text-temp-v2.scss +125 -0
  24. package/dist/text-temp.scss +36 -1
  25. package/dist/types/builder/tools/element-edit/scroll.d.ts +5 -0
  26. package/dist/types/builder/tools/element-edit/video.d.ts +1 -0
  27. package/dist/uom-selector.scss +1 -1
  28. package/dist/variant-picker.scss +64 -7
  29. package/dist/volume-pricing.scss +1 -1
  30. package/dist/widget.scss +5 -1
  31. package/package.json +1 -1
package/dist/amount-estimator.scss CHANGED
@@ -8,7 +8,7 @@
8
8
  // margin: var(--_lt-mn);
9
9
  // padding: var(--_lt-pg);
10
10
  // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
11
- width: var(--_sf-nw-wh, var(--_tst-lt-wh));
11
+ // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
12
12
  margin: var(--_ctm-lt-mn, --_tst-lt-mn);
13
13
  // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
14
14
  // height: ;
package/dist/breadcrumbs.scss ADDED
@@ -0,0 +1,199 @@
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+
4
+ $resizerId: "[data-cms-tool='cms-element-resizer']";
5
+ $resizeActive: '[data-cms-element-resizer="true"]';
6
+ [data-div-type="element"] {
7
+ &[data-element-type="breadcrumbs"] {
8
+ width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
9
+ margin: var(--_ctm-lt-mn, --_tst-lt-mn);
10
+
11
+ & > div {
12
+ &.wrapper {
13
+ width: 100%;
14
+ }
15
+
16
+ .horizontal_breadcrumb_wrapper {
17
+ display: inline-flex;
18
+ align-items: center;
19
+ border-style: var(--_ctm-dn-bd-ad-fl-br-se);
20
+ border-width: var(--_ctm-dn-bd-ad-fl-br-wh);
21
+ border-color: var(--_ctm-dn-bd-ad-fl-br-cr);
22
+ border-radius: var(--_ctm-dn-bd-ad-fl-br-rs);
23
+ background-color: var(--_ctm-dn-bd-ad-fl-bd-cr);
24
+ padding: var(--_ctm-lt-pg);
25
+ box-shadow: var(
26
+ --_show-shadow,
27
+ var(--_ctm-dn-bd-ad-fl-sw-ae) var(--_ctm-dn-bd-ad-fl-sw-br) var(--_ctm-dn-bd-ad-fl-sw-sd)
28
+ var(--_ctm-dn-bd-ad-fl-sw-cr)
29
+ );
30
+ gap: var(--_ctm-lt-im-sg);
31
+
32
+ &[overflow-item="Scroll"],
33
+ &[overflow-item="Show More"],
34
+ &[overflow-item="Collapsed"] {
35
+ overflow-x: auto;
36
+ width: inherit;
37
+ }
38
+
39
+ &[overflow-item="Wrap"] {
40
+ flex-wrap: wrap;
41
+ row-gap: var(--_ctm-lt-im-vl-sg);
42
+ column-gap: var(--_ctm-lt-im-sg);
43
+ }
44
+ }
45
+ .vertical_breadcrumb_wrapper {
46
+ display: flex;
47
+ align-items: flex-start;
48
+ flex-direction: column;
49
+ height: 120px;
50
+ border-style: var(--_ctm-dn-bd-ad-fl-br-se);
51
+ border-width: var(--_ctm-dn-bd-ad-fl-br-wh);
52
+ border-color: var(--_ctm-dn-bd-ad-fl-br-cr);
53
+ border-radius: var(--_ctm-dn-bd-ad-fl-br-rs);
54
+ background-color: var(--_ctm-dn-bd-ad-fl-bd-cr);
55
+ padding: var(--_ctm-lt-pg);
56
+ box-shadow: var(
57
+ --_show-shadow,
58
+ var(--_ctm-dn-bd-ad-fl-sw-ae) var(--_ctm-dn-bd-ad-fl-sw-br) var(--_ctm-dn-bd-ad-fl-sw-sd)
59
+ var(--_ctm-dn-bd-ad-fl-sw-cr)
60
+ );
61
+
62
+ &[overflow-item="Scroll"],
63
+ &[overflow-item="Show More"],
64
+ &[overflow-item="Collapsed"] {
65
+ overflow-y: auto;
66
+ gap: var(--_ctm-lt-im-sg);
67
+ }
68
+ &[overflow-item="Wrap"] {
69
+ flex-wrap: wrap;
70
+ row-gap: var(--_ctm-lt-im-vl-sg);
71
+ column-gap: var(--_ctm-lt-im-sg);
72
+ }
73
+
74
+ .item_wrapper {
75
+ display: flex;
76
+ gap: 6px;
77
+ }
78
+ }
79
+
80
+ .breadcrumb_item {
81
+ padding: 0px 4px;
82
+ display: flex;
83
+ gap: 8px;
84
+ white-space: nowrap;
85
+ align-items: center;
86
+
87
+ background-color: var(--_ctm-dn-or-im-se-bd-cr);
88
+ border-color: var(--_ctm-dn-or-im-se-br-cr);
89
+ border-radius: var(--_ctm-dn-or-im-se-br-rs);
90
+ border-style: var(--_ctm-dn-or-im-se-br-se);
91
+ border-width: var(--_ctm-dn-or-im-se-br-wh);
92
+ color: var(--_ctm-dn-or-im-se-cr);
93
+ font-family: var(--_ctm-dn-or-im-se-ft-fy);
94
+ font-size: var(--_ctm-dn-or-im-se-ft-se);
95
+ font-style: var(--_ctm-dn-or-im-se-ft-se-ic);
96
+ font-weight: var(--_ctm-dn-or-im-se-ft-wt);
97
+ line-height: var(--_ctm-dn-or-im-se-le-ht);
98
+ letter-spacing: var(--_ctm-dn-or-im-se-lr-sg);
99
+ text-align: var(--_ctm-dn-or-im-se-tt-an);
100
+ text-decoration: var(--_ctm-dn-or-im-se-ue);
101
+ box-shadow: var(--_ctm-dn-or-im-se-sw-ae) var(--_ctm-dn-or-im-se-sw-br)
102
+ var(--_ctm-dn-or-im-se-sw-sd) var(--_ctm-dn-or-im-se-sw-cr);
103
+
104
+ .icon {
105
+ svg {
106
+ width: var(--_ctm-dn-or-im-se-in-se);
107
+ height: var(--_ctm-dn-or-im-se-in-se);
108
+ path {
109
+ stroke: var(--_ctm-dn-or-im-se-in-c1);
110
+ }
111
+ }
112
+ }
113
+
114
+ &:first-child {
115
+ background-color: var(--_ctm-dn-he-pe-im-se-bd-cr);
116
+ border-color: var(--_ctm-dn-he-pe-im-se-br-cr);
117
+ border-radius: var(--_ctm-dn-he-pe-im-se-br-rs);
118
+ border-style: var(--_ctm-dn-he-pe-im-se-br-se);
119
+ border-width: var(--_ctm-dn-he-pe-im-se-br-wh);
120
+ color: var(--_ctm-dn-he-pe-im-se-cr);
121
+ font-family: var(--_ctm-dn-he-pe-im-se-ft-fy);
122
+ font-size: var(--_ctm-dn-he-pe-im-se-ft-se);
123
+ font-style: var(--_ctm-dn-he-pe-im-se-ft-se-ic);
124
+ font-weight: var(--_ctm-dn-he-pe-im-se-ft-wt);
125
+ line-height: var(--_ctm-dn-he-pe-im-se-le-ht);
126
+ letter-spacing: var(--_ctm-dn-he-pe-im-se-lr-sg);
127
+ text-align: var(--_ctm-dn-he-pe-im-se-tt-an);
128
+ text-decoration: var(--_ctm-dn-he-pe-im-se-ue);
129
+ box-shadow: var(--_ctm-dn-he-pe-im-se-sw-ae) var(--_ctm-dn-he-pe-im-se-sw-br)
130
+ var(--_ctm-dn-he-pe-im-se-sw-sd) var(--_ctm-dn-he-pe-im-se-sw-cr);
131
+
132
+ .icon {
133
+ svg {
134
+ width: var(--_ctm-dn-he-pe-im-se-in-se);
135
+ height: var(--_ctm-dn-he-pe-im-se-in-se);
136
+ path {
137
+ stroke: var(--_ctm-dn-he-pe-im-se-in-c1);
138
+ }
139
+ }
140
+ }
141
+ }
142
+
143
+ &:last-child {
144
+ background-color: var(--_ctm-dn-ct-pe-im-se-bd-cr);
145
+ border-color: var(--_ctm-dn-ct-pe-im-se-br-cr);
146
+ border-radius: var(--_ctm-dn-ct-pe-im-se-br-rs);
147
+ border-style: var(--_ctm-dn-ct-pe-im-se-br-se);
148
+ border-width: var(--_ctm-dn-ct-pe-im-se-br-wh);
149
+ color: #0089ff, var(--_ctm-dn-ct-pe-im-se-cr);
150
+ font-family: var(--_ctm-dn-ct-pe-im-se-ft-fy);
151
+ font-size: var(--_ctm-dn-ct-pe-im-se-ft-se);
152
+ font-style: var(--_ctm-dn-ct-pe-im-se-ft-se-ic);
153
+ font-weight: var(--_ctm-dn-ct-pe-im-se-ft-wt);
154
+ line-height: var(--_ctm-dn-ct-pe-im-se-le-ht);
155
+ letter-spacing: var(--_ctm-dn-ct-pe-im-se-lr-sg);
156
+ text-align: var(--_ctm-dn-ct-pe-im-se-tt-an);
157
+ text-decoration: var(--_ctm-dn-ct-pe-im-se-ue);
158
+ box-shadow: var(--_ctm-dn-ct-pe-im-se-sw-ae) var(--_ctm-dn-ct-pe-im-se-sw-sd)
159
+ var(--_ctm-dn-he-pe-im-se-sw-sd) var(--_ctm-dn-ct-pe-im-se-sw-cr);
160
+
161
+ .icon {
162
+ svg {
163
+ width: var(--_ctm-dn-ct-pe-im-se-in-se);
164
+ height: var(--_ctm-dn-ct-pe-im-se-in-se);
165
+ path {
166
+ stroke: var(--_ctm-dn-ct-pe-im-se-in-c1);
167
+ }
168
+ }
169
+ }
170
+ }
171
+ }
172
+
173
+ .separator {
174
+ .icon {
175
+ svg {
176
+ width: var(--_ctm-dn-im-sr-in-se);
177
+ height: var(--_ctm-dn-im-sr-in-se);
178
+ path {
179
+ stroke: var(--_ctm-dn-im-sr-in-c1);
180
+ }
181
+ }
182
+ }
183
+ }
184
+
185
+ .collapse_btn {
186
+ background-color: var(--_ctm-dn-ed-in-bd-cr);
187
+ .icon {
188
+ svg {
189
+ width: var(--_ctm-dn-ed-in-in-se);
190
+ height: var(--_ctm-dn-ed-in-in-se);
191
+ path {
192
+ stroke: var(--_ctm-dn-ed-in-in-c1);
193
+ }
194
+ }
195
+ }
196
+ }
197
+ }
198
+ }
199
+ }