PluginProbe
Discount Rules for WooCommerce – Disco | Dynamic Pricing, Conditions, Bulk, Bundle, BOGO / 1.4.12
Discount Rules for WooCommerce – Disco | Dynamic Pricing, Conditions, Bulk, Bundle, BOGO v1.4.12
1.4.19 1.4.18 1.4.17 1.4.16 1.4.15 1.4.14 1.4.13 1.4.12 1.4.11 1.4.10 1.4.9 1.4.8 1.4.7 1.4.6 1.4.5 1.4.4 1.4.3 1.4.2 1.4.1 1.4.0 1.3.54 1.3.53 1.3.52 1.3.51 1.3.50 All 182 releases
disco / backend / views / components / Main / utilities / product-badge-design.js

product-badge-design.js in Discount Rules for WooCommerce – Disco | Dynamic Pricing, Conditions, Bulk, Bundle, BOGO 1.4.12, at backend/views/components/Main/utilities/product-badge-design.js

1,883 lines 40.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Pre-made text highlight designs
3 * Each design contains CSS properties for easy PHP HTML generation
4 * Structure: container, title, subtitle, box_container, box, number, label, separator
5 */
6
7 import valueEditable1 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable1.svg';
8 import valueEditable10 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable10.svg';
9 import valueEditable11 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable11.svg';
10 import valueEditable12 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable12.png';
11 import valueEditable2 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable2.svg';
12 import valueEditable3 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable3.svg';
13 import valueEditable4 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable4.svg';
14 import valueEditable5 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable5.svg';
15 import valueEditable6 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable6.svg';
16 import valueEditable7 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable7.svg';
17 import valueEditable8 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable8.svg';
18 import valueEditable9 from '../../../asset/img/badge-images/badge/product-badge/value-editable/valueEditable9.svg';
19
20 // Default selected design ID
21 export const DEFAULT_PRODUCT_BADGE_DESIGN = 'editable_design1';
22
23 const VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR =
24 DISCO.DISCO_BADGE_IMAGES_DIR + '/badge-images/badge/product-badge/designs/';
25
26 export const productBadgeDesign = {
27 editable: [
28 // DESIGN 1
29 {
30 id: 'editable_design1',
31 name: '10% OFF',
32 isDefault: true,
33 hasSeparator: false,
34 singleContainer: false,
35 // Main container styles
36 container: {
37 position: 'absolute',
38 left: '0px',
39 top: '0px',
40 width: '100px',
41 height: '30px',
42 padding: '5px 10px',
43 background: 'rgb(7, 200, 131)',
44 'clip-path':
45 'polygon(0% 0%, 100% 0%, 85% 49%, 100% 100%, 0% 100%)',
46 },
47 // Title styles
48 title: {
49 text: '[discounted_percentage] OFF',
50 color: '#FFFFFF',
51 'font-family': 'Manrope, sans-serif',
52 'font-size': '14px',
53 'font-weight': 700,
54 },
55 },
56
57 // DESIGN 2
58 {
59 id: 'editable_design2',
60 name: 'Savings',
61 isDefault: false,
62 hasSeparator: false,
63 singleContainer: true,
64 // Main container styles
65 container: {
66 position: 'absolute',
67 left: '0px',
68 top: '0px',
69 width: '140px',
70 height: '30px',
71 padding: '5px 20px',
72 background: 'rgba(255, 45, 83, 1)',
73 'clip-path':
74 'polygon(0% 0%, 100% 0%, 85% 49%, 100% 100%, 0% 100%, 15% 50%)',
75 },
76 // Title styles
77 title: {
78 text: 'Savings [discounted_amount]',
79 color: '#FFFFFF',
80 'font-family': 'Manrope, sans-serif',
81 'font-size': '14px',
82 'font-weight': 700,
83 'text-align': 'center',
84 },
85 },
86
87 // DESIGN 3
88 {
89 id: 'editable_design3',
90 name: 'Instant off',
91 isDefault: false,
92 hasSeparator: false,
93 singleContainer: false,
94 // Main container styles
95
96 container: {
97 position: 'absolute',
98 left: '0px',
99 top: '0px',
100 width: '50px',
101 height: '50px',
102 display: 'flex',
103 'justify-content': 'center',
104 'align-items': 'center',
105 padding: '5px 20px',
106 background:
107 'linear-gradient(180deg, #A777FF 0%, #8A4CFC 54%, #722BF7 100%)',
108 'clip-path':
109 'polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%)',
110 },
111 // Title styles
112 title: {
113 text: '[discounted_percentage] OFF',
114 color: '#FFFFFF',
115 'font-family': 'Georgia, sans-serif',
116 'font-size': '14px',
117 'line-height': '14px',
118 'font-weight': 700,
119 'text-align': 'center',
120 },
121 },
122
123 // DESIGN 4
124 {
125 id: 'editable_design4',
126 name: 'Limited Stock',
127 isDefault: false,
128 hasSeparator: true,
129 singleContainer: false,
130 // Main container styles
131 container: {
132 position: 'absolute',
133 left: '0px',
134 top: '0px',
135 width: '70px',
136 height: '85px',
137 display: 'flex',
138 'justify-content': 'center',
139 padding: '5px',
140 background: 'rgba(255, 112, 11, 1)',
141 mask: 'conic-gradient(from -37.5deg at bottom,#0000,#000 1deg 74deg,#0000 75deg) 50%/17.35px 100%',
142 },
143 // Title styles
144 title: {
145 text: 'Save Now [discounted_percentage]',
146 color: '#FFFFFF',
147 'font-family': '',
148 'font-size': '18px',
149 'line-height': '20px',
150 'font-weight': '800',
151 'text-align': 'center',
152 'text-transform': 'uppercase',
153 },
154 },
155
156 // Design 5 clip-path: polygon(0 0, 100% 0%, 100% 75%, 50% 100%, 0 75%);
157 {
158 id: 'editable_design5',
159 name: 'Flash Sale',
160 isDefault: false,
161 hasSeparator: true,
162 singleContainer: false,
163 // Main container styles
164
165 container: {
166 position: 'absolute',
167 left: '0px',
168 top: '0px',
169 width: '70px',
170 height: '60px',
171 display: 'flex',
172 'justify-content': 'center',
173 padding: '5px',
174 radius: {
175 'top-left': '10px',
176 'top-right': '10px',
177 'bottom-right': '10px',
178 'bottom-left': '10px',
179 },
180 background: 'linear-gradient(180deg, #0061FF 0%, #60EFFF 100%)',
181 'clip-path': 'polygon(0 0, 100% 0%, 100% 75%, 50% 100%, 0 75%)',
182 },
183 // Title styles
184 title: {
185 text: 'Flash Sale',
186 color: '#FFFFFF',
187 'font-family': '',
188 'font-size': '18px',
189 'line-height': '20px',
190 'font-weight': '800',
191 'text-align': 'center',
192 'text-transform': 'uppercase',
193 },
194 },
195
196 // Design 6
197 {
198 id: 'editable_design6',
199 name: '15% OFF',
200 isDefault: false,
201 hasSeparator: true,
202 singleContainer: false,
203 // Main container styles
204
205 container: {
206 position: 'absolute',
207 left: '0px',
208 top: '0px',
209 width: '60px',
210 height: '60px',
211 display: 'flex',
212 'justify-content': 'center',
213 'align-items': 'center',
214 padding: '5px',
215 radius: {
216 'top-left': '60px',
217 'top-right': '60px',
218 'bottom-right': '0px',
219 'bottom-left': '60px',
220 },
221 background: '#000',
222 },
223 // Title styles
224 title: {
225 text: '[discounted_percentage] OFF',
226 color: 'rgba(255, 208, 0, 1)',
227 'font-family': '',
228 'font-size': '18px',
229 'line-height': '20px',
230 'font-weight': '800',
231 'text-align': 'center',
232 'text-transform': 'uppercase',
233 },
234 },
235
236 // Design 8
237 {
238 id: 'editable_design8',
239 name: '25% OFF',
240 isDefault: false,
241 hasSeparator: true,
242 singleContainer: false,
243 // Main container styles
244
245 container: {
246 position: 'absolute',
247 left: '0px',
248 top: '0px',
249 width: '60px',
250 height: '60px',
251 display: 'flex',
252 'justify-content': 'center',
253 'align-items': 'center',
254 padding: '5px',
255 radius: {
256 'top-left': '10px',
257 'top-right': '10px',
258 'bottom-right': '10px',
259 'bottom-left': '10px',
260 },
261 background:
262 'linear-gradient(93.56deg, #0091FF 0%, #12A1FF 100%)',
263 border: '2px solid',
264 'border-image-source':
265 'linear-gradient(259.16deg, #51B9FF 4.79%, #0860F8 108.32%)',
266 'clip-path':
267 'polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%)',
268 },
269 // Title styles
270 title: {
271 text: '[discounted_percentage] OFF',
272 color: '#FFFFFF',
273 'font-family': '',
274 'font-size': '18px',
275 'line-height': '20px',
276 'font-weight': '800',
277 'text-align': 'center',
278 'text-transform': 'uppercase',
279 },
280 },
281
282 // Design 9
283 {
284 id: 'editable_design9',
285 name: '25% OFF',
286 isDefault: false,
287 hasSeparator: true,
288 singleContainer: false,
289 // Main container styles
290
291 container: {
292 position: 'absolute',
293 left: '0px',
294 top: '0px',
295 width: '60px',
296 height: '60px',
297 display: 'flex',
298 'justify-content': 'center',
299 'align-items': 'center',
300 padding: '5px',
301 radius: {
302 'top-left': '10px',
303 'top-right': '10px',
304 'bottom-right': '10px',
305 'bottom-left': '10px',
306 },
307 background: 'rgba(255, 64, 38, 1)',
308 border: '2px solid',
309 'border-image-source':
310 'linear-gradient(259.16deg, #51B9FF 4.79%, #0860F8 108.32%)',
311 'clip-path':
312 'polygon(50% 0%, 70% 25%, 100% 30%, 80% 55%, 85% 100%, 50% 85%, 15% 100%, 20% 55%, 0% 30%, 30% 25%)',
313 },
314 // Title styles
315 title: {
316 text: '[discounted_percentage] OFF',
317 color: '#FFFFFF',
318 'font-family': '',
319 'font-size': '14px',
320 'line-height': '14px',
321 'font-weight': '800',
322 'text-align': 'center',
323 'text-transform': 'uppercase',
324 },
325 },
326
327 // Design 11
328 {
329 id: 'editable_design11',
330 name: 'Sale',
331 isDefault: false,
332 hasSeparator: true,
333 singleContainer: false,
334 // Main container styles
335
336 container: {
337 position: 'absolute',
338 left: '0px',
339 top: '0px',
340 width: '60px',
341 height: '60px',
342 display: 'flex',
343 'justify-content': 'center',
344 'align-items': 'center',
345 padding: '5px',
346 radius: {
347 'top-left': '10px',
348 'top-right': '10px',
349 'bottom-right': '10px',
350 'bottom-left': '10px',
351 },
352 background: 'rgba(0, 204, 255, 1)',
353 border: '2px solid',
354 'border-image-source':
355 'linear-gradient(259.16deg, #51B9FF 4.79%, #0860F8 108.32%)',
356 'clip-path': 'polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)',
357 },
358 // Title styles
359 title: {
360 text: 'SALE',
361 color: '#FFFFFF',
362 'font-family': '',
363 'font-size': '14px',
364 'line-height': '14px',
365 'font-weight': '800',
366 'text-align': 'center',
367 'text-transform': 'uppercase',
368 },
369 },
370 // Design 12
371 {
372 id: 'editable_design12',
373 name: 'Save 15%',
374 isDefault: false,
375 hasSeparator: true,
376 singleContainer: false,
377 // Main container styles
378
379 container: {
380 position: 'absolute',
381 left: '0px',
382 top: '0px',
383 width: '70px',
384 height: '70px',
385 display: 'flex',
386 'justify-content': 'center',
387 'align-items': 'center',
388 padding: '5px',
389 radius: {
390 'top-left': '0px',
391 'top-right': '0px',
392 'bottom-right': '0px',
393 'bottom-left': '0px',
394 },
395 background: 'rgba(243, 104, 224, 1)',
396 'clip-path':
397 'polygon(100% 50%,91.77% 54.39%,98.91% 60.4%,89.94% 62.98%,95.68% 70.34%,86.37% 71%,90.45% 79.39%,81.21% 78.1%,83.46% 87.16%,74.69% 83.98%,75% 93.3%,67.08% 88.37%,65.45% 97.55%,58.73% 91.08%,55.23% 99.73%,50% 92%,44.77% 99.73%,41.27% 91.08%,34.55% 97.55%,32.92% 88.37%,25% 93.3%,25.31% 83.98%,16.54% 87.16%,18.79% 78.1%,9.55% 79.39%,13.63% 71%,4.32% 70.34%,10.06% 62.98%,1.09% 60.4%,8.23% 54.39%,0% 50%,8.23% 45.61%,1.09% 39.6%,10.06% 37.02%,4.32% 29.66%,13.63% 29%,9.55% 20.61%,18.79% 21.9%,16.54% 12.84%,25.31% 16.02%,25% 6.7%,32.92% 11.63%,34.55% 2.45%,41.27% 8.92%,44.77% 0.27%,50% 8%,55.23% 0.27%,58.73% 8.92%,65.45% 2.45%,67.08% 11.63%,75% 6.7%,74.69% 16.02%,83.46% 12.84%,81.21% 21.9%,90.45% 20.61%,86.37% 29%,95.68% 29.66%,89.94% 37.02%,98.91% 39.6%,91.77% 45.61%)',
398 },
399 // Title styles
400 title: {
401 text: 'SAVE [discounted_percentage]',
402 color: '#FFFFFF',
403 'font-family': '',
404 'font-size': '14px',
405 'line-height': '14px',
406 'font-weight': '800',
407 'text-align': 'center',
408 'text-transform': 'uppercase',
409 },
410 },
411
412 // Design 13
413 {
414 id: 'editable_design13',
415 name: 'BOGO Deal',
416 isDefault: false,
417 hasSeparator: true,
418 singleContainer: false,
419 // Main container styles
420
421 container: {
422 position: 'absolute',
423 left: '0px',
424 top: '0px',
425 width: '150px',
426 height: '40px',
427 display: 'flex',
428 'justify-content': 'center',
429 'align-items': 'center',
430 padding: '5px',
431 radius: {
432 'top-left': '30px',
433 'top-right': '0px',
434 'bottom-right': '0px',
435 'bottom-left': '30px',
436 },
437 background: 'rgba(17, 61, 122, 1)',
438 'clip-path':
439 'polygon(100% 0%, 90% 50%, 100% 100%, 0% 100%, 0% 50%, 0% 0%)',
440 },
441 // Title styles
442 title: {
443 text: '�
444 BOGO DEAL',
445 color: '#FFFFFF',
446 'font-family': '',
447 'font-size': '14px',
448 'line-height': '14px',
449 'font-weight': '800',
450 'text-align': 'center',
451 'text-transform': 'uppercase',
452 },
453 },
454
455 // Design 14
456 {
457 id: 'editable_design14',
458 name: '20% OFF',
459 isDefault: false,
460 hasSeparator: true,
461 singleContainer: false,
462 // Main container styles
463
464 container: {
465 position: 'absolute',
466 left: '0px',
467 top: '0px',
468 width: '100px',
469 height: '30px',
470 display: 'flex',
471 'justify-content': 'center',
472 'align-items': 'center',
473 padding: '5px',
474 radius: {
475 'top-left': '0px',
476 'top-right': '0px',
477 'bottom-right': '0px',
478 'bottom-left': '0px',
479 },
480 background: 'rgba(255, 45, 83, 1)',
481 'clip-path': 'polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%)',
482 },
483 // Title styles
484 title: {
485 text: '[discounted_percentage] OFF',
486 color: '#FFFFFF',
487 'font-family': '',
488 'font-size': '14px',
489 'line-height': '14px',
490 'font-weight': '800',
491 'text-align': 'center',
492 'text-transform': 'uppercase',
493 },
494 },
495
496 // Design 15
497 {
498 id: 'editable_design15',
499 name: '20% Discount',
500 isDefault: false,
501 hasSeparator: true,
502 singleContainer: false,
503 // Main container styles
504
505 container: {
506 position: 'absolute',
507 left: '0px',
508 top: '0px',
509 width: '170px',
510 height: '30px',
511 display: 'flex',
512 'justify-content': 'center',
513 'align-items': 'center',
514 padding: '5px',
515 radius: {
516 'top-left': '0px',
517 'top-right': '50px',
518 'bottom-right': '50px',
519 'bottom-left': '0px',
520 },
521 background: 'rgba(255, 128, 0, 1)',
522 'clip-path':
523 'polygon(10% 0%, 100% 1%, 100% 100%, 10% 100%, 0% 50%)',
524 },
525 // Title styles
526 title: {
527 text: '• [discounted_percentage] Discount',
528 color: '#FFFFFF',
529 'font-family': '',
530 'font-size': '14px',
531 'line-height': '14px',
532 'font-weight': '800',
533 'text-align': 'center',
534 'text-transform': 'uppercase',
535 },
536 },
537
538 // Design 16
539 {
540 id: 'editable_design16',
541 name: 'Sale',
542 isDefault: false,
543 hasSeparator: true,
544 singleContainer: false,
545 // Main container styles
546
547 container: {
548 position: 'absolute',
549 right: '0px',
550 top: '0px',
551 width: '70px',
552 height: '70px',
553 display: 'flex',
554 'justify-content': 'center',
555 'align-items': 'center',
556 padding: '5px',
557 radius: {
558 'top-left': '0px',
559 'top-right': '0px',
560 'bottom-right': '0px',
561 'bottom-left': '0px',
562 },
563 background: 'rgba(43, 79, 255, 1)',
564 'clip-path': 'polygon(100% 0%, 0% 0%, 100% 100%)',
565 },
566 // Title styles
567 title: {
568 text: 'Sale',
569 color: '#FFFFFF',
570 'font-family': '',
571 'font-size': '14px',
572 'line-height': '14px',
573 'font-weight': '800',
574 'text-align': 'center',
575 transform: 'rotate(45deg)',
576 'margin-top': '-25px',
577 'margin-right': '-25px',
578 },
579 },
580
581 // Design 19
582 {
583 id: 'editable_design19',
584 name: '20% OFF',
585 isDefault: false,
586 hasSeparator: true,
587 singleContainer: false,
588 // Main container styles
589
590 container: {
591 position: 'absolute',
592 left: '0px',
593 top: '0px',
594 width: '100px',
595 height: '30px',
596 display: 'flex',
597 'justify-content': 'center',
598 'align-items': 'center',
599 padding: '5px',
600 radius: {
601 'top-left': '30px',
602 'top-right': '30px',
603 'bottom-right': '30px',
604 'bottom-left': '30px',
605 },
606 background:
607 'linear-gradient(90deg, #F39177 0%, #F61F48 35.5%, #A758EE 69%, #86C5FE 100%)',
608 },
609 // Title styles
610 title: {
611 text: '[discounted_percentage] OFF',
612 color: '#FFFFFF',
613 'font-family': '',
614 'font-size': '14px',
615 'line-height': '14px',
616 'font-weight': '800',
617 'text-align': 'center',
618 'text-transform': 'uppercase',
619 },
620 },
621
622 // Design 20
623 {
624 id: 'editable_design20',
625 name: '20% OFF',
626 isDefault: false,
627 hasSeparator: true,
628 singleContainer: false,
629 // Main container styles
630
631 container: {
632 position: 'absolute',
633 left: '0px',
634 top: '0px',
635 width: 'auto',
636 height: 'auto',
637 display: 'flex',
638 'justify-content': 'center',
639 'align-items': 'center',
640 padding: '15px 20px',
641 radius: {
642 'top-left': '100%',
643 'top-right': '100%',
644 'bottom-right': '100%',
645 'bottom-left': '100%',
646 },
647 background:
648 'linear-gradient(180deg, #0094FF -2.47%, #1930FF 100%)',
649 },
650 // Title styles
651 title: {
652 text: '[discounted_percentage] Discount',
653 color: '#FFFFFF',
654 'font-family': '',
655 'font-size': '14px',
656 'line-height': '14px',
657 'font-weight': '800',
658 'text-align': 'center',
659 },
660 },
661
662 // Design 21
663 {
664 id: 'editable_design21',
665 name: '25% OFF',
666 isDefault: false,
667 hasSeparator: false,
668 singleContainer: false,
669 // Main container styles
670
671 container: {
672 position: 'absolute',
673 left: '0px',
674 top: '0px',
675 width: '60px',
676 height: '60px',
677 display: 'flex',
678 'justify-content': 'center',
679 'align-items': 'center',
680 padding: '5px',
681 background: 'linear-gradient(120deg, #34CEFF 0%, #25ACFF 100%)',
682 'clip-path':
683 'polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%)',
684 },
685 // Title styles
686 title: {
687 text: '[discounted_percentage] OFF',
688 color: '#FFFFFF',
689 'font-family': 'Georgia, serif',
690 'font-size': '14px',
691 'line-height': '15px',
692 'font-weight': '700',
693 'text-align': 'center',
694 },
695 },
696
697 // Design 22
698 {
699 id: 'editable_design22',
700 name: '25% OFF',
701 isDefault: false,
702 hasSeparator: false,
703 singleContainer: false,
704 // Main container styles
705
706 container: {
707 position: 'absolute',
708 left: '0px',
709 top: '0px',
710 width: 'auto',
711 height: 'auto',
712 display: 'flex',
713 'justify-content': 'center',
714 'align-items': 'center',
715 padding: '7px 10px',
716 radius: {
717 'top-left': '8px',
718 'top-right': '8px',
719 'bottom-right': '0px',
720 'bottom-left': '0px',
721 },
722 background: '#3BE081',
723 },
724 // Title styles
725 title: {
726 text: '[discounted_percentage] OFF',
727 color: '#FFFFFF',
728 'font-family': '',
729 'font-size': '14px',
730 'line-height': '14px',
731 'font-weight': '600',
732 'text-align': 'center',
733 },
734 },
735
736 // Design 23
737 {
738 id: 'editable_design23',
739 name: '$10 OFF',
740 isDefault: false,
741 hasSeparator: false,
742 singleContainer: false,
743 // Main container styles
744
745 container: {
746 position: 'absolute',
747 left: '0px',
748 top: '0px',
749 width: '70px',
750 height: '70px',
751 display: 'flex',
752 'justify-content': 'center',
753 'align-items': 'center',
754 padding: '5px',
755 background: '#FF4026',
756 'clip-path':
757 'polygon(50% 0%, 68.2% 28.9%, 100% 38.2%, 79.5% 65.4%, 80.9% 100%, 50% 87.9%, 19.1% 100%, 20.5% 65.4%, 0% 38.2%, 31.8% 28.9%)',
758 },
759 // Title styles
760 title: {
761 text: '[discounted_amount] OFF',
762 color: '#FFFFFF',
763 'font-family': '',
764 'font-size': '12px',
765 'line-height': '13px',
766 'font-weight': '800',
767 'text-align': 'center',
768 },
769 },
770
771 // Design 24
772 {
773 id: 'editable_design24',
774 name: '15% OFF',
775 isDefault: false,
776 hasSeparator: false,
777 singleContainer: false,
778 // Main container styles
779
780 container: {
781 position: 'absolute',
782 left: '0px',
783 top: '0px',
784 width: '55px',
785 height: '55px',
786 display: 'flex',
787 'justify-content': 'center',
788 'align-items': 'center',
789 padding: '5px',
790 radius: {
791 'top-left': '100%',
792 'top-right': '100%',
793 'bottom-right': '100%',
794 'bottom-left': '100%',
795 },
796 background: 'linear-gradient(135deg, #E81CFF 0%, #40C9FF 100%)',
797 },
798 // Title styles
799 title: {
800 text: '[discounted_percentage] OFF',
801 color: '#FFFFFF',
802 'font-family': '',
803 'font-size': '13px',
804 'line-height': '14px',
805 'font-weight': '700',
806 'text-align': 'center',
807 },
808 },
809
810 // Design 25
811 {
812 id: 'editable_design25',
813 name: 'Sale Flag',
814 isDefault: false,
815 hasSeparator: false,
816 singleContainer: false,
817 // Main container styles
818
819 container: {
820 position: 'absolute',
821 left: '0px',
822 top: '0px',
823 width: '70px',
824 height: '28px',
825 display: 'flex',
826 'justify-content': 'center',
827 'align-items': 'center',
828 padding: '5px 5px 5px 15px',
829 background: '#1287A0',
830 'clip-path':
831 'polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 21% 50%)',
832 },
833 // Title styles
834 title: {
835 text: 'SALE',
836 color: '#FFFFFF',
837 'font-family': '',
838 'font-size': '14px',
839 'line-height': '14px',
840 'font-weight': '700',
841 'text-align': 'center',
842 },
843 },
844
845 // Design 26
846 {
847 id: 'editable_design26',
848 name: 'Sale Diamond',
849 isDefault: false,
850 hasSeparator: false,
851 singleContainer: false,
852 // Main container styles
853
854 container: {
855 position: 'absolute',
856 left: '0px',
857 top: '0px',
858 width: '48px',
859 height: '48px',
860 display: 'flex',
861 'justify-content': 'center',
862 'align-items': 'center',
863 padding: '5px',
864 margin: '10px',
865 radius: {
866 'top-left': '12px',
867 'top-right': '12px',
868 'bottom-right': '12px',
869 'bottom-left': '12px',
870 },
871 background: '#00CCFF',
872 transform: 'rotate(45deg)',
873 },
874 // Title styles
875 title: {
876 text: 'SALE',
877 color: '#FFFFFF',
878 'font-family': '',
879 'font-size': '13px',
880 'line-height': '14px',
881 'font-weight': '700',
882 'text-align': 'center',
883 transform: 'rotate(-45deg)',
884 },
885 },
886
887 // Design 27
888 {
889 id: 'editable_design27',
890 name: '28% Discount',
891 isDefault: false,
892 hasSeparator: false,
893 singleContainer: false,
894 // Main container styles
895
896 container: {
897 position: 'absolute',
898 left: '0px',
899 top: '0px',
900 width: '80px',
901 height: '30px',
902 display: 'flex',
903 'justify-content': 'center',
904 'align-items': 'center',
905 padding: '5px',
906 radius: {
907 'top-left': '50%',
908 'top-right': '50%',
909 'bottom-right': '50%',
910 'bottom-left': '50%',
911 },
912 background: 'linear-gradient(100deg, #2AF598 0%, #009EFD 100%)',
913 },
914 // Title styles
915 title: {
916 text: '[discounted_percentage] DISCOUNT',
917 color: '#FFFFFF',
918 'font-family': '',
919 'font-size': '9px',
920 'line-height': '10px',
921 'font-weight': '600',
922 'text-align': 'center',
923 },
924 },
925
926 // Design 28
927 {
928 id: 'editable_design28',
929 name: 'Latest',
930 isDefault: false,
931 hasSeparator: false,
932 singleContainer: false,
933 // Main container styles
934
935 container: {
936 position: 'absolute',
937 left: '0px',
938 top: '0px',
939 width: '78px',
940 height: '33px',
941 display: 'flex',
942 'justify-content': 'center',
943 'align-items': 'flex-start',
944 padding: '4px 5px 0px 5px',
945 background: '#7C00FE',
946 'clip-path':
947 'polygon(7.7% 0%, 100% 0%, 92.3% 70%, 82% 70%, 66% 100%, 59.6% 70%, 0% 70%)',
948 },
949 // Title styles
950 title: {
951 text: 'LATEST',
952 color: '#FFFFFF',
953 'font-family': '',
954 'font-size': '14px',
955 'line-height': '16px',
956 'font-weight': '700',
957 'text-align': 'center',
958 },
959 },
960
961 // Design 29
962 {
963 id: 'editable_design29',
964 name: 'Save 15%',
965 isDefault: false,
966 hasSeparator: false,
967 singleContainer: false,
968 // Main container styles
969
970 container: {
971 position: 'absolute',
972 left: '0px',
973 top: '0px',
974 width: '70px',
975 height: '64px',
976 display: 'flex',
977 'justify-content': 'center',
978 'align-items': 'center',
979 padding: '5px',
980 radius: {
981 'top-left': '50%',
982 'top-right': '0px',
983 'bottom-right': '50%',
984 'bottom-left': '50%',
985 },
986 background: 'linear-gradient(225deg, #FFD900 0%, #FF5C02 100%)',
987 },
988 // Title styles
989 title: {
990 text: 'SAVE [discounted_percentage]',
991 color: '#FFFFFF',
992 'font-family': '',
993 'font-size': '16px',
994 'line-height': '17px',
995 'font-weight': '800',
996 'text-align': 'center',
997 },
998 },
999
1000 // Design 30
1001 {
1002 id: 'editable_design30',
1003 name: 'Sale Blob',
1004 isDefault: false,
1005 hasSeparator: false,
1006 singleContainer: false,
1007 // Main container styles
1008
1009 container: {
1010 position: 'absolute',
1011 left: '0px',
1012 top: '0px',
1013 width: '76px',
1014 height: '48px',
1015 display: 'flex',
1016 'justify-content': 'center',
1017 'align-items': 'center',
1018 padding: '5px',
1019 margin: '5px',
1020 radius: {
1021 'top-left': '16px',
1022 'top-right': '4px',
1023 'bottom-right': '16px',
1024 'bottom-left': '16px',
1025 },
1026 background: '#70E000',
1027 transform: 'rotate(-4deg)',
1028 },
1029 // Title styles
1030 title: {
1031 text: 'SALE',
1032 color: '#FFFFFF',
1033 'font-family': '',
1034 'font-size': '18px',
1035 'line-height': '19px',
1036 'font-weight': '800',
1037 'text-align': 'center',
1038 },
1039 },
1040
1041 // Design 31
1042 {
1043 id: 'editable_design31',
1044 name: 'Recommended',
1045 isDefault: false,
1046 hasSeparator: false,
1047 singleContainer: false,
1048 // Main container styles
1049
1050 container: {
1051 position: 'absolute',
1052 left: '0px',
1053 top: '0px',
1054 width: 'auto',
1055 height: 'auto',
1056 display: 'flex',
1057 'justify-content': 'center',
1058 'align-items': 'center',
1059 padding: '3px 8px',
1060 radius: {
1061 'top-left': '2px',
1062 'top-right': '2px',
1063 'bottom-right': '2px',
1064 'bottom-left': '2px',
1065 },
1066 background: '#FF2E39',
1067 },
1068 // Title styles
1069 title: {
1070 text: '♥ RECOMMENDED',
1071 color: '#FFFFFF',
1072 'font-family': '',
1073 'font-size': '10px',
1074 'line-height': '12px',
1075 'font-weight': '700',
1076 'text-align': 'center',
1077 },
1078 },
1079
1080 // Design 32
1081 {
1082 id: 'editable_design32',
1083 name: 'Satisfaction Guaranteed',
1084 isDefault: false,
1085 hasSeparator: false,
1086 singleContainer: false,
1087 // Main container styles
1088
1089 container: {
1090 position: 'absolute',
1091 left: '0px',
1092 top: '0px',
1093 width: 'auto',
1094 height: 'auto',
1095 display: 'flex',
1096 'justify-content': 'center',
1097 'align-items': 'center',
1098 padding: '5px 8px',
1099 radius: {
1100 'top-left': '4px',
1101 'top-right': '4px',
1102 'bottom-right': '4px',
1103 'bottom-left': '4px',
1104 },
1105 background: '#00CC83',
1106 },
1107 // Title styles
1108 title: {
1109 text: '✔ SATISFACTION GUARANTEED',
1110 color: '#FFFFFF',
1111 'font-family': '',
1112 'font-size': '9px',
1113 'line-height': '11px',
1114 'font-weight': '700',
1115 'text-align': 'center',
1116 },
1117 },
1118
1119 // Design 33
1120 {
1121 id: 'editable_design33',
1122 name: 'On Sale',
1123 isDefault: false,
1124 hasSeparator: false,
1125 singleContainer: false,
1126 // Main container styles
1127
1128 container: {
1129 position: 'absolute',
1130 left: '0px',
1131 top: '0px',
1132 width: 'auto',
1133 height: 'auto',
1134 display: 'flex',
1135 'justify-content': 'center',
1136 'align-items': 'center',
1137 padding: '10px 12px',
1138 background: '#FFFFFF',
1139 'border-color': '#41B06E',
1140 'border-width': '2px',
1141 'border-style': 'solid',
1142 },
1143 // Title styles
1144 title: {
1145 text: 'ON SALE',
1146 color: '#41B06E',
1147 'font-family': '',
1148 'font-size': '12px',
1149 'line-height': '13px',
1150 'font-weight': '700',
1151 'text-align': 'center',
1152 },
1153 },
1154
1155 // Design 34
1156 {
1157 id: 'editable_design34',
1158 name: 'Best Seller Ribbon',
1159 isDefault: false,
1160 hasSeparator: false,
1161 singleContainer: false,
1162 // Main container styles
1163
1164 container: {
1165 position: 'absolute',
1166 left: '0px',
1167 top: '0px',
1168 width: '80px',
1169 height: '20px',
1170 display: 'flex',
1171 'justify-content': 'center',
1172 'align-items': 'center',
1173 padding: '2px 4px 2px 14px',
1174 background: '#FFBA08',
1175 'clip-path': 'polygon(0% 0%, 100% 0%, 100% 100%, 16.3% 100%)',
1176 },
1177 // Title styles
1178 title: {
1179 text: 'Best Seller',
1180 color: '#FFFFFF',
1181 'font-family': '',
1182 'font-size': '11px',
1183 'line-height': '12px',
1184 'font-weight': '700',
1185 'text-align': 'center',
1186 },
1187 },
1188
1189 // Design 35
1190 {
1191 id: 'editable_design35',
1192 name: 'Best Seller',
1193 isDefault: false,
1194 hasSeparator: false,
1195 singleContainer: false,
1196 // Main container styles
1197
1198 container: {
1199 position: 'absolute',
1200 left: '0px',
1201 top: '0px',
1202 width: '56px',
1203 height: '56px',
1204 display: 'flex',
1205 'justify-content': 'center',
1206 'align-items': 'center',
1207 padding: '5px',
1208 radius: {
1209 'top-left': '100%',
1210 'top-right': '100%',
1211 'bottom-right': '100%',
1212 'bottom-left': '100%',
1213 },
1214 background: '#179BAE',
1215 },
1216 // Title styles
1217 title: {
1218 text: 'Best Seller',
1219 color: '#FFFFFF',
1220 'font-family': '',
1221 'font-size': '13px',
1222 'line-height': '14px',
1223 'font-weight': '700',
1224 'text-align': 'center',
1225 },
1226 },
1227
1228 // Design 36
1229 {
1230 id: 'editable_design36',
1231 name: '18% OFF',
1232 isDefault: false,
1233 hasSeparator: false,
1234 singleContainer: false,
1235 // Main container styles
1236
1237 container: {
1238 position: 'absolute',
1239 left: '0px',
1240 top: '0px',
1241 width: '90px',
1242 height: '28px',
1243 display: 'flex',
1244 'justify-content': 'center',
1245 'align-items': 'center',
1246 padding: '5px 8px',
1247 background: '#FF0096',
1248 'clip-path':
1249 'polygon(0% 0%, 100% 0%, 89.5% 12.5%, 100% 25%, 89.5% 37.5%, 100% 50%, 89.5% 62.5%, 100% 75%, 89.5% 87.5%, 100% 100%, 0% 100%, 10.5% 87.5%, 0% 75%, 10.5% 62.5%, 0% 50%, 10.5% 37.5%, 0% 25%, 10.5% 12.5%)',
1250 },
1251 // Title styles
1252 title: {
1253 text: '[discounted_percentage] OFF',
1254 color: '#FFFFFF',
1255 'font-family': '',
1256 'font-size': '13px',
1257 'line-height': '14px',
1258 'font-weight': '700',
1259 'text-align': 'center',
1260 },
1261 },
1262
1263 // Design 37
1264 {
1265 id: 'editable_design37',
1266 name: 'On Sale Pill',
1267 isDefault: false,
1268 hasSeparator: false,
1269 singleContainer: false,
1270 // Main container styles
1271
1272 container: {
1273 position: 'absolute',
1274 left: '0px',
1275 top: '0px',
1276 width: 'auto',
1277 height: 'auto',
1278 display: 'flex',
1279 'justify-content': 'center',
1280 'align-items': 'center',
1281 padding: '10px 12px',
1282 radius: {
1283 'top-left': '100px',
1284 'top-right': '100px',
1285 'bottom-right': '100px',
1286 'bottom-left': '100px',
1287 },
1288 background: 'linear-gradient(90deg, #00A9FF 0%, #14F3FF 100%)',
1289 },
1290 // Title styles
1291 title: {
1292 text: 'ON SALE',
1293 color: '#FFFFFF',
1294 'font-family': '',
1295 'font-size': '12px',
1296 'line-height': '13px',
1297 'font-weight': '700',
1298 'text-align': 'center',
1299 },
1300 },
1301
1302 // Design 38
1303 {
1304 id: 'editable_design38',
1305 name: '18% OFF',
1306 isDefault: false,
1307 hasSeparator: false,
1308 singleContainer: false,
1309 // Main container styles
1310
1311 container: {
1312 position: 'absolute',
1313 left: '0px',
1314 top: '0px',
1315 width: '64px',
1316 height: '58px',
1317 display: 'flex',
1318 'justify-content': 'center',
1319 'align-items': 'flex-start',
1320 padding: '10px 5px',
1321 background: '#0F2C59',
1322 'clip-path': 'polygon(0% 0%, 100% 0%, 50% 100%)',
1323 },
1324 // Title styles
1325 title: {
1326 text: '[discounted_percentage] OFF',
1327 color: '#FFFFFF',
1328 'font-family': '',
1329 'font-size': '13px',
1330 'line-height': '14px',
1331 'font-weight': '700',
1332 'text-align': 'center',
1333 },
1334 },
1335
1336 // Design 39
1337 {
1338 id: 'editable_design39',
1339 name: 'COD Available',
1340 isDefault: false,
1341 hasSeparator: false,
1342 singleContainer: false,
1343 // Main container styles
1344
1345 container: {
1346 position: 'absolute',
1347 left: '0px',
1348 top: '0px',
1349 width: '80px',
1350 height: '80px',
1351 display: 'flex',
1352 'justify-content': 'center',
1353 'align-items': 'center',
1354 padding: '5px 10px',
1355 background: '#C70039',
1356 'clip-path':
1357 'polygon(0% 25%, 50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%)',
1358 },
1359 // Title styles
1360 title: {
1361 text: 'COD Available',
1362 color: '#FFFFFF',
1363 'font-family': '',
1364 'font-size': '15px',
1365 'line-height': '16px',
1366 'font-weight': '700',
1367 'text-align': 'center',
1368 },
1369 },
1370
1371 // Design 40
1372 {
1373 id: 'editable_design40',
1374 name: 'Save 25%',
1375 isDefault: false,
1376 hasSeparator: false,
1377 singleContainer: false,
1378 // Main container styles
1379
1380 container: {
1381 position: 'absolute',
1382 left: '0px',
1383 top: '0px',
1384 width: '58px',
1385 height: '58px',
1386 display: 'flex',
1387 'justify-content': 'flex-start',
1388 'align-items': 'flex-start',
1389 padding: '8px',
1390 radius: {
1391 'top-left': '0px',
1392 'top-right': '0px',
1393 'bottom-right': '100%',
1394 'bottom-left': '0px',
1395 },
1396 background: '#219EBC',
1397 },
1398 // Title styles
1399 title: {
1400 text: 'SAVE [discounted_percentage]',
1401 color: '#FFFFFF',
1402 'font-family': '',
1403 'font-size': '13px',
1404 'line-height': '14px',
1405 'font-weight': '700',
1406 'text-align': 'center',
1407 },
1408 },
1409
1410 // Design 41
1411 {
1412 id: 'editable_design41',
1413 name: 'Free',
1414 isDefault: false,
1415 hasSeparator: false,
1416 singleContainer: false,
1417 // Main container styles
1418
1419 container: {
1420 position: 'absolute',
1421 left: '0px',
1422 top: '0px',
1423 width: '76px',
1424 height: '31px',
1425 display: 'flex',
1426 'justify-content': 'center',
1427 'align-items': 'center',
1428 padding: '5px',
1429 radius: {
1430 'top-left': '20px',
1431 'top-right': '0px',
1432 'bottom-right': '20px',
1433 'bottom-left': '0px',
1434 },
1435 background: '#32BE6C',
1436 },
1437 // Title styles
1438 title: {
1439 text: 'FREE',
1440 color: '#FFFFFF',
1441 'font-family': '',
1442 'font-size': '15px',
1443 'line-height': '16px',
1444 'font-weight': '600',
1445 'text-align': 'center',
1446 },
1447 },
1448 ],
1449
1450 // Only value Editable designs
1451 value_editable: [
1452 // DESIGN 1
1453 {
1454 id: 'value_editable_design1',
1455 name: 'Special Offer',
1456 isDefault: true,
1457 hasSeparator: false,
1458 singleContainer: true,
1459 // Main container styles
1460 image: {
1461 url: valueEditable1,
1462 },
1463 design: {
1464 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge1.svg',
1465 },
1466 container: {
1467 position: 'absolute',
1468 left: '0px',
1469 top: '0px',
1470 width: '100px',
1471 'min-height': '30px',
1472 margin: '10px 0px',
1473 },
1474 // Title styles
1475 title: {
1476 text: '[discounted_percentage]',
1477 position: 'absolute',
1478 left: '16%',
1479 top: '64%',
1480 'font-weight': 600,
1481 'font-size': '16px',
1482 'font-family': '',
1483 transform: 'rotate(-7deg)',
1484 color: '#000',
1485 },
1486 },
1487 // DESIGN 2
1488 {
1489 id: 'value_editable_design2',
1490 name: 'Special Offer',
1491 isDefault: false,
1492 hasSeparator: false,
1493 singleContainer: true,
1494 // Main container styles
1495 image: {
1496 url: valueEditable2,
1497 },
1498 design: {
1499 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge2.svg',
1500 },
1501 container: {
1502 position: 'absolute',
1503 left: '0px',
1504 top: '0px',
1505 width: '100px',
1506 'min-height': '30px',
1507 margin: '10px 0px',
1508 },
1509 // Title styles
1510 title: {
1511 text: '[discounted_percentage]',
1512 position: 'absolute',
1513 left: '65%',
1514 top: '5%',
1515 'font-weight': 600,
1516 'font-size': '13px',
1517 'font-family': '',
1518 transform: 'rotate(-10deg)',
1519 color: '#FFFFFF',
1520 'letter-spacing': '-1px',
1521 },
1522 },
1523 // DESIGN 3
1524 {
1525 id: 'value_editable_design3',
1526 name: 'Biggest Sale',
1527 isDefault: false,
1528 hasSeparator: false,
1529 singleContainer: true,
1530 // Main container styles
1531 image: {
1532 url: valueEditable3,
1533 },
1534 design: {
1535 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge3.svg',
1536 },
1537 container: {
1538 position: 'absolute',
1539 left: '0px',
1540 top: '0px',
1541 width: '100px',
1542 'min-height': '30px',
1543 margin: '10px 0px',
1544 },
1545 // Title styles
1546 title: {
1547 text: '[discounted_percentage]',
1548 position: 'absolute',
1549 left: '21%',
1550 top: '82%',
1551 'font-weight': 600,
1552 'font-size': '13px',
1553 'font-family': '',
1554 color: '#fff',
1555 },
1556 },
1557 // DESIGN 4
1558 {
1559 id: 'value_editable_design4',
1560 name: 'Special Offer',
1561 isDefault: false,
1562 hasSeparator: false,
1563 singleContainer: true,
1564 // Main container styles
1565 image: {
1566 url: valueEditable4,
1567 },
1568 design: {
1569 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge4.svg',
1570 },
1571 container: {
1572 position: 'absolute',
1573 left: '0px',
1574 top: '0px',
1575 width: '100px',
1576 'min-height': '30px',
1577 margin: '10px 0px',
1578 },
1579 // Title styles
1580 title: {
1581 text: '[discounted_percentage]',
1582 position: 'absolute',
1583 left: '21%',
1584 top: '56%',
1585 'font-weight': 600,
1586 'font-size': '12px',
1587 'font-family': '',
1588 color: 'rgba(55, 1, 97, 1)',
1589 },
1590 },
1591 // DESIGN 5
1592 {
1593 id: 'value_editable_design5',
1594 name: 'Special Offer',
1595 isDefault: false,
1596 hasSeparator: false,
1597 singleContainer: true,
1598 // Main container styles
1599 image: {
1600 url: valueEditable5,
1601 },
1602 design: {
1603 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge5.svg',
1604 },
1605 container: {
1606 position: 'absolute',
1607 left: '0px',
1608 top: '0px',
1609 width: '100px',
1610 'min-height': '30px',
1611 margin: '10px 0px',
1612 },
1613 // Title styles
1614 title: {
1615 text: '[discounted_percentage]',
1616 position: 'absolute',
1617 left: '25%',
1618 top: '82%',
1619 'font-weight': 400,
1620 'font-size': '12px',
1621 'font-family': '',
1622 color: '#fff',
1623 },
1624 },
1625 // DESIGN 6
1626 {
1627 id: 'value_editable_design6',
1628 name: 'Special Offer',
1629 isDefault: false,
1630 hasSeparator: false,
1631 singleContainer: true,
1632 // Main container styles
1633 image: {
1634 url: valueEditable6,
1635 },
1636 design: {
1637 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge6.svg',
1638 },
1639 container: {
1640 position: 'absolute',
1641 left: '0px',
1642 top: '0px',
1643 width: '100px',
1644 'min-height': '30px',
1645 margin: '10px 0px',
1646 },
1647 // Title styles
1648 title: {
1649 text: '[discounted_percentage]',
1650 position: 'absolute',
1651 left: '50%',
1652 top: '20%',
1653 'font-weight': 800,
1654 'font-size': '20px',
1655 'font-family': "'cosmicSansMs', Sans Sarif",
1656 color: 'rgba(247, 148, 29, 1)',
1657 },
1658 },
1659 // DESIGN 7
1660 {
1661 id: 'value_editable_design7',
1662 name: 'Special Offer',
1663 isDefault: false,
1664 hasSeparator: false,
1665 singleContainer: true,
1666 // Main container styles
1667 image: {
1668 url: valueEditable7,
1669 },
1670 design: {
1671 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge7.svg',
1672 },
1673 container: {
1674 position: 'absolute',
1675 left: '0px',
1676 top: '0px',
1677 width: '100px',
1678 'min-height': '30px',
1679 margin: '10px 0px',
1680 },
1681 // Title styles
1682 title: {
1683 text: '[discounted_percentage]',
1684 position: 'absolute',
1685 left: '46%',
1686 top: '63%',
1687 'font-weight': 500,
1688 'font-size': '7px',
1689 'font-family': '',
1690 'letter-spacing': '-1px',
1691 color: 'rgba(253, 39, 49, 1)',
1692 },
1693 },
1694 // DESIGN 8
1695 {
1696 id: 'value_editable_design8',
1697 name: 'Special Offer',
1698 isDefault: false,
1699 hasSeparator: false,
1700 singleContainer: true,
1701 // Main container styles
1702 image: {
1703 url: valueEditable8,
1704 },
1705 design: {
1706 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge8.svg',
1707 },
1708 container: {
1709 position: 'absolute',
1710 left: '0px',
1711 top: '0px',
1712 width: '100px',
1713 'min-height': '30px',
1714 margin: '10px 0px',
1715 },
1716 // Title styles
1717 title: {
1718 text: '[discounted_percentage]',
1719 position: 'absolute',
1720 left: '20%',
1721 top: '72%',
1722 'font-weight': 500,
1723 'font-size': '14px',
1724 'font-family': '',
1725 color: '#fff',
1726 },
1727 },
1728 // DESIGN 9
1729 {
1730 id: 'value_editable_design9',
1731 name: 'Special Offer',
1732 isDefault: false,
1733 hasSeparator: false,
1734 singleContainer: true,
1735 // Main container styles
1736 image: {
1737 url: valueEditable9,
1738 },
1739 design: {
1740 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge9.svg',
1741 },
1742 container: {
1743 position: 'absolute',
1744 left: '0px',
1745 top: '0px',
1746 width: '100px',
1747 'min-height': '30px',
1748 margin: '10px 0px',
1749 },
1750 // Title styles
1751 title: {
1752 text: '[discounted_percentage]',
1753 position: 'absolute',
1754 left: '26%',
1755 top: '75%',
1756 'font-weight': 500,
1757 'font-size': '12px',
1758 'font-family': 'cosmicSansMs, sans-serif',
1759 color: '#fff',
1760 transform: 'rotate(-7deg)',
1761 },
1762 },
1763 // DESIGN 10
1764 {
1765 id: 'value_editable_design10',
1766 name: 'Special Offer',
1767 isDefault: false,
1768 hasSeparator: false,
1769 singleContainer: true,
1770 // Main container styles
1771 image: {
1772 url: valueEditable10,
1773 },
1774 design: {
1775 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge10.svg',
1776 },
1777 container: {
1778 position: 'absolute',
1779 left: '0px',
1780 top: '0px',
1781 width: '100px',
1782 'min-height': '30px',
1783 margin: '10px 0px',
1784 },
1785 // Title styles
1786 title: {
1787 text: '[discounted_percentage]',
1788 position: 'absolute',
1789 left: '25%',
1790 top: '61%',
1791 'font-weight': 500,
1792 'font-size': '14px',
1793 'font-family': '',
1794 color: '#fff',
1795 'letter-spacing': '-1px',
1796 },
1797 },
1798 // DESIGN 11
1799 {
1800 id: 'value_editable_design11',
1801 name: 'Special Offer',
1802 isDefault: false,
1803 hasSeparator: false,
1804 singleContainer: true,
1805 // Main container styles
1806 image: {
1807 url: valueEditable11,
1808 },
1809 design: {
1810 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge11.svg',
1811 },
1812 container: {
1813 position: 'absolute',
1814 left: '0px',
1815 top: '0px',
1816 width: '100px',
1817 'min-height': '30px',
1818 margin: '10px 0px',
1819 },
1820 // Title styles
1821 title: {
1822 text: '[discounted_percentage]',
1823 position: 'absolute',
1824 left: '27%',
1825 top: '69%',
1826 'font-weight': 500,
1827 'font-size': '10px',
1828 'font-family': '',
1829 color: '#fff',
1830 },
1831 },
1832 // DESIGN 12
1833 {
1834 id: 'value_editable_design12',
1835 name: 'Special Offer',
1836 isDefault: false,
1837 hasSeparator: false,
1838 singleContainer: true,
1839 // Main container styles
1840 image: {
1841 url: valueEditable12,
1842 },
1843 design: {
1844 url: VALUE_EDITABLE_PRODUCT_BADGE_IMG_DIR + 'badge12.png',
1845 },
1846 container: {
1847 position: 'absolute',
1848 left: '0px',
1849 top: '0px',
1850 width: '100px',
1851 'min-height': '30px',
1852 margin: '10px 0px',
1853 },
1854 // Title styles
1855 title: {
1856 text: '[discounted_percentage]',
1857 position: 'absolute',
1858 left: '39%',
1859 top: '58%',
1860 'font-weight': 500,
1861 'font-size': '10px',
1862 'font-family': '',
1863 color: 'rgba(239, 38, 53, 1)',
1864 transform: 'rotate(-5deg)',
1865 'letter-spacing': '-1px',
1866 },
1867 },
1868 ],
1869 image: {
1870 id: '',
1871 url: '',
1872 container: {
1873 position: 'absolute',
1874 left: '0px',
1875 top: '0px',
1876 'max-width': '100px',
1877 'max-height': '100px',
1878 },
1879 },
1880 };
1881
1882 export default productBadgeDesign;
1883