@tet/tet-components 1.3.46-testing → 1.3.47-testing
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index-f559cb2e.js +8 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/tet-accordion.cjs.entry.js +6 -6
- package/dist/cjs/tet-address-offers-view.cjs.entry.js +1 -1
- package/dist/cjs/tet-b2b-service-calculator.cjs.entry.js +1 -1
- package/dist/cjs/tet-border-radius.cjs.entry.js +1 -1
- package/dist/cjs/tet-business-lines.cjs.entry.js +1 -1
- package/dist/cjs/tet-colors.cjs.entry.js +3 -3
- package/dist/cjs/tet-components.cjs.js +1 -1
- package/dist/cjs/tet-datepicker-header_4.cjs.entry.js +5 -5
- package/dist/cjs/tet-datepicker.cjs.entry.js +4 -4
- package/dist/cjs/tet-expansion-panel.cjs.entry.js +1 -1
- package/dist/cjs/tet-font-weight.cjs.entry.js +1 -1
- package/dist/cjs/tet-fonts.cjs.entry.js +1 -1
- package/dist/cjs/tet-grid.cjs.entry.js +1 -1
- package/dist/cjs/tet-layout.cjs.entry.js +1 -1
- package/dist/cjs/tet-link.cjs.entry.js +1 -1
- package/dist/cjs/tet-navigation-mobile.cjs.entry.js +3 -3
- package/dist/cjs/tet-news-card-list.cjs.entry.js +1 -1
- package/dist/cjs/tet-notification.cjs.entry.js +1 -1
- package/dist/cjs/tet-number-input_2.cjs.entry.js +1 -1
- package/dist/cjs/tet-range-slider_2.cjs.entry.js +7 -7
- package/dist/cjs/tet-spacing.cjs.entry.js +1 -1
- package/dist/cjs/tet-stepper-v3.cjs.entry.js +42 -0
- package/dist/cjs/tet-textarea.cjs.entry.js +2 -2
- package/dist/cjs/tet-thank-you-view-v3.cjs.entry.js +92 -0
- package/dist/cjs/tet-tooltip.cjs.entry.js +1 -1
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/basic/steppers/tet-stepper-v3/test/tet-stepper-v3.spec.js +135 -0
- package/dist/collection/components/basic/steppers/tet-stepper-v3/tet-stepper-v3.css +486 -0
- package/dist/collection/components/basic/steppers/tet-stepper-v3/tet-stepper-v3.js +89 -0
- package/dist/collection/components/simple/inputs/tet-datepicker/partials/tet-datepicker-header/tet-datepicker-header.js +2 -2
- package/dist/collection/components/simple/inputs/tet-datepicker/partials/tet-datepicker-month-view/tet-datepicker-month-view.js +1 -1
- package/dist/collection/components/simple/inputs/tet-datepicker/partials/tet-datepicker-multi-year-view/tet-datepicker-multi-year-view.js +1 -1
- package/dist/collection/components/simple/inputs/tet-datepicker/partials/tet-datepicker-year-view/tet-datepicker-year-view.js +1 -1
- package/dist/collection/components/simple/inputs/tet-datepicker/tet-datepicker.js +4 -4
- package/dist/collection/components/simple/inputs/tet-range-slider/tet-range-slider.js +7 -7
- package/dist/collection/components/simple/inputs/tet-stepper-input/tet-stepper-input.js +1 -1
- package/dist/collection/components/simple/inputs/tet-textarea/tet-textarea.js +2 -2
- package/dist/collection/components/simple/lists/tet-news-card-list/tet-news-card-list.js +1 -1
- package/dist/collection/components/simple/menu/tet-navigation-mobile/tet-navigation-mobile.js +3 -3
- package/dist/collection/components/simple/structural/tet-accordion/tet-accordion.js +6 -6
- package/dist/collection/components/simple/structural/tet-expansion-panel/tet-expansion-panel.js +1 -1
- package/dist/collection/components/simple/text-blocks/tet-notification/tet-notification.js +1 -1
- package/dist/collection/components/simple/text-blocks/tet-tooltip/tet-tooltip.js +1 -1
- package/dist/collection/components/views/tet-address-offers-view/tet-address-offers-view.js +1 -1
- package/dist/collection/components/views/tet-b2b-service-calculator/tet-b2b-service-calculator.js +1 -1
- package/dist/collection/components/views/tet-business-lines/tet-business-lines.js +1 -1
- package/dist/collection/components/views/tet-thank-you-view-v3/test/tet-thank-you-view-v3.spec.js +175 -0
- package/dist/collection/components/views/tet-thank-you-view-v3/tet-thank-you-view-v3.css +469 -0
- package/dist/collection/components/views/tet-thank-you-view-v3/tet-thank-you-view-v3.js +357 -0
- package/dist/collection/docs/styling/border-radius/tet-border-radius.js +1 -1
- package/dist/collection/docs/styling/colors/tet-colors.js +3 -3
- package/dist/collection/docs/styling/font-weight/tet-font-weight.js +1 -1
- package/dist/collection/docs/styling/fonts/tet-fonts.js +1 -1
- package/dist/collection/docs/styling/layout/tet-layout.js +1 -1
- package/dist/collection/docs/styling/link/tet-link.js +1 -1
- package/dist/collection/docs/styling/spacing/tet-spacing.js +1 -1
- package/dist/collection/docs/styling/tet-grid/tet-grid.js +1 -1
- package/dist/components/index.js +4 -0
- package/dist/components/{p-6d2030bc.js → p-08f20a97.js} +1 -1
- package/dist/components/{p-bd462b2b.js → p-3c2b7a19.js} +7 -7
- package/dist/components/{p-f621eb12.js → p-64a1709d.js} +1 -1
- package/dist/components/{p-ef2c876b.js → p-87f69802.js} +1 -1
- package/dist/components/{p-7ffb7b91.js → p-9541b087.js} +2 -2
- package/dist/components/p-96c5b413.js +62 -0
- package/dist/components/{p-df47c3c2.js → p-cac98727.js} +1 -1
- package/dist/components/{p-0e5c2c19.js → p-d066a1fd.js} +1 -1
- package/dist/components/{p-4837068d.js → p-f143c1b6.js} +1 -1
- package/dist/components/tet-accordion.js +6 -6
- package/dist/components/tet-address-offers-view.js +1 -1
- package/dist/components/tet-b2b-service-calculator.js +2 -2
- package/dist/components/tet-border-radius.js +1 -1
- package/dist/components/tet-business-lines.js +1 -1
- package/dist/components/tet-cloud-configurator.js +1 -1
- package/dist/components/tet-colors.js +3 -3
- package/dist/components/tet-datepicker-header.js +1 -1
- package/dist/components/tet-datepicker-month-view.js +1 -1
- package/dist/components/tet-datepicker-multi-year-view.js +1 -1
- package/dist/components/tet-datepicker-year-view.js +1 -1
- package/dist/components/tet-datepicker.js +8 -8
- package/dist/components/tet-expansion-panel.js +1 -1
- package/dist/components/tet-font-weight.js +1 -1
- package/dist/components/tet-fonts.js +1 -1
- package/dist/components/tet-grid.js +1 -1
- package/dist/components/tet-layout.js +1 -1
- package/dist/components/tet-link.js +1 -1
- package/dist/components/tet-macd-view.js +1 -1
- package/dist/components/tet-navigation-mobile.js +3 -3
- package/dist/components/tet-news-card-list.js +1 -1
- package/dist/components/tet-notification.js +1 -1
- package/dist/components/tet-range-slider.js +1 -1
- package/dist/components/tet-referral.js +1 -1
- package/dist/components/tet-spacing.js +1 -1
- package/dist/components/tet-stepper-input.js +1 -1
- package/dist/components/tet-stepper-v3.d.ts +11 -0
- package/dist/components/tet-stepper-v3.js +6 -0
- package/dist/components/tet-table.js +1 -1
- package/dist/components/tet-textarea.js +2 -2
- package/dist/components/tet-thank-you-view-v3.d.ts +11 -0
- package/dist/components/tet-thank-you-view-v3.js +137 -0
- package/dist/components/tet-tooltip.js +1 -1
- package/dist/esm/index-7f1e2a22.js +8 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/tet-accordion.entry.js +6 -6
- package/dist/esm/tet-address-offers-view.entry.js +1 -1
- package/dist/esm/tet-b2b-service-calculator.entry.js +1 -1
- package/dist/esm/tet-border-radius.entry.js +1 -1
- package/dist/esm/tet-business-lines.entry.js +1 -1
- package/dist/esm/tet-colors.entry.js +3 -3
- package/dist/esm/tet-components.js +1 -1
- package/dist/esm/tet-datepicker-header_4.entry.js +5 -5
- package/dist/esm/tet-datepicker.entry.js +4 -4
- package/dist/esm/tet-expansion-panel.entry.js +1 -1
- package/dist/esm/tet-font-weight.entry.js +1 -1
- package/dist/esm/tet-fonts.entry.js +1 -1
- package/dist/esm/tet-grid.entry.js +1 -1
- package/dist/esm/tet-layout.entry.js +1 -1
- package/dist/esm/tet-link.entry.js +1 -1
- package/dist/esm/tet-navigation-mobile.entry.js +3 -3
- package/dist/esm/tet-news-card-list.entry.js +1 -1
- package/dist/esm/tet-notification.entry.js +1 -1
- package/dist/esm/tet-number-input_2.entry.js +1 -1
- package/dist/esm/tet-range-slider_2.entry.js +7 -7
- package/dist/esm/tet-spacing.entry.js +1 -1
- package/dist/esm/tet-stepper-v3.entry.js +38 -0
- package/dist/esm/tet-textarea.entry.js +2 -2
- package/dist/esm/tet-thank-you-view-v3.entry.js +88 -0
- package/dist/esm/tet-tooltip.entry.js +1 -1
- package/dist/tet-components/{p-b119d561.entry.js → p-0b54af69.entry.js} +1 -1
- package/dist/tet-components/{p-56ba2009.entry.js → p-12b577dc.entry.js} +1 -1
- package/dist/tet-components/{p-0a750c4f.entry.js → p-14398114.entry.js} +1 -1
- package/dist/tet-components/{p-bf3e7f72.entry.js → p-1878753a.entry.js} +1 -1
- package/dist/tet-components/{p-17b4104b.entry.js → p-390dae53.entry.js} +1 -1
- package/dist/tet-components/{p-d8851106.entry.js → p-3f047cc1.entry.js} +1 -1
- package/dist/tet-components/{p-29b4d2a1.entry.js → p-4025d8b9.entry.js} +1 -1
- package/dist/tet-components/{p-c34b6de0.entry.js → p-4f8a1bac.entry.js} +1 -1
- package/dist/tet-components/{p-8971f30a.entry.js → p-51b9e9b1.entry.js} +1 -1
- package/dist/tet-components/{p-2c4ff0e0.entry.js → p-535aa0e6.entry.js} +1 -1
- package/dist/tet-components/{p-7b7b84bc.entry.js → p-77d077a2.entry.js} +1 -1
- package/dist/tet-components/{p-6282db79.entry.js → p-829ea121.entry.js} +1 -1
- package/dist/tet-components/{p-075a2c0d.entry.js → p-85746897.entry.js} +1 -1
- package/dist/tet-components/p-884fb1ef.entry.js +1 -0
- package/dist/tet-components/{p-061c267a.entry.js → p-8f01d952.entry.js} +1 -1
- package/dist/tet-components/{p-adc24a53.entry.js → p-948edd76.entry.js} +1 -1
- package/dist/tet-components/{p-84b9ec15.entry.js → p-95636edc.entry.js} +1 -1
- package/dist/tet-components/{p-b4e98d75.entry.js → p-aeac34db.entry.js} +1 -1
- package/dist/tet-components/{p-5f74e092.entry.js → p-b35358e8.entry.js} +1 -1
- package/dist/tet-components/p-b6b9d41a.entry.js +1 -0
- package/dist/tet-components/{p-d5556174.entry.js → p-d119d84a.entry.js} +1 -1
- package/dist/tet-components/{p-6e4be4a3.entry.js → p-d13cc8cb.entry.js} +1 -1
- package/dist/tet-components/{p-1479c97e.entry.js → p-deb15b17.entry.js} +1 -1
- package/dist/tet-components/{p-f46011ad.entry.js → p-faa94705.entry.js} +1 -1
- package/dist/tet-components/tet-components.esm.js +1 -1
- package/dist/types/components/basic/steppers/tet-stepper-v3/tet-stepper-v3.d.ts +22 -0
- package/dist/types/components.d.ts +185 -0
- package/package.json +1 -1
|
@@ -0,0 +1,486 @@
|
|
|
1
|
+
/* Tet design styles */
|
|
2
|
+
@font-face{font-family:Avenir Next;src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix);src:url(assets/fonts/8e7462a9501f48c43c58f870188b3fb2.eot?#iefix) format("eot"),url(assets/fonts/3c3e10968ffc97c2a52c5830f9886d1f.woff2) format("woff2"),url(assets/fonts/660fbf858d30d7685fa4b166080f5980.woff) format("woff"),url(assets/fonts/2b7748589092fd1a10b806abdfb562ff.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix);src:url(assets/fonts/d5e25ad69d0ea31f3b8f66d634ca40fe.eot?#iefix) format("eot"),url(assets/fonts/aad36ecead30948bb30fe0ef818b749c.woff2) format("woff2"),url(assets/fonts/c437d7752feaf3f056bbf8613e898d3a.woff) format("woff"),url(assets/fonts/b8df4d02ef5de13a813917a85bc4a9c4.ttf) format("truetype");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix);src:url(assets/fonts/046190c9a2f724b925df848737b03819.eot?#iefix) format("eot"),url(assets/fonts/4d52f8276a74ea8efbad833ed790367c.woff2) format("woff2"),url(assets/fonts/a067695dd1b87e927f4056c040d84669.woff) format("woff"),url(assets/fonts/510a664af9771b72d4ce5e637109ca3c.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix);src:url(assets/fonts/0715de188f56c99aa615905f7e06292e.eot?#iefix) format("eot"),url(assets/fonts/63f5acc71d9852468683a4bfe824a28f.woff2) format("woff2"),url(assets/fonts/ed94c737da267752ce0abd79bb003ff6.woff) format("woff"),url(assets/fonts/6302f55a6dc6b12365177dc89b7d63cf.ttf) format("truetype");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix);src:url(assets/fonts/3f76abc23eef0596c499840db84213bb.eot?#iefix) format("eot"),url(assets/fonts/1fe7da97fe9dbe1349aca9b54b5fdf69.woff2) format("woff2"),url(assets/fonts/dacc6a84278e221422902af99579ada5.woff) format("woff"),url(assets/fonts/e530c573663a3a07243d303fbf7db508.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Avenir Next;src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix);src:url(assets/fonts/75f8489ba53f19968feaa3e2eb78c569.eot?#iefix) format("eot"),url(assets/fonts/93ec0034623fc696601ab99aba652d4c.woff2) format("woff2"),url(assets/fonts/d73c8eb1c13abe1237366aa3ee829a59.woff) format("woff"),url(assets/fonts/7b6dcef99f3f4b23346e23925ec8678f.ttf) format("truetype");font-weight:600;font-style:italic;font-display:swap}
|
|
3
|
+
.tet-icon{font-family:Tet Icons;font-weight:400;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}@font-face{font-family:Tet Icons;src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot);src:url(assets/fonts/d2ce51cdcd0b9707af186f8d50023d23.eot?#iefix) format("embedded-opentype"),url(assets/fonts/25f10ef322a1220b2e9e11db38b73892.woff2) format("woff2"),url(assets/fonts/fed75ac1edcf1c25cdd8612d2c365f9a.woff) format("woff"),url(assets/fonts/df7fbe67cabb13cb837172a73c46378a.ttf) format("truetype"),url(assets/fonts/5486d8c87e2abc6c13ed952a6cc96658.svg#tet-icons) format("svg");font-weight:400;font-style:normal}.tet-icon:before{content:"\E84E"}.tet-icon--sm{font-size:1.125rem}.tet-icon--md{font-size:1.5rem}.tet-icon--lg{font-size:2.25rem}.tet-icon--xl{font-size:3rem}.tet-icon--xxl{font-size:4rem}.tet-icon--0{font-size:0}.tet-icon--1{font-size:.0625rem}.tet-icon--2{font-size:.125rem}.tet-icon--3{font-size:.1875rem}.tet-icon--4{font-size:.25rem}.tet-icon--5{font-size:.3125rem}.tet-icon--6{font-size:.375rem}.tet-icon--7{font-size:.4375rem}.tet-icon--8{font-size:.5rem}.tet-icon--9{font-size:.5625rem}.tet-icon--10{font-size:.625rem}.tet-icon--11{font-size:.6875rem}.tet-icon--12{font-size:.75rem}.tet-icon--13{font-size:.8125rem}.tet-icon--14{font-size:.875rem}.tet-icon--15{font-size:.9375rem}.tet-icon--16{font-size:1rem}.tet-icon--17{font-size:1.0625rem}.tet-icon--18{font-size:1.125rem}.tet-icon--19{font-size:1.1875rem}.tet-icon--20{font-size:1.25rem}.tet-icon--21{font-size:1.3125rem}.tet-icon--22{font-size:1.375rem}.tet-icon--23{font-size:1.4375rem}.tet-icon--24{font-size:1.5rem}.tet-icon--25{font-size:1.5625rem}.tet-icon--26{font-size:1.625rem}.tet-icon--27{font-size:1.6875rem}.tet-icon--28{font-size:1.75rem}.tet-icon--29{font-size:1.8125rem}.tet-icon--30{font-size:1.875rem}.tet-icon--31{font-size:1.9375rem}.tet-icon--32{font-size:2rem}.tet-icon--33{font-size:2.0625rem}.tet-icon--34{font-size:2.125rem}.tet-icon--35{font-size:2.1875rem}.tet-icon--36{font-size:2.25rem}.tet-icon--37{font-size:2.3125rem}.tet-icon--38{font-size:2.375rem}.tet-icon--39{font-size:2.4375rem}.tet-icon--40{font-size:2.5rem}.tet-icon--41{font-size:2.5625rem}.tet-icon--42{font-size:2.625rem}.tet-icon--43{font-size:2.6875rem}.tet-icon--44{font-size:2.75rem}.tet-icon--45{font-size:2.8125rem}.tet-icon--46{font-size:2.875rem}.tet-icon--47{font-size:2.9375rem}.tet-icon--48{font-size:3rem}.tet-icon--49{font-size:3.0625rem}.tet-icon--50{font-size:3.125rem}.tet-icon--51{font-size:3.1875rem}.tet-icon--52{font-size:3.25rem}.tet-icon--53{font-size:3.3125rem}.tet-icon--54{font-size:3.375rem}.tet-icon--55{font-size:3.4375rem}.tet-icon--56{font-size:3.5rem}.tet-icon--57{font-size:3.5625rem}.tet-icon--58{font-size:3.625rem}.tet-icon--59{font-size:3.6875rem}.tet-icon--60{font-size:3.75rem}.tet-icon--61{font-size:3.8125rem}.tet-icon--62{font-size:3.875rem}.tet-icon--63{font-size:3.9375rem}.tet-icon--64{font-size:4rem}.tet-icon--65{font-size:4.0625rem}.tet-icon--66{font-size:4.125rem}.tet-icon--67{font-size:4.1875rem}.tet-icon--68{font-size:4.25rem}.tet-icon--69{font-size:4.3125rem}.tet-icon--70{font-size:4.375rem}.tet-icon--71{font-size:4.4375rem}.tet-icon--72{font-size:4.5rem}.tet-icon--73{font-size:4.5625rem}.tet-icon--74{font-size:4.625rem}.tet-icon--75{font-size:4.6875rem}.tet-icon--76{font-size:4.75rem}.tet-icon--77{font-size:4.8125rem}.tet-icon--78{font-size:4.875rem}.tet-icon--79{font-size:4.9375rem}.tet-icon--80{font-size:5rem}.tet-icon--81{font-size:5.0625rem}.tet-icon--82{font-size:5.125rem}.tet-icon--83{font-size:5.1875rem}.tet-icon--84{font-size:5.25rem}.tet-icon--85{font-size:5.3125rem}.tet-icon--86{font-size:5.375rem}.tet-icon--87{font-size:5.4375rem}.tet-icon--88{font-size:5.5rem}.tet-icon--89{font-size:5.5625rem}.tet-icon--90{font-size:5.625rem}.tet-icon--91{font-size:5.6875rem}.tet-icon--92{font-size:5.75rem}.tet-icon--93{font-size:5.8125rem}.tet-icon--94{font-size:5.875rem}.tet-icon--95{font-size:5.9375rem}.tet-icon--96{font-size:6rem}.tet-icon--97{font-size:6.0625rem}.tet-icon--98{font-size:6.125rem}.tet-icon--99{font-size:6.1875rem}.tet-icon--100{font-size:6.25rem}.tet-icon--101{font-size:6.3125rem}.tet-icon__add:before{content:"\E800"}.tet-icon__alert-circled:before{content:"\E801"}.tet-icon__alert:before{content:"\E802"}.tet-icon__bank:before{content:"\E803"}.tet-icon__box:before{content:"\E804"}.tet-icon__download:before{content:"\E805"}.tet-icon__burger:before{content:"\E806"}.tet-icon__cancel:before{content:"\E807"}.tet-icon__printer:before{content:"\E808"}.tet-icon__cart-add:before{content:"\E809"}.tet-icon__cart-remove:before{content:"\E80A"}.tet-icon__cart:before{content:"\E80B"}.tet-icon__chat:before{content:"\E80C"}.tet-icon__arrow-up:before{content:"\E80D"}.tet-icon__calendar:before{content:"\E80E"}.tet-icon__help-circled:before{content:"\E80F"}.tet-icon__edit:before{content:"\E810"}.tet-icon__external-link:before{content:"\E811"}.tet-icon__gift:before{content:"\E812"}.tet-icon__person:before{content:"\E813"}.tet-icon__heart:before{content:"\E814"}.tet-icon__language:before{content:"\E815"}.tet-icon__help:before{content:"\E816"}.tet-icon__home-1:before{content:"\E817"}.tet-icon__location:before{content:"\E818"}.tet-icon__home-3:before{content:"\E819"}.tet-icon__chart-even:before{content:"\E81A"}.tet-icon__info-2:before{content:"\E81B"}.tet-icon__key:before{content:"\E81C"}.tet-icon__info:before{content:"\E81D"}.tet-icon__lock-opened:before{content:"\E81E"}.tet-icon__lock-outlined:before{content:"\E81F"}.tet-icon__lock:before{content:"\E820"}.tet-icon__laptop-filled:before{content:"\E821"}.tet-icon__mail:before{content:"\E822"}.tet-icon__options:before{content:"\E823"}.tet-icon__chart-uneven:before{content:"\E824"}.tet-icon__mail-2:before{content:"\E825"}.tet-icon__remove:before{content:"\E826"}.tet-icon__mobile-filled:before{content:"\E827"}.tet-icon__ilu-calendar-check:before{content:"\E828"}.tet-icon__settings-outlined:before{content:"\E829"}.tet-icon__tablet:before{content:"\E82A"}.tet-icon__thumb-up:before{content:"\E82B"}.tet-icon__ilu-purchase:before{content:"\E82C"}.tet-icon__chart-even-outlined:before{content:"\E82D"}.tet-icon__movie:before{content:"\E82E"}.tet-icon__percent:before{content:"\E82F"}.tet-icon__ilu-change-whenever:before{content:"\E830"}.tet-icon__truck:before{content:"\E831"}.tet-icon__zero:before{content:"\E832"}.tet-icon__attach:before{content:"\E833"}.tet-icon__cloud-done:before{content:"\E834"}.tet-icon__cloud-download:before{content:"\E835"}.tet-icon__cloud-upload:before{content:"\E836"}.tet-icon__cloud:before{content:"\E837"}.tet-icon__folder:before{content:"\E838"}.tet-icon__remote:before{content:"\E839"}.tet-icon__router:before{content:"\E83A"}.tet-icon__shield-filled:before{content:"\E83B"}.tet-icon__shield:before{content:"\E83C"}.tet-icon__ilu-devices:before{content:"\E83D"}.tet-icon__ilu-get-points:before{content:"\E83E"}.tet-icon__tv:before{content:"\E83F"}.tet-icon__ilu-internet:before{content:"\E840"}.tet-icon__wifi-outlined:before{content:"\E841"}.tet-icon__wifi:before{content:"\E842"}.tet-icon__description-outlined:before{content:"\E843"}.tet-icon__laptop:before{content:"\E844"}.tet-icon__chart-uneven-outlined:before{content:"\E845"}.tet-icon__meter:before{content:"\E846"}.tet-icon__mobile:before{content:"\E847"}.tet-icon__phone:before{content:"\E848"}.tet-icon__plug-filled:before{content:"\E849"}.tet-icon__plug:before{content:"\E84A"}.tet-icon__print:before{content:"\E84B"}.tet-icon__camera:before{content:"\E84C"}.tet-icon__clock:before{content:"\E84D"}.tet-icon__placeholder:before{content:"\E84E"}.tet-icon__tv-filled:before{content:"\E84F"}.tet-icon__arrow-down:before{content:"\E850"}.tet-icon__arrow-left:before{content:"\E851"}.tet-icon__arrow-right:before{content:"\E852"}.tet-icon__description:before{content:"\E853"}.tet-icon__login:before{content:"\E854"}.tet-icon__check:before{content:"\E855"}.tet-icon__chevron-down:before{content:"\E856"}.tet-icon__chevron-left:before{content:"\E857"}.tet-icon__chevron-right:before{content:"\E858"}.tet-icon__chevron-up:before{content:"\E859"}.tet-icon__close-circled:before{content:"\E85A"}.tet-icon__close:before{content:"\E85B"}.tet-icon__more-horizontal:before{content:"\E85C"}.tet-icon__more-vertical:before{content:"\E85D"}.tet-icon__refresh:before{content:"\E85E"}.tet-icon__facebook:before{content:"\E85F"}.tet-icon__instagram:before{content:"\E860"}.tet-icon__linkedin:before{content:"\E861"}.tet-icon__people:before{content:"\E862"}.tet-icon__logout:before{content:"\E863"}.tet-icon__share:before{content:"\E864"}.tet-icon__twitter:before{content:"\E865"}.tet-icon__cancel-filled:before{content:"\E866"}.tet-icon__done:before{content:"\E867"}.tet-icon__star-filled:before{content:"\E868"}.tet-icon__star:before{content:"\E869"}.tet-icon__clipboard:before{content:"\E86A"}.tet-icon__ilu-calendar:before{content:"\E86B"}.tet-icon__check-circled:before{content:"\E86C"}.tet-icon__ilu-choose-channels:before{content:"\E86D"}.tet-icon__search:before{content:"\E86E"}.tet-icon__warning:before{content:"\E86F"}.tet-icon__ilu-clock-1:before{content:"\E870"}.tet-icon__ilu-fold:before{content:"\E871"}.tet-icon__ilu-letter:before{content:"\E872"}.tet-icon__ilu-pay:before{content:"\E873"}.tet-icon__ilu-meter:before{content:"\E874"}.tet-icon__ilu-sign:before{content:"\E875"}.tet-icon__smart-watch-filled:before{content:"\E876"}.tet-icon__washing-machine-filled:before{content:"\E877"}.tet-icon__bullet:before{content:"\E878"}.tet-icon__sound:before{content:"\E879"}.tet-icon__dropdown:before{content:"\E87A"}.tet-icon__mask-pass:before{content:"\E87B"}.tet-icon__select:before{content:"\E87C"}.tet-icon__text-area-sizing:before{content:"\E87D"}.tet-icon__unmask-pass:before{content:"\E87E"}.tet-icon__bullet-small:before{content:"\E882"}.tet-icon__electric-bolt:before{content:"\E880"}.tet-icon__sun:before{content:"\E881"}
|
|
4
|
+
:host {
|
|
5
|
+
box-sizing: border-box;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
*,
|
|
9
|
+
*:before,
|
|
10
|
+
*:after {
|
|
11
|
+
box-sizing: inherit;
|
|
12
|
+
padding: 0;
|
|
13
|
+
margin: 0;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
:host {
|
|
17
|
+
--color-gray-light: #cdd2de;
|
|
18
|
+
--color-ta070: #f5f6f8;
|
|
19
|
+
--color-ta080: #e6e8ee;
|
|
20
|
+
--color-ta100: #cdd2de;
|
|
21
|
+
--color-ta200: #9ba5be;
|
|
22
|
+
--color-ta300: #69789c;
|
|
23
|
+
--color-ta500: #1e356a;
|
|
24
|
+
--color-ta600: #051d59;
|
|
25
|
+
--color-tc090: #d6e6fd;
|
|
26
|
+
--color-tc100: #d1dffe;
|
|
27
|
+
--color-tc300: #75a1fb;
|
|
28
|
+
--color-tc500: #1a70f6;
|
|
29
|
+
--color-tc600: #0060f5;
|
|
30
|
+
--color-td500: #00F1F2;
|
|
31
|
+
--color-td600: #01cbe0;
|
|
32
|
+
--color-tf600: #f53b2a;
|
|
33
|
+
--color-tg300: #2b3036;
|
|
34
|
+
--color-tg400: #1d2128;
|
|
35
|
+
--color-tg500: #12171e;
|
|
36
|
+
--color-tg600: #01050c;
|
|
37
|
+
--color-th500: #f5f5f5;
|
|
38
|
+
--color-ti500: #869198;
|
|
39
|
+
--color-ti600: #aeb7bc;
|
|
40
|
+
--text-font: Gilroy, serif;
|
|
41
|
+
--text-color-darker: var(--color-ta600);
|
|
42
|
+
--text-color-dark: var(--color-ta500);
|
|
43
|
+
--text-color-dark-theme: var(--color-th500);
|
|
44
|
+
--icons-font: Tet Icons, serif;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.icon.tet-search {
|
|
48
|
+
font-family: var(--icons-font);
|
|
49
|
+
font-weight: 400;
|
|
50
|
+
font-style: normal;
|
|
51
|
+
font-size: 1.25rem;
|
|
52
|
+
display: inline-block;
|
|
53
|
+
line-height: 1;
|
|
54
|
+
text-transform: none;
|
|
55
|
+
letter-spacing: normal;
|
|
56
|
+
word-wrap: normal;
|
|
57
|
+
white-space: nowrap;
|
|
58
|
+
direction: ltr;
|
|
59
|
+
speak: none;
|
|
60
|
+
-webkit-font-smoothing: antialiased;
|
|
61
|
+
text-rendering: optimizeLegibility;
|
|
62
|
+
-moz-osx-font-smoothing: grayscale;
|
|
63
|
+
}
|
|
64
|
+
.icon.tet-search::before {
|
|
65
|
+
content: "\e86e";
|
|
66
|
+
}
|
|
67
|
+
.icon.tet-close-circled {
|
|
68
|
+
font-family: var(--icons-font);
|
|
69
|
+
font-weight: 400;
|
|
70
|
+
font-style: normal;
|
|
71
|
+
font-size: 1.25rem;
|
|
72
|
+
display: inline-block;
|
|
73
|
+
line-height: 1;
|
|
74
|
+
text-transform: none;
|
|
75
|
+
letter-spacing: normal;
|
|
76
|
+
word-wrap: normal;
|
|
77
|
+
white-space: nowrap;
|
|
78
|
+
direction: ltr;
|
|
79
|
+
speak: none;
|
|
80
|
+
-webkit-font-smoothing: antialiased;
|
|
81
|
+
text-rendering: optimizeLegibility;
|
|
82
|
+
-moz-osx-font-smoothing: grayscale;
|
|
83
|
+
}
|
|
84
|
+
.icon.tet-close-circled::before {
|
|
85
|
+
content: "\e85a";
|
|
86
|
+
}
|
|
87
|
+
.icon.tet-close {
|
|
88
|
+
font-family: var(--icons-font);
|
|
89
|
+
font-weight: 400;
|
|
90
|
+
font-style: normal;
|
|
91
|
+
font-size: 1.25rem;
|
|
92
|
+
display: inline-block;
|
|
93
|
+
line-height: 1;
|
|
94
|
+
text-transform: none;
|
|
95
|
+
letter-spacing: normal;
|
|
96
|
+
word-wrap: normal;
|
|
97
|
+
white-space: nowrap;
|
|
98
|
+
direction: ltr;
|
|
99
|
+
speak: none;
|
|
100
|
+
-webkit-font-smoothing: antialiased;
|
|
101
|
+
text-rendering: optimizeLegibility;
|
|
102
|
+
-moz-osx-font-smoothing: grayscale;
|
|
103
|
+
}
|
|
104
|
+
.icon.tet-close::before {
|
|
105
|
+
content: "\e85b";
|
|
106
|
+
}
|
|
107
|
+
.icon.tet-check-circled {
|
|
108
|
+
font-family: var(--icons-font);
|
|
109
|
+
font-weight: 400;
|
|
110
|
+
font-style: normal;
|
|
111
|
+
font-size: 1.25rem;
|
|
112
|
+
display: inline-block;
|
|
113
|
+
line-height: 1;
|
|
114
|
+
text-transform: none;
|
|
115
|
+
letter-spacing: normal;
|
|
116
|
+
word-wrap: normal;
|
|
117
|
+
white-space: nowrap;
|
|
118
|
+
direction: ltr;
|
|
119
|
+
speak: none;
|
|
120
|
+
-webkit-font-smoothing: antialiased;
|
|
121
|
+
text-rendering: optimizeLegibility;
|
|
122
|
+
-moz-osx-font-smoothing: grayscale;
|
|
123
|
+
}
|
|
124
|
+
.icon.tet-check-circled::before {
|
|
125
|
+
content: "\e86c";
|
|
126
|
+
}
|
|
127
|
+
.icon.tet-check {
|
|
128
|
+
font-family: var(--icons-font);
|
|
129
|
+
font-weight: 400;
|
|
130
|
+
font-style: normal;
|
|
131
|
+
font-size: 1.25rem;
|
|
132
|
+
display: inline-block;
|
|
133
|
+
line-height: 1;
|
|
134
|
+
text-transform: none;
|
|
135
|
+
letter-spacing: normal;
|
|
136
|
+
word-wrap: normal;
|
|
137
|
+
white-space: nowrap;
|
|
138
|
+
direction: ltr;
|
|
139
|
+
speak: none;
|
|
140
|
+
-webkit-font-smoothing: antialiased;
|
|
141
|
+
text-rendering: optimizeLegibility;
|
|
142
|
+
-moz-osx-font-smoothing: grayscale;
|
|
143
|
+
}
|
|
144
|
+
.icon.tet-check::before {
|
|
145
|
+
content: "\e855";
|
|
146
|
+
}
|
|
147
|
+
.icon.tet-chevron-up {
|
|
148
|
+
font-family: var(--icons-font);
|
|
149
|
+
font-weight: 400;
|
|
150
|
+
font-style: normal;
|
|
151
|
+
font-size: 1.25rem;
|
|
152
|
+
display: inline-block;
|
|
153
|
+
line-height: 1;
|
|
154
|
+
text-transform: none;
|
|
155
|
+
letter-spacing: normal;
|
|
156
|
+
word-wrap: normal;
|
|
157
|
+
white-space: nowrap;
|
|
158
|
+
direction: ltr;
|
|
159
|
+
speak: none;
|
|
160
|
+
-webkit-font-smoothing: antialiased;
|
|
161
|
+
text-rendering: optimizeLegibility;
|
|
162
|
+
-moz-osx-font-smoothing: grayscale;
|
|
163
|
+
}
|
|
164
|
+
.icon.tet-chevron-up::before {
|
|
165
|
+
content: "\e859";
|
|
166
|
+
}
|
|
167
|
+
.icon.tet-chevron-down {
|
|
168
|
+
font-family: var(--icons-font);
|
|
169
|
+
font-weight: 400;
|
|
170
|
+
font-style: normal;
|
|
171
|
+
font-size: 1.25rem;
|
|
172
|
+
display: inline-block;
|
|
173
|
+
line-height: 1;
|
|
174
|
+
text-transform: none;
|
|
175
|
+
letter-spacing: normal;
|
|
176
|
+
word-wrap: normal;
|
|
177
|
+
white-space: nowrap;
|
|
178
|
+
direction: ltr;
|
|
179
|
+
speak: none;
|
|
180
|
+
-webkit-font-smoothing: antialiased;
|
|
181
|
+
text-rendering: optimizeLegibility;
|
|
182
|
+
-moz-osx-font-smoothing: grayscale;
|
|
183
|
+
}
|
|
184
|
+
.icon.tet-chevron-down::before {
|
|
185
|
+
content: "\e856";
|
|
186
|
+
}
|
|
187
|
+
.icon.tet-clipboard {
|
|
188
|
+
font-family: var(--icons-font);
|
|
189
|
+
font-weight: 400;
|
|
190
|
+
font-style: normal;
|
|
191
|
+
font-size: 1.25rem;
|
|
192
|
+
display: inline-block;
|
|
193
|
+
line-height: 1;
|
|
194
|
+
text-transform: none;
|
|
195
|
+
letter-spacing: normal;
|
|
196
|
+
word-wrap: normal;
|
|
197
|
+
white-space: nowrap;
|
|
198
|
+
direction: ltr;
|
|
199
|
+
speak: none;
|
|
200
|
+
-webkit-font-smoothing: antialiased;
|
|
201
|
+
text-rendering: optimizeLegibility;
|
|
202
|
+
-moz-osx-font-smoothing: grayscale;
|
|
203
|
+
}
|
|
204
|
+
.icon.tet-clipboard::before {
|
|
205
|
+
content: "\e86a";
|
|
206
|
+
}
|
|
207
|
+
.icon.tet-info {
|
|
208
|
+
font-family: var(--icons-font);
|
|
209
|
+
font-weight: 400;
|
|
210
|
+
font-style: normal;
|
|
211
|
+
font-size: 1.25rem;
|
|
212
|
+
display: inline-block;
|
|
213
|
+
line-height: 1;
|
|
214
|
+
text-transform: none;
|
|
215
|
+
letter-spacing: normal;
|
|
216
|
+
word-wrap: normal;
|
|
217
|
+
white-space: nowrap;
|
|
218
|
+
direction: ltr;
|
|
219
|
+
speak: none;
|
|
220
|
+
-webkit-font-smoothing: antialiased;
|
|
221
|
+
text-rendering: optimizeLegibility;
|
|
222
|
+
-moz-osx-font-smoothing: grayscale;
|
|
223
|
+
}
|
|
224
|
+
.icon.tet-info::before {
|
|
225
|
+
content: "\e81d";
|
|
226
|
+
}
|
|
227
|
+
.icon.tet-done {
|
|
228
|
+
font-family: var(--icons-font);
|
|
229
|
+
font-weight: 400;
|
|
230
|
+
font-style: normal;
|
|
231
|
+
font-size: 1.25rem;
|
|
232
|
+
display: inline-block;
|
|
233
|
+
line-height: 1;
|
|
234
|
+
text-transform: none;
|
|
235
|
+
letter-spacing: normal;
|
|
236
|
+
word-wrap: normal;
|
|
237
|
+
white-space: nowrap;
|
|
238
|
+
direction: ltr;
|
|
239
|
+
speak: none;
|
|
240
|
+
-webkit-font-smoothing: antialiased;
|
|
241
|
+
text-rendering: optimizeLegibility;
|
|
242
|
+
-moz-osx-font-smoothing: grayscale;
|
|
243
|
+
}
|
|
244
|
+
.icon.tet-done::before {
|
|
245
|
+
content: "\e867";
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
@font-face {
|
|
249
|
+
font-family: "Gilroy";
|
|
250
|
+
font-style: normal;
|
|
251
|
+
font-weight: 400;
|
|
252
|
+
font-display: swap;
|
|
253
|
+
src: url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff");
|
|
254
|
+
}
|
|
255
|
+
@font-face {
|
|
256
|
+
font-family: "Gilroy";
|
|
257
|
+
font-style: normal;
|
|
258
|
+
font-weight: 500;
|
|
259
|
+
font-display: swap;
|
|
260
|
+
src: url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff");
|
|
261
|
+
}
|
|
262
|
+
@font-face {
|
|
263
|
+
font-family: "Gilroy";
|
|
264
|
+
font-style: normal;
|
|
265
|
+
font-weight: 600;
|
|
266
|
+
font-display: swap;
|
|
267
|
+
src: url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff");
|
|
268
|
+
}
|
|
269
|
+
@font-face {
|
|
270
|
+
font-family: "Gilroy";
|
|
271
|
+
font-style: normal;
|
|
272
|
+
font-weight: 700;
|
|
273
|
+
font-display: swap;
|
|
274
|
+
src: url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff");
|
|
275
|
+
}
|
|
276
|
+
@font-face {
|
|
277
|
+
font-family: "Inter";
|
|
278
|
+
font-style: normal;
|
|
279
|
+
font-weight: 400;
|
|
280
|
+
font-display: swap;
|
|
281
|
+
src: url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff");
|
|
282
|
+
}
|
|
283
|
+
@font-face {
|
|
284
|
+
font-family: "Inter";
|
|
285
|
+
font-style: normal;
|
|
286
|
+
font-weight: 500;
|
|
287
|
+
font-display: swap;
|
|
288
|
+
src: url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff");
|
|
289
|
+
}
|
|
290
|
+
@font-face {
|
|
291
|
+
font-family: "Inter";
|
|
292
|
+
font-style: normal;
|
|
293
|
+
font-weight: 600;
|
|
294
|
+
font-display: swap;
|
|
295
|
+
src: url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff");
|
|
296
|
+
}
|
|
297
|
+
@font-face {
|
|
298
|
+
font-family: "Gilroy";
|
|
299
|
+
font-style: normal;
|
|
300
|
+
font-weight: 400;
|
|
301
|
+
font-display: swap;
|
|
302
|
+
src: url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff");
|
|
303
|
+
}
|
|
304
|
+
@font-face {
|
|
305
|
+
font-family: "Gilroy";
|
|
306
|
+
font-style: normal;
|
|
307
|
+
font-weight: 500;
|
|
308
|
+
font-display: swap;
|
|
309
|
+
src: url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff");
|
|
310
|
+
}
|
|
311
|
+
@font-face {
|
|
312
|
+
font-family: "Gilroy";
|
|
313
|
+
font-style: normal;
|
|
314
|
+
font-weight: 600;
|
|
315
|
+
font-display: swap;
|
|
316
|
+
src: url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff");
|
|
317
|
+
}
|
|
318
|
+
@font-face {
|
|
319
|
+
font-family: "Gilroy";
|
|
320
|
+
font-style: normal;
|
|
321
|
+
font-weight: 700;
|
|
322
|
+
font-display: swap;
|
|
323
|
+
src: url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff");
|
|
324
|
+
}
|
|
325
|
+
@font-face {
|
|
326
|
+
font-family: "Inter";
|
|
327
|
+
font-style: normal;
|
|
328
|
+
font-weight: 400;
|
|
329
|
+
font-display: swap;
|
|
330
|
+
src: url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff");
|
|
331
|
+
}
|
|
332
|
+
@font-face {
|
|
333
|
+
font-family: "Inter";
|
|
334
|
+
font-style: normal;
|
|
335
|
+
font-weight: 500;
|
|
336
|
+
font-display: swap;
|
|
337
|
+
src: url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff");
|
|
338
|
+
}
|
|
339
|
+
@font-face {
|
|
340
|
+
font-family: "Inter";
|
|
341
|
+
font-style: normal;
|
|
342
|
+
font-weight: 600;
|
|
343
|
+
font-display: swap;
|
|
344
|
+
src: url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff");
|
|
345
|
+
}
|
|
346
|
+
:host {
|
|
347
|
+
--font-family-fallback: Gilroy, Arial, sans-serif;
|
|
348
|
+
--font-family-headline: Gilroy;
|
|
349
|
+
--font-family-content: Inter, var(--font-family-fallback);
|
|
350
|
+
font-family: var(--font-family-content);
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
:host {
|
|
354
|
+
/**
|
|
355
|
+
* @prop --stepper-step-active-color: The color of active step line and icon
|
|
356
|
+
* @prop --stepper-step-non-active-color: The color of non-active step line and icon
|
|
357
|
+
* @prop --stepper-step-check-color: The color used in check icon
|
|
358
|
+
* @prop --stepper-step-description-color: The color of step description text
|
|
359
|
+
* @prop --stepper-step-title-color: The color of step title text
|
|
360
|
+
* @prop --stepper-step-content-background: The color of step content background
|
|
361
|
+
* @prop --stepper-step-shadow: The shadow of step content
|
|
362
|
+
*/
|
|
363
|
+
--stepper-step-active-color: var(--tc-blue-40);
|
|
364
|
+
--stepper-step-non-active-color: var(--tc-border-tertiary);
|
|
365
|
+
--stepper-step-check-color: var(--tc-layer-primary);
|
|
366
|
+
--stepper-step-description-color: var(--tc-text-secondary);
|
|
367
|
+
--stepper-step-title-color: var(--tc-text-primary);
|
|
368
|
+
--stepper-step-content-background: var(--tc-layer-primary);
|
|
369
|
+
--stepper-step-shadow: var(--tc-elevation-one);
|
|
370
|
+
display: flex;
|
|
371
|
+
justify-content: center;
|
|
372
|
+
align-items: center;
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
.stepper {
|
|
376
|
+
width: 100%;
|
|
377
|
+
list-style: none;
|
|
378
|
+
}
|
|
379
|
+
.stepper.dark {
|
|
380
|
+
--stepper-step-active-color: var(--tc-blue-40-dark);
|
|
381
|
+
--stepper-step-non-active-color: var(--tc-border-tertiary-dark);
|
|
382
|
+
--stepper-step-check-color: var(--tc-layer-inverse-primary-dark);
|
|
383
|
+
--stepper-step-description-color: var(--tc-text-secondary-dark);
|
|
384
|
+
--stepper-step-title-color: var(--tc-text-primary-dark);
|
|
385
|
+
--stepper-step-content-background: var(--tc-layer-primary-dark);
|
|
386
|
+
--stepper-step-shadow: var(--tc-elevation-one-dark);
|
|
387
|
+
}
|
|
388
|
+
.stepper .step {
|
|
389
|
+
position: relative;
|
|
390
|
+
display: flex;
|
|
391
|
+
}
|
|
392
|
+
.stepper .step:first-child .line.top, .stepper .step:last-child .line.bottom {
|
|
393
|
+
display: none;
|
|
394
|
+
}
|
|
395
|
+
.stepper .step .status-wrapper {
|
|
396
|
+
position: relative;
|
|
397
|
+
display: flex;
|
|
398
|
+
justify-content: center;
|
|
399
|
+
align-items: center;
|
|
400
|
+
width: 2.5rem;
|
|
401
|
+
margin-right: 1rem;
|
|
402
|
+
}
|
|
403
|
+
@media only screen and (max-width: 31.1875rem) {
|
|
404
|
+
.stepper .step .status-wrapper {
|
|
405
|
+
width: 2rem;
|
|
406
|
+
}
|
|
407
|
+
}
|
|
408
|
+
.stepper .step .status-wrapper .line {
|
|
409
|
+
position: absolute;
|
|
410
|
+
width: 0.125rem;
|
|
411
|
+
background-color: var(--stepper-step-non-active-color);
|
|
412
|
+
}
|
|
413
|
+
.stepper .step .status-wrapper .line.top {
|
|
414
|
+
top: 0;
|
|
415
|
+
bottom: 50%;
|
|
416
|
+
}
|
|
417
|
+
.stepper .step .status-wrapper .line.bottom {
|
|
418
|
+
top: 50%;
|
|
419
|
+
bottom: 0;
|
|
420
|
+
}
|
|
421
|
+
.stepper .step .status-wrapper .circle {
|
|
422
|
+
position: absolute;
|
|
423
|
+
width: 1.25rem;
|
|
424
|
+
height: 1.25rem;
|
|
425
|
+
background: var(--stepper-step-content-background);
|
|
426
|
+
border: 0.25rem solid var(--stepper-step-non-active-color);
|
|
427
|
+
border-radius: 50%;
|
|
428
|
+
}
|
|
429
|
+
.stepper .step .status-wrapper.active .line.top,
|
|
430
|
+
.stepper .step .status-wrapper.active .line.bottom.next-step-active {
|
|
431
|
+
background-color: var(--stepper-step-active-color);
|
|
432
|
+
}
|
|
433
|
+
.stepper .step .status-wrapper.active .circle {
|
|
434
|
+
border-color: var(--stepper-step-active-color);
|
|
435
|
+
}
|
|
436
|
+
.stepper .step .status-wrapper .check-icon {
|
|
437
|
+
position: absolute;
|
|
438
|
+
display: flex;
|
|
439
|
+
justify-content: center;
|
|
440
|
+
align-items: center;
|
|
441
|
+
width: 2.5rem;
|
|
442
|
+
height: 2.5rem;
|
|
443
|
+
background: var(--stepper-step-active-color);
|
|
444
|
+
border-radius: 50%;
|
|
445
|
+
}
|
|
446
|
+
@media only screen and (max-width: 31.1875rem) {
|
|
447
|
+
.stepper .step .status-wrapper .check-icon {
|
|
448
|
+
width: 2rem;
|
|
449
|
+
height: 2rem;
|
|
450
|
+
}
|
|
451
|
+
}
|
|
452
|
+
.stepper .step .status-wrapper .check-icon .check {
|
|
453
|
+
--icon-size: 1.656rem;
|
|
454
|
+
--icon-color: var(--stepper-step-check-color);
|
|
455
|
+
}
|
|
456
|
+
@media only screen and (max-width: 31.1875rem) {
|
|
457
|
+
.stepper .step .status-wrapper .check-icon .check {
|
|
458
|
+
--icon-size: 1.344rem;
|
|
459
|
+
}
|
|
460
|
+
}
|
|
461
|
+
.stepper .step .content {
|
|
462
|
+
flex: 1;
|
|
463
|
+
padding: 1rem 1.5rem;
|
|
464
|
+
margin: 0.25rem 0;
|
|
465
|
+
box-shadow: var(--stepper-step-shadow);
|
|
466
|
+
background: var(--stepper-step-content-background);
|
|
467
|
+
border-radius: 1rem;
|
|
468
|
+
}
|
|
469
|
+
@media only screen and (max-width: 31.1875rem) {
|
|
470
|
+
.stepper .step .content {
|
|
471
|
+
padding: 1rem;
|
|
472
|
+
}
|
|
473
|
+
}
|
|
474
|
+
.stepper .step .content-title {
|
|
475
|
+
font: 600 1.125rem/1.75rem "Inter", "Gilroy, Arial, sans-serif";
|
|
476
|
+
color: var(--stepper-step-title-color);
|
|
477
|
+
}
|
|
478
|
+
@media only screen and (max-width: 31.1875rem) {
|
|
479
|
+
.stepper .step .content-title {
|
|
480
|
+
font: 600 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif";
|
|
481
|
+
}
|
|
482
|
+
}
|
|
483
|
+
.stepper .step .content-description {
|
|
484
|
+
font: 400 1rem/1.5rem "Inter", "Gilroy, Arial, sans-serif";
|
|
485
|
+
color: var(--stepper-step-description-color);
|
|
486
|
+
}
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import { h, Host } from "@stencil/core";
|
|
2
|
+
/**
|
|
3
|
+
* A simple stepper component.
|
|
4
|
+
*/
|
|
5
|
+
export class TetStepperV3 {
|
|
6
|
+
constructor() {
|
|
7
|
+
this.renderStep = (step, index) => {
|
|
8
|
+
var _a;
|
|
9
|
+
const nextStepActive = (_a = this.stepperData[index + 1]) === null || _a === void 0 ? void 0 : _a.active;
|
|
10
|
+
return (h("li", { class: "step" }, h("div", { class: { 'status-wrapper': true, 'active': step.active } }, h("div", { class: "line top" }), h("div", { class: { 'line': true, 'bottom': true, 'next-step-active': nextStepActive } }), this.renderStepIcon(step.icon)), h("div", { class: "content" }, this.renderStepTitle(step === null || step === void 0 ? void 0 : step.title), this.renderStepDescription(step === null || step === void 0 ? void 0 : step.description))));
|
|
11
|
+
};
|
|
12
|
+
this.renderStepIcon = (icon) => {
|
|
13
|
+
if (icon === 'check') {
|
|
14
|
+
return (h("div", { class: "check-icon" }, h("tet-icon", { class: "check", name: "check" })));
|
|
15
|
+
}
|
|
16
|
+
return h("div", { class: "circle" });
|
|
17
|
+
};
|
|
18
|
+
this.renderStepTitle = (title) => {
|
|
19
|
+
return title ? h("div", { class: "content-title", innerHTML: title }) : null;
|
|
20
|
+
};
|
|
21
|
+
this.renderStepDescription = (description) => {
|
|
22
|
+
return description ? h("div", { class: "content-description", innerHTML: description }) : null;
|
|
23
|
+
};
|
|
24
|
+
this.stepperData = [];
|
|
25
|
+
this.theme = 'light';
|
|
26
|
+
}
|
|
27
|
+
render() {
|
|
28
|
+
return (h(Host, { key: 'dece3c166882cf3b80550bf563c240a74873dcae' }, h("ol", { key: '91bfd3c1f28dae1ae4b56721a0d695b250ed2f94', class: {
|
|
29
|
+
stepper: true,
|
|
30
|
+
[this.theme]: true
|
|
31
|
+
} }, this.stepperData.map(this.renderStep.bind(this)))));
|
|
32
|
+
}
|
|
33
|
+
static get is() { return "tet-stepper-v3"; }
|
|
34
|
+
static get encapsulation() { return "shadow"; }
|
|
35
|
+
static get originalStyleUrls() {
|
|
36
|
+
return {
|
|
37
|
+
"$": ["tet-stepper-v3.scss"]
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
static get styleUrls() {
|
|
41
|
+
return {
|
|
42
|
+
"$": ["tet-stepper-v3.css"]
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
static get properties() {
|
|
46
|
+
return {
|
|
47
|
+
"stepperData": {
|
|
48
|
+
"type": "unknown",
|
|
49
|
+
"mutable": false,
|
|
50
|
+
"complexType": {
|
|
51
|
+
"original": "StepperV3StepInterface[]",
|
|
52
|
+
"resolved": "StepperV3StepInterface[]",
|
|
53
|
+
"references": {
|
|
54
|
+
"StepperV3StepInterface": {
|
|
55
|
+
"location": "local",
|
|
56
|
+
"path": "/__w/internal-tet-web-components-tet-components/internal-tet-web-components-tet-components/src/src/components/basic/steppers/tet-stepper-v3/tet-stepper-v3.tsx",
|
|
57
|
+
"id": "src/components/basic/steppers/tet-stepper-v3/tet-stepper-v3.tsx::StepperV3StepInterface"
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
},
|
|
61
|
+
"required": false,
|
|
62
|
+
"optional": false,
|
|
63
|
+
"docs": {
|
|
64
|
+
"tags": [],
|
|
65
|
+
"text": "An array of data to show in the stepper"
|
|
66
|
+
},
|
|
67
|
+
"defaultValue": "[]"
|
|
68
|
+
},
|
|
69
|
+
"theme": {
|
|
70
|
+
"type": "string",
|
|
71
|
+
"mutable": false,
|
|
72
|
+
"complexType": {
|
|
73
|
+
"original": "'light' | 'dark'",
|
|
74
|
+
"resolved": "\"dark\" | \"light\"",
|
|
75
|
+
"references": {}
|
|
76
|
+
},
|
|
77
|
+
"required": false,
|
|
78
|
+
"optional": false,
|
|
79
|
+
"docs": {
|
|
80
|
+
"tags": [],
|
|
81
|
+
"text": "The theme of the component."
|
|
82
|
+
},
|
|
83
|
+
"attribute": "theme",
|
|
84
|
+
"reflect": false,
|
|
85
|
+
"defaultValue": "'light'"
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
}
|
|
89
|
+
}
|
|
@@ -51,9 +51,9 @@ export class TetDatepickerHeader {
|
|
|
51
51
|
this.internalDateChanged.emit(newDate);
|
|
52
52
|
}
|
|
53
53
|
render() {
|
|
54
|
-
return (h("div", { key: '
|
|
54
|
+
return (h("div", { key: 'e7ba3f37861a2885daa91d83931f54806d35e5d9', class: "header" }, this.datepickerView !== 'year'
|
|
55
55
|
? (h("div", { class: "icon-container", onClick: () => this.subtractDates() }, h("tet-icon", { class: "arrow-left", name: "arrow-left" })))
|
|
56
|
-
: h("div", null), h("div", { key: '
|
|
56
|
+
: h("div", null), h("div", { key: '42893ca05833946f33455cba0b28689d9dfb1fee', class: "control-button", onClick: () => this.changeDatepickerView() }, this.getControlButtonDate(), h("tet-icon", { key: 'a9b275586ae2e30c678bbfd73ed291a4a950e1eb', class: "chevron-down", name: this.datepickerView === 'month' ? 'chevron-down' : 'chevron-up' })), this.datepickerView !== 'year'
|
|
57
57
|
? (h("div", { class: "icon-container", onClick: () => this.addDates() }, h("tet-icon", { class: "arrow-left", name: "arrow-right" })))
|
|
58
58
|
: h("div", null)));
|
|
59
59
|
}
|
|
@@ -156,7 +156,7 @@ export class TetDatepickerMonthView {
|
|
|
156
156
|
return date.toDateString() === this.currentDate.toDateString();
|
|
157
157
|
}
|
|
158
158
|
render() {
|
|
159
|
-
return (h(Host, { key: '
|
|
159
|
+
return (h(Host, { key: 'fe427edbdc99dd540cc676934c15af21ecd63448' }, h("div", { key: '6f79b0b63d2feaa82b03c87458ff56513eda24e0', class: "weekday-header" }, this.days.map((day) => h("div", { class: "day" }, day))), h("div", { key: 'b0c9afeb4a4002af751575d4a4e17c2ca775df1a', class: "month-dates" }, this.previousMonthPreviewDates.map((date) => h("div", { class: "date-container" }, h("div", { class: "preview-date" }, date.getDate()))), this.monthDates.map(date => h("div", { class: this.getDateContainerClasses(date), onPointerEnter: (event) => this.setInRangeHover(date, event), onPointerLeave: (event) => this.removeInRangeHover(event) }, h("div", { class: this.getDateClasses(date), onClick: () => this.handleDateSelection(date) }, date.getDate()))), this.nextMonthPreviewDates.map((date) => h("div", { class: "date-container" }, h("div", { class: "preview-date" }, date))))));
|
|
160
160
|
}
|
|
161
161
|
static get is() { return "tet-datepicker-month-view"; }
|
|
162
162
|
static get encapsulation() { return "shadow"; }
|
|
@@ -29,7 +29,7 @@ export class TetDatepickerMultiYearView {
|
|
|
29
29
|
this.years = this.getYears(this.internalDate);
|
|
30
30
|
}
|
|
31
31
|
render() {
|
|
32
|
-
return (h("div", { key: '
|
|
32
|
+
return (h("div", { key: '5d44d96f15909feb53a1d47e65abbfcbe0113fff', class: "container" }, this.years.map((year) => h("div", { class: this.getYearClasses(year), onClick: () => this.handleYearSelection(year) }, year))));
|
|
33
33
|
}
|
|
34
34
|
static get is() { return "tet-datepicker-multi-year-view"; }
|
|
35
35
|
static get encapsulation() { return "shadow"; }
|
|
@@ -34,7 +34,7 @@ export class TetDatepickerYearView {
|
|
|
34
34
|
return this.todayDate.getMonth() === monthIndex;
|
|
35
35
|
}
|
|
36
36
|
render() {
|
|
37
|
-
return (h("div", { key: '
|
|
37
|
+
return (h("div", { key: '1b139e987779fb41d1aa70bcfc66e993527d1dcb', class: "container" }, this.months.map((month, index) => h("div", { class: "month-container" }, h("div", { class: this.getMonthClasses(index), onClick: () => this.handleMonthSelection(index) }, month)))));
|
|
38
38
|
}
|
|
39
39
|
static get is() { return "tet-datepicker-year-view"; }
|
|
40
40
|
static get encapsulation() { return "shadow"; }
|
|
@@ -94,10 +94,10 @@ export class TetDatepicker {
|
|
|
94
94
|
this.rangeDatesChanged.emit(newDates);
|
|
95
95
|
}
|
|
96
96
|
render() {
|
|
97
|
-
return (h("div", { key: '
|
|
98
|
-
h("tet-datepicker-month-view", { key: '
|
|
99
|
-
h("tet-datepicker-multi-year-view", { key: '
|
|
100
|
-
h("tet-datepicker-year-view", { key: '
|
|
97
|
+
return (h("div", { key: 'ec1cfcb4cb61607d6fde08d72f5d8ec67960e2fd', class: this.getOverlayClasses(), onClick: this.handleDatepickerClose }, h("div", { key: '380dd06ac2eef3763d487f1f3402d5aa319152f2', class: "container", ref: (el) => this.datepickerContainer = el }, h("tet-datepicker-header", { key: '829dfca521223b2a7295af97c8b5a1a0415a24bb', selectedDate: this.date, internalDate: this.internalDate, locale: this.locale, datepickerView: this.datepickerView }), this.datepickerView === 'month' &&
|
|
98
|
+
h("tet-datepicker-month-view", { key: '07570e6f6a97936ab39254f7b7abc4102a709dec', selectedDate: this.date, internalDate: this.internalDate, rangePickerMode: this.rangePickerMode, rangeDates: this.rangeDates }), this.datepickerView === 'multi-year' &&
|
|
99
|
+
h("tet-datepicker-multi-year-view", { key: 'e3341301d62e62f2ab41e1c65a0500cf531cddd9', selectedDate: this.date, internalDate: this.internalDate }), this.datepickerView === 'year' &&
|
|
100
|
+
h("tet-datepicker-year-view", { key: '2c4ce88a9b0130530ede910d4499d4682cc00f01', selectedDate: this.date, internalDate: this.internalDate }))));
|
|
101
101
|
}
|
|
102
102
|
static get is() { return "tet-datepicker"; }
|
|
103
103
|
static get encapsulation() { return "shadow"; }
|