mp-design-system 0.9.17 → 0.9.24
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/build/arc.a8e07ecd.svg +1 -0
- package/dist/build/crystal.a90c9e1f.svg +1 -0
- package/dist/build/dots-pattern.1b95f054.svg +1 -0
- package/dist/build/js/app.js +1 -1
- package/dist/build/js/app.js.map +1 -1
- package/dist/build/scss/library.css +1 -1
- package/dist/build/scss/library.css.map +1 -1
- package/dist/build/scss/main.css +1 -1
- package/dist/build/scss/main.css.map +1 -1
- package/package.json +1 -1
- package/src/_includes/components/accordion/accordion.md +1 -1
- package/src/_includes/components/breadcrumb/breadcrumb.config.js +6 -4
- package/src/_includes/components/breadcrumb/breadcrumb.njk +18 -2
- package/src/_includes/components/breadcrumb/breadcrumb.scss +69 -0
- package/src/_includes/components/button/button.config.js +6 -0
- package/src/_includes/components/button/button.scss +9 -0
- package/src/_includes/components/campaign/campaign.config.js +4 -2
- package/src/_includes/components/component/component.njk +2 -2
- package/src/_includes/components/gallery/gallery.config.js +34 -8
- package/src/_includes/components/gallery/gallery.md +1 -0
- package/src/_includes/components/gallery/gallery.njk +0 -1
- package/src/_includes/components/gallery/gallery.scss +7 -8
- package/src/_includes/components/input/radio.scss +21 -1
- package/src/_includes/components/post-meta/post-meta.njk +2 -2
- package/src/_includes/components/slat/slat.config.js +12 -0
- package/src/_includes/components/slat/slat.scss +14 -0
- package/src/_includes/components/table/table.config.js +7 -6
- package/src/_includes/components/table/table.md +16 -0
- package/src/_includes/components/table/table.scss +9 -0
- package/src/_includes/components/tabs/tabs.config.js +22 -3
- package/src/_includes/components/tabs/tabs.njk +1 -1
- package/src/_includes/components/tabs/tabs.scss +4 -0
- package/src/_includes/layout.njk +2 -1
- package/src/_includes/library-navigation/brand-nav.njk +1 -0
- package/src/_includes/library-navigation/components-nav.njk +1 -0
- package/src/assets/js/imports/accordion.js +0 -2
- package/src/assets/scss/components/index.scss +1 -0
- package/src/assets/scss/library.scss +6 -3
- package/src/assets/scss/objects/syntax-highlighting.scss +4 -0
- package/src/assets/scss/tools/cutoff.scss +21 -31
- package/src/assets/scss/utilities/flow.scss +1 -0
- package/src/assets/svg/arc.svg +1 -0
- package/src/assets/svg/crystal.svg +1 -0
- package/src/assets/svg/dots-pattern.svg +1 -1
- package/src/brand/illustration.md +8 -2
- package/src/brand/patterns.njk +43 -0
- package/src/brand/typography.md +12 -5
- package/src/components/creating-a-component.md +1 -1
- package/src/components/flow.njk +31 -18
- package/src/components/iconography.njk +1 -1
- package/src/components/installation.md +3 -1
- package/src/components/utilities.md +37 -11
- package/src/index.njk +7 -4
- package/src/prototype/product.njk +29 -19
- package/src/static/img/slide-4.webp +0 -0
- package/src/static/img/slide-5.webp +0 -0
- package/src/static/img/slide-6.webp +0 -0
- package/src/static/img/slide-7.webp +0 -0
- package/dist/build/dots-pattern.3c9c2a26.svg +0 -1
- package/src/_includes/components/campaign/campaign.md +0 -2
@@ -0,0 +1 @@
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 693 671" opacity=".075"><g clip-path="url('#a')"><path stroke="#3D7B87" d="M388.57 203.44c40.74 9.94 66.77 48.93 58.38 88.2-8.38 39.27-48.05 64.23-89.3 56.67"/><path stroke="#3D7B87" d="M402.01 140.47c2.72.35 5.43.82 8.15 1.4 56.13 11.98 91.68 68.3 79.4 125.79-12.27 57.5-67.72 94.39-123.84 82.4a98.78 98.78 0 0 1-8.01-2.04"/><path stroke="#3D7B87" d="M432.3-1.42c3.09.5 6.18 1.08 9.27 1.74 97.39 20.78 159.62 115.91 139.01 212.47-20.6 96.55-116.27 157.98-213.65 137.19a183 183 0 0 1-9.17-2.2"/><path stroke="#3D7B87" d="M359.04 347.92c50.87 14.25 81.93 69.05 69.9 125.41-9.2 43.08-41 75.04-78.8 84.26"/><path stroke="#3D7B87" d="M358.75 349.03a75.38 75.38 0 0 1-15.33 143.5m472.91-210.11c-136.88 72.26-297.27 99.23-458.69 65.9"/><path stroke="#3D7B87" d="M710.4 603.24c-92.04-125.65-211.68-216.14-352.29-256"/><path stroke="#3D7B87" d="M730.15 434.78c20.26-94.9-46.81-189.74-149.9-211.75-103.1-22-203.05 37.17-223.31 132.09-20.26 94.9 46.8 189.74 149.9 211.75 103.1 22 203.05-37.17 223.3-132.09Z"/><path stroke="#3D7B87" d="M565.63 393.51c11.4-53.42-25.74-106.7-83.05-118.93-57.32-12.24-112.98 21.23-124.38 74.65-11.41 53.43 25.74 106.7 83.05 118.94 57.31 12.23 112.98-21.23 124.38-74.66Z"/><path stroke="#3D7B87" d="M507.87 381.04c8.07-37.81-18.83-75.68-60.2-84.5-41.36-8.84-81.37 14.74-89.44 52.55-8.08 37.81 18.82 75.68 60.19 84.51 41.36 8.83 81.38-14.75 89.45-52.56Z"/><path stroke="#3D7B87" d="M668.34-16.28c-164.89 90.43-279.7 223.03-314.5 386.05-34.6 162.08 15.29 329 127.5 478.23"/><path stroke="#3D7B87" d="M482.38 560.08c20.96-98.17-37.75-193.87-131.07-213.79-93.33-19.92-186 43.46-206.95 141.63-20.96 98.18 37.75 193.87 131.07 213.8 93.33 19.92 186-43.47 206.95-141.64Z"/><circle cx="545.73" cy="65.7" r="6.7" fill="#3D7B87" transform="rotate(12.05 545.73 65.7)"/><circle cx="6.7" cy="6.7" r="6.7" fill="#3D7B87" transform="scale(1 -1) rotate(-12.05 -2911.17 -1076.64)"/><ellipse cx="4.94" cy="7.18" fill="#3D7B87" rx="4.94" ry="7.18" transform="scale(1 -1) rotate(-20.98 183.75 -1296.01)"/><ellipse cx="4.74" cy="6.4" fill="#3D7B87" rx="4.74" ry="6.4" transform="scale(1 -1) rotate(-12.05 187.9 -2125.37)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(31.69 1029.73 -24.26)"/><ellipse cx="2.8" cy="5.82" fill="#3D7B87" rx="2.8" ry="5.82" transform="scale(1 -1) rotate(31.69 867.17 203.72)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(16.08 1654.79 57.2)"/><ellipse cx="163.88" cy="128.11" fill="#3D7B87" rx="4.48" ry="9.03" transform="rotate(-120.9 163.88 128.11)"/><ellipse cx="274.03" cy="67.48" fill="#3D7B87" rx="4.48" ry="9.03" transform="rotate(-113.38 274.03 67.48)"/><ellipse cx="367.21" cy="92.23" fill="#3D7B87" rx="3.39" ry="7.31" transform="rotate(-99.19 367.2 92.23)"/><ellipse cx="3.98" cy="6.65" fill="#3D7B87" rx="3.98" ry="6.65" transform="scale(1 -1) rotate(3.39 8253.05 -219.92)"/><ellipse cx="3.48" cy="6.68" fill="#3D7B87" rx="3.48" ry="6.68" transform="scale(1 -1) rotate(24.86 1254.69 -215.22)"/><ellipse cx="3.76" cy="7.12" fill="#3D7B87" rx="3.76" ry="7.12" transform="scale(1 -1) rotate(49.8 674.95 -223)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(-24.75 -733 -411.39)"/><ellipse cx="4.06" cy="7.93" fill="#3D7B87" rx="4.06" ry="7.93" transform="scale(1 -1) rotate(-38.06 -261.45 -309.48)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(2.61 7685.98 3177.5)"/><ellipse cx="3.46" cy="6.72" fill="#3D7B87" rx="3.46" ry="6.72" transform="scale(1 -1) rotate(-.91 -18651.2 -141.87)"/><ellipse cx="19.17" cy="224.95" fill="#3D7B87" rx="3.55" ry="6.9" transform="rotate(23.2 19.17 224.95)"/><ellipse cx="9.33" cy="256.03" fill="#3D7B87" rx="3.65" ry="7.09" transform="rotate(12.05 9.33 256.03)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(36.8 698.44 97.73)"/><ellipse cx="4.91" cy="9.03" fill="#3D7B87" rx="4.91" ry="9.03" transform="scale(1 -1) rotate(35.4 868.22 142.26)"/><ellipse cx="4.91" cy="7.64" fill="#3D7B87" rx="4.91" ry="7.64" transform="scale(1 -1) rotate(44.07 803.06 63.23)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(-38.32 -292.24 -370.78)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(-51.58 -121.02 -356.51)"/><ellipse cx="4.06" cy="9.03" fill="#3D7B87" rx="4.06" ry="9.03" transform="scale(1 -1) rotate(-62.45 6.86 -343.71)"/><ellipse cx="5.46" cy="9.03" fill="#3D7B87" rx="5.46" ry="9.03" transform="scale(1 -1) rotate(-77.71 94.75 -297.43)"/><ellipse cx="4.79" cy="4.88" fill="#3D7B87" rx="4.79" ry="4.88" transform="scale(1 -1) rotate(-12.05 -2589.61 -1403.38)"/><ellipse cx="4.79" cy="4.88" fill="#3D7B87" rx="4.79" ry="4.88" transform="scale(1 -1) rotate(-12.05 -2137.24 -1615.32)"/><ellipse cx="4.79" cy="4.88" fill="#3D7B87" rx="4.79" ry="4.88" transform="scale(1 -1) rotate(-12.05 -2683.45 -1973.08)"/><ellipse cx="482.54" cy="126.94" fill="#3D7B87" rx="4.79" ry="4.88" transform="rotate(12.05 482.54 126.94)"/><ellipse cx="4.79" cy="4.88" fill="#3D7B87" rx="4.79" ry="4.88" transform="matrix(.978 .2088 .2088 -.978 446 631.9)"/><ellipse cx="584.07" cy="149.46" fill="#3D7B87" rx="4.79" ry="4.88" transform="rotate(12.05 584.07 149.46)"/><ellipse cx="6.52" cy="6.65" fill="#3D7B87" rx="6.52" ry="6.65" transform="scale(1 -1) rotate(-12.05 -2495.49 -1899.88)"/><ellipse cx="452.09" cy="161.39" fill="#3D7B87" rx="4.78" ry="5.77" transform="rotate(-44.35 452.09 161.39)"/><ellipse cx="6.52" cy="6.65" fill="#3D7B87" rx="6.52" ry="6.65" transform="matrix(.978 .2088 .2088 -.978 335.3 496.36)"/><ellipse cx="416.1" cy="214.01" fill="#3D7B87" rx="6.52" ry="6.65" transform="rotate(12.05 416.1 214.01)"/><ellipse cx="5.02" cy="6.18" fill="#3D7B87" rx="5.02" ry="6.18" transform="scale(1 -1) rotate(-26.41 -907.55 -1119.88)"/><ellipse cx="489.75" cy="225.01" fill="#3D7B87" rx="5.02" ry="6.18" transform="rotate(-2.31 489.75 225.01)"/><ellipse cx="5.32" cy="5.42" fill="#3D7B87" rx="5.32" ry="5.42" transform="scale(1 -1) rotate(-12.05 -2090.56 -1998.83)"/><ellipse cx="439.92" cy="243.88" fill="#3D7B87" rx="5.32" ry="5.42" transform="rotate(12.05 439.92 243.88)"/><ellipse cx="2.84" cy="5.27" fill="#3D7B87" rx="2.84" ry="5.27" transform="scale(1 -1) rotate(-8.31 -2220.86 -1682.37)"/><ellipse cx="232.75" cy="289.48" fill="#3D7B87" rx="2.84" ry="5.27" transform="rotate(15.8 232.75 289.48)"/><ellipse cx="7.5" cy="11.35" fill="#3D7B87" rx="7.5" ry="11.35" transform="scale(1 -1) rotate(-12.05 -2451.83 -2523.91)"/><ellipse cx="578.22" cy="223.89" fill="#3D7B87" rx="5.02" ry="4.58" transform="rotate(12.05 578.22 223.89)"/><ellipse cx="3.54" cy="6.98" fill="#3D7B87" rx="3.54" ry="6.98" transform="scale(1 -1) rotate(-31.41 -745.42 -1273.8)"/><ellipse cx="650.64" cy="251.96" fill="#3D7B87" rx="3.54" ry="6.98" transform="rotate(-7.3 650.64 251.96)"/><ellipse cx="5.42" cy="4.43" fill="#3D7B87" rx="5.42" ry="4.43" transform="matrix(.978 .2088 .2088 -.978 473.24 473)"/><ellipse cx="532.6" cy="301.26" fill="#3D7B87" rx="5.42" ry="4.31" transform="rotate(12.05 532.6 301.26)"/><ellipse cx="6.7" cy="5.11" fill="#3D7B87" rx="6.7" ry="5.11" transform="scale(1 -1) rotate(-30.78 -529.84 -1189.83)"/><ellipse cx="565.93" cy="358.88" fill="#3D7B87" rx="6.7" ry="5.11" transform="rotate(-6.68 565.93 358.88)"/><ellipse cx="5.16" cy="4.6" fill="#3D7B87" rx="5.16" ry="4.6" transform="scale(1 -1) rotate(-47.05 -293.12 -1016.12)"/><ellipse cx="5.44" cy="3.86" fill="#3D7B87" rx="5.44" ry="3.86" transform="scale(1 -1) rotate(-43.96 -292.56 -955.94)"/><ellipse cx="622.7" cy="350.92" fill="#3D7B87" rx="5.95" ry="4.22" transform="rotate(-15.38 622.7 350.92)"/><ellipse cx="4.89" cy="4.1" fill="#3D7B87" rx="4.89" ry="4.1" transform="scale(1 -1) rotate(-88.1 -9.93 -434.95)"/><ellipse cx="445.81" cy="297.26" fill="#3D7B87" rx="4.89" ry="4.1" transform="rotate(-64 445.8 297.26)"/><ellipse cx="8.53" cy="6.01" fill="#3D7B87" rx="8.53" ry="6.01" transform="scale(-1 1) rotate(78.34 -489.68 -34.66)"/><ellipse cx="487.64" cy="276.67" fill="#3D7B87" rx="8.53" ry="6.01" transform="rotate(-77.57 487.64 276.67)"/><ellipse cx="8.53" cy="6.01" fill="#3D7B87" rx="8.53" ry="6.01" transform="scale(-1 1) rotate(59.21 -595.82 -237.03)"/><ellipse cx="504.69" cy="362.53" fill="#3D7B87" rx="8.53" ry="6.01" transform="rotate(-96.69 504.69 362.53)"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h693v671H0z"/></clipPath></defs></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 523 666" opacity=".075"><g clip-path="url('#a')"><path stroke="#3D7B87" d="m74 183 62-61 81 14 20 76-62 62-81-15-20-76Zm78 304-20-77"/><path stroke="#3D7B87" d="m93 259-62 61 20 77 82 14 62-62-19-76M91 548l62-62 81 15 20 75-62 62-82-15-19-75Zm146-335 82 14 62-62-20-76-82-15-62 62m59 228 62-62 82 14 20 76-62 62-82-15-20-75Zm0 0-82-14"/><path stroke="#3D7B87" d="m296 439-63 62m145-48 20 77-62 61-83-14m127-411 82 14 62-62-19-76-83-15-62 62m79 304 82 14 63-62-20-76-82-14-63 61m43-137 20 76m-144 48-20-77"/><path stroke="#3D7B87" d="m521 406 20 77-62 61-82-14"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 205 131)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 263 359)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 268 68)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 327 295)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 306 221)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 364 449)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 324 585)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 181 631)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 60 179)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 121 405)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 125 115)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 183 343)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 39 390)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 161 269)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 19 315)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 223 494)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 80 541)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 347 84)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 407 311)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 410 22)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 470 249)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 449 175)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 508 401)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 465 539)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 493 36)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 225 205)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 284 433)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 241 571)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 98 618)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 81 253)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 141 481)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 369 158)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 428 385)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 385 523)"/><circle cx="9.9" cy="9.9" r="9.9" fill="#3D7B87" transform="matrix(1 -.33 .24 .91 511 113)"/><path stroke="#3D7B87" d="m41 177 23 4m69-66-6-21m73 572-6-22m82-576-5-21m72 572-5-22m82-576-6-21m73 572-6-22M0 314l23 4m37 222 23 4M510 36l39-37M85 649l18-17M27 420l17-17"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h523v666H0z"/></clipPath></defs></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="421" height="724" fill="none"><g stroke="#004157" opacity=".1"><circle cx="36.965" cy="27.974" r="17.5" transform="rotate(-15 36.965 27.974)"/><circle cx="141.285" cy=".021" r="17.5" transform="rotate(-15 141.285 .021)"/><circle cx="3.44" cy="111.496" r="17.5" transform="rotate(-15 3.44 111.496)"/><circle cx="107.76" cy="83.544" r="17.5" transform="rotate(-15 107.76 83.544)"/><circle cx="212.08" cy="55.591" r="17.5" transform="rotate(-15 212.08 55.591)"/><circle cx="74.235" cy="167.067" r="17.5" transform="rotate(-15 74.235 167.067)"/><circle cx="178.555" cy="139.114" r="17.5" transform="rotate(-15 178.555 139.114)"/><circle cx="40.71" cy="250.59" r="17.5" transform="rotate(-15 40.71 250.59)"/><circle cx="145.03" cy="222.637" r="17.5" transform="rotate(-15 145.03 222.637)"/><circle cx="249.35" cy="194.685" r="17.5" transform="rotate(-15 249.35 194.685)"/><circle cx="7.185" cy="334.113" r="17.5" transform="rotate(-15 7.185 334.113)"/><circle cx="111.505" cy="306.16" r="17.5" transform="rotate(-15 111.505 306.16)"/><circle cx="215.825" cy="278.208" r="17.5" transform="rotate(-15 215.825 278.208)"/><circle cx="77.98" cy="389.683" r="17.5" transform="rotate(-15 77.98 389.683)"/><circle cx="182.3" cy="361.73" r="17.5" transform="rotate(-15 182.3 361.73)"/><circle cx="286.62" cy="333.778" r="17.5" transform="rotate(-15 286.62 333.778)"/><circle cx="44.455" cy="473.206" r="17.5" transform="rotate(-15 44.455 473.206)"/><circle cx="148.775" cy="445.254" r="17.5" transform="rotate(-15 148.775 445.254)"/><circle cx="253.095" cy="417.301" r="17.5" transform="rotate(-15 253.095 417.301)"/><circle cx="10.93" cy="556.729" r="17.5" transform="rotate(-15 10.93 556.729)"/><circle cx="115.25" cy="528.776" r="17.5" transform="rotate(-15 115.25 528.776)"/><circle cx="219.57" cy="500.824" r="17.5" transform="rotate(-15 219.57 500.824)"/><circle cx="323.89" cy="472.871" r="17.5" transform="rotate(-15 323.89 472.871)"/><circle cx="81.725" cy="612.299" r="17.5" transform="rotate(-15 81.725 612.299)"/><circle cx="186.045" cy="584.347" r="17.5" transform="rotate(-15 186.045 584.347)"/><circle cx="290.365" cy="556.394" r="17.5" transform="rotate(-15 290.365 556.394)"/><circle cx="48.2" cy="695.822" r="17.5" transform="rotate(-15 48.2 695.822)"/><circle cx="152.52" cy="667.87" r="17.5" transform="rotate(-15 152.52 667.87)"/><circle cx="256.84" cy="639.917" r="17.5" transform="rotate(-15 256.84 639.917)"/><circle cx="361.16" cy="611.965" r="17.5" transform="rotate(-15 361.16 611.965)"/><circle cx="223.315" cy="723.44" r="17.5" transform="rotate(-15 223.315 723.44)"/><circle cx="327.635" cy="695.488" r="17.5" transform="rotate(-15 327.635 695.488)"/></g></svg>
|
package/dist/build/js/app.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
(()=>{function e(e){e.addEventListener("click",(e=>{
|
1
|
+
(()=>{function e(e){e.addEventListener("click",(e=>{e.currentTarget.parentElement.classList.toggle("c-accordion__item--open")}))}var t=function(){Array.from(document.querySelectorAll(".c-accordion__title")).forEach(e)};var o=function(){let e=0;const t=document.querySelectorAll(".c-hero__image-bg"),o=document.querySelectorAll(".c-hero__image-fg");o.length>0&&setInterval((()=>{for(var r of t)r.style.opacity=0;for(var c of(e=e!=t.length-1?e+1:0,t[e].style.opacity=1,o))c.style.opacity=0;o[e].style.opacity=1}),5e3)};var r=function(){const e=document.getElementById("clearForm");e&&e.addEventListener("click",(function(){this.closest("form").elements.forEach((e=>{if(""!=e.value){if("text"==e.type.toLowerCase()||"email"==e.type.toLowerCase()||"tel"==e.type.toLowerCase()||"select-one"==e.type.toLowerCase()||"textarea"==e.type.toLowerCase())return void(e.value="");if("checkbox"==e.type.toLowerCase())return void(e.checked=!1)}}))}))};function c(e){const t=e.querySelector(".c-table tbody"),o=e.querySelector(".c-table thead"),r=e.querySelector(".c-comparison__mobile");if(!t||!o||!r)return;const c=Array.from(o.children[0].children).filter(((e,t)=>t)).map((e=>({info:e.innerHTML,table:[]})));Array.from(t.children).forEach((e=>{if(e.classList.contains("c-table__title"))c.forEach((t=>{t.table.push({type:"title",title:e.children[0].textContent})}));else{const t=Array.from(e.children),o=t.shift();t.forEach(((e,t)=>{c[t].table.push({type:"row",key:o.textContent,value:e.innerHTML})}))}})),c.forEach((e=>{const t=function(e){const t=document.createElement("article");return t.innerHTML=`<div class="c-comparison__content">\n ${e.info}\n </div>\n <table class="c-table">\n ${e.table.map((e=>"title"===e.type?`<tr class="c-table__title"><th colspan="2">${e.title}</th></tr>`:`<tr>\n <td>${e.key}</td>\n <td>${e.value}</td>\n </tr>`)).join("")}\n </table>`,t}(e);r.appendChild(t)}))}var n=function(){document.querySelectorAll(".c-comparison").forEach(c)};var a=function(){const e=document.querySelectorAll(".c-gallery__main .c-gallery__slide"),t=document.querySelectorAll(".c-gallery__thumbnails .c-gallery__slide");function o(){const e=document.querySelector(".c-gallery__main").cloneNode(!0);e.classList.remove("c-gallery__main"),e.classList.add("c-lightbox"),e.querySelectorAll(".c-gallery__slide").forEach((function(e){if(e.classList.contains("c-gallery__video")&&e.remove(),!e.classList.contains("c-gallery__video")){var t=e.querySelector("img");""!=t.srcset&&t.removeAttribute("srcset")}e.classList.add("c-lightbox__slide"),e.classList.remove("c-gallery__slide")})),document.body.appendChild(e),e.insertAdjacentHTML("beforeend",'<a class="c-lightbox__prev"></a><a class="c-lightbox__next"></a>'),e.querySelector(".c-lightbox__prev").addEventListener("click",(function(){const t=e.querySelector(".active"),o=e.querySelector('[data-slide="'+(parseInt(t.dataset.slide)-1)+'"]');null!=o&&(t.classList.remove("active"),o.classList.add("active"))})),e.querySelector(".c-lightbox__next").addEventListener("click",(function(){const t=e.querySelector(".active"),o=e.querySelector('[data-slide="'+(parseInt(t.dataset.slide)+1)+'"]');null!=o&&(t.classList.remove("active"),o.classList.add("active"))})),e.addEventListener("click",(function(t){t.target===t.currentTarget&&e.remove()}))}t.forEach((o=>o.addEventListener("click",(function(r){t.forEach((function(e){e!=r.target.parentNode&&e.classList.remove("active")})),r.target.parentNode.classList.add("active"),e.forEach((function(e){e.dataset.slide==o.dataset.slide?e.classList.add("active"):e.classList.remove("active")}))})))),e.forEach((function(e){e.classList.contains("c-gallery__video")||e.addEventListener("click",o)}))};const i=(e,t,o)=>((e,t=0,o=1)=>Math.min(o,Math.max(t,e)))((o-e)/(t-e));var l=function(){let e=0;const t=document.querySelector(".c-hero__canvas");if(!t)return;const o=t.getContext("2d"),r=!window.matchMedia("(prefers-reduced-motion: no-preference)").matches,c=147,n=.25;let a,l,s,d,u,h=[];function f(){a=t.scrollWidth,l=t.scrollHeight,o.canvas.width=a,o.canvas.height=l,s=Math.ceil(a/c),d=Math.ceil(l/c),u=(s+1)*(d+1);const e=function(e){const t=[...e];for(let e=t.length-1;e>0;e--){let o=Math.floor(Math.random()*(e+1));[t[e],t[o]]=[t[o],t[e]]}return t}(Array.from({length:u},((e,t)=>t)));h=[];for(let t=0;t<=s;t++)for(let o=0;o<=d;o++)h.push({counter:e.shift(),direction:Math.random()>.5?n:-.25,x:c*(t+1)-147,y:c*(o+1)-73.5})}window.addEventListener("resize",f),f(),function c(){e+=.005,o.clearRect(0,0,t.width,t.height),o.beginPath();for(let r=t.width;r>0;r--)o.lineTo(r,.5*t.height-Math.cos(e+r/5*.03)*(.3*l));o.lineWidth=.5,o.strokeStyle="rgb(19,170,19)",o.stroke(),h.forEach((e=>{var t,r,c,a,l,s,d,u;t=e.x,r=e.y,a=0,l=h.length,s=0,d=.5,u=e.counter,c=((e,t,o)=>e*(1-o)+t*o)(s,d,i(a,l,u)),o.beginPath(),o.moveTo(t-14,r),o.lineTo(t+14,r),o.strokeStyle=`rgba(255, 255, 255, ${c}`,o.moveTo(t,r-14),o.lineTo(t,r+14),o.stroke(),e.counter+=e.direction,e.counter>=h.length&&(e.direction=-.25),e.counter<0&&(e.direction=n)})),r||window.requestAnimationFrame(c)}()};var s=function(){document.addEventListener("DOMContentLoaded",(()=>{const e=document.getElementById("videoBackground");if(void 0!==e&&null!=e){const o=window.matchMedia("(prefers-reduced-motion: reduce)");o&&!o.matches||e.classList.add("u-hidden");const r=document.getElementById("playVideo"),c=document.getElementById("lightboxVideo"),n=c.querySelector(".c-lightbox__video");function t(){c.classList.contains("u-hidden")?(e.paused&&e.play(),n.paused||n.pause()):e.paused||e.pause()}r.addEventListener("click",(o=>{e.pause(),c.classList.remove("u-hidden"),t()})),c.addEventListener("click",(o=>{o.target.classList.contains("c-lightbox__video")||(e.setAttribute("autoplay",""),c.classList.add("u-hidden"),t())})),window.addEventListener("keydown",(function(o){"Escape"==o.key&&(e.setAttribute("autoplay",""),c.classList.add("u-hidden"),t())}))}}))};var d=()=>{Array.from(document.querySelectorAll(".c-table--responsive")).forEach((function(e){const t=e.querySelectorAll("thead > :first-child th"),o=Number(e.getAttribute("data-columns"))||2;if(t.length<o)return void e.classList.remove("c-table--responsive");Array.from(e.querySelectorAll("tbody tr")).forEach((e=>{Array.from(t).map((e=>e.textContent)).forEach(((t,o)=>{e.children[o]&&e.children[o].setAttribute("data-responsive-title",t)}))}))}))};function u(){document.documentElement.style.setProperty("--scrollbarWidth",window.innerWidth-document.body.clientWidth+"px")}var h=function(){u(),window.addEventListener("resize",((e,t)=>{let o=!1;return()=>{o||(e(),o=!0,setTimeout((()=>o=!1),t))}})(u,250))};function f(e){const t=Array.from(e.querySelectorAll("a")),o=new IntersectionObserver(function(e){return t=>{const o=t.find((e=>e.isIntersecting));o&&e.forEach((e=>{e.classList.toggle("c-scroll-spy-active",e.getAttribute("href")==="#"+o.target.id)}))}}(t));t.forEach((e=>{const t=e.getAttribute("href").replace("#",""),r=document.getElementById(t);r&&o.observe(r)}))}var y=function(){Array.from(document.querySelectorAll(".c-scroll-spy")).forEach(f)};function m(e){const t=Array.from(e.querySelectorAll(".c-tabs__control")),o=Array.from(e.querySelectorAll(".c-tab")),r=e.classList.contains("c-tabs--persist");if(t.length&&o.length&&(t.forEach((e=>{e.addEventListener("click",function(e,t,o){return r=>{const c=r.currentTarget,n=t.find((e=>e.id===c.getAttribute("href").replace("#","")));if(!n)return!0;r.preventDefault(),o&&history.pushState(null,null,c.getAttribute("href")),e.forEach((e=>e.classList.toggle("c-tabs__control--active",e===c))),t.forEach((e=>{const t=e===n;if(e.classList.toggle("c-tab--active",t),!o)if(t){e.setAttribute("tabIndex",-1);const t=window.scrollY;e.focus(),window.scrollTo({behavior:"auto",top:t})}else e.removeAttribute("tabIndex")}))}}(t,o,r))})),r&&window.location.hash)){const t=e.querySelector('[href="'+window.location.hash+'"]');t&&t.dispatchEvent(new Event("click"))}}var v=function(){Array.from(document.querySelectorAll(".c-tabs--anchor")).forEach(m)};window.NodeList&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach),window.HTMLCollection&&!HTMLCollection.prototype.forEach&&(HTMLCollection.prototype.forEach=Array.prototype.forEach),t(),o(),r(),n(),a(),l(),s(),d(),h(),y(),v()})();
|
2
2
|
//# sourceMappingURL=app.js.map
|
package/dist/build/js/app.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"mappings":"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","sources":["src/assets/js/imports/accordion.js","src/assets/js/imports/carousel.js","src/assets/js/imports/clear-form.js","src/assets/js/imports/comparison.js","src/assets/js/imports/gallery.js","src/assets/js/imports/utilities.js","src/assets/js/imports/hero-pattern.js","src/assets/js/imports/hero-video.js","src/assets/js/imports/responsive-table.js","src/assets/js/imports/scrollbar-width.js","src/assets/js/imports/scroll-spy.js","src/assets/js/imports/tabs.js","src/assets/js/app.js"],"sourcesContent":["function Accordion() {\r\n const accordions = Array.from(document.querySelectorAll('.c-accordion__title'));\r\n accordions.forEach(setupAccordions);\r\n}\r\n\r\nfunction setupAccordions(title) {\r\n title.addEventListener('click', titleClick())\r\n}\r\n\r\nfunction titleClick() {\r\n return (event) => {\r\n console.log(event)\r\n var item = event.currentTarget.parentElement;\r\n console.log(item)\r\n item.classList.toggle('c-accordion__item--open');\r\n }\r\n}\r\n\r\nexport default Accordion;\r\n","function Carousel() {\r\n let current = 0;\r\n const bgSlides = document.querySelectorAll('.c-hero__image-bg');\r\n const fgSlides = document.querySelectorAll('.c-hero__image-fg');\r\n\r\n if(fgSlides.length > 0) {\r\n setInterval(() => {\r\n for (var bgSlide of bgSlides) {\r\n bgSlide.style.opacity = 0;\r\n }\r\n current = (current != bgSlides.length - 1) ? current + 1 : 0;\r\n bgSlides[current].style.opacity = 1;\r\n \r\n for (var fgSlide of fgSlides) {\r\n fgSlide.style.opacity = 0;\r\n }\r\n fgSlides[current].style.opacity = 1;\r\n }, 5000);\r\n }\r\n}\r\n\r\nexport default Carousel;","function ClearForm() {\r\n const formClear = document.getElementById('clearForm');\r\n if (formClear) {\r\n formClear.addEventListener('click', function () {\r\n const fields = this.closest('form').elements;\r\n fields.forEach(field => {\r\n if (field.value != '') {\r\n if (\r\n field.type.toLowerCase() == 'text' || \r\n field.type.toLowerCase() == 'email' || \r\n field.type.toLowerCase() == 'tel' || \r\n field.type.toLowerCase() == 'select-one' || \r\n field.type.toLowerCase() == 'textarea'\r\n ) {\r\n field.value = '';\r\n return;\r\n } else if (field.type.toLowerCase() == 'checkbox') {\r\n field.checked = false;\r\n return;\r\n }\r\n }\r\n });\r\n });\r\n };\r\n}\r\n\r\nexport default ClearForm;","function Comparison() {\r\n document.querySelectorAll('.c-comparison').forEach(extractMobileComparison)\r\n}\r\n\r\nfunction extractMobileComparison(container) {\r\n const body = container.querySelector('.c-table tbody');\r\n const head = container.querySelector('.c-table thead');\r\n const mobile = container.querySelector('.c-comparison__mobile');\r\n\r\n if (!body || !head || !mobile) return;\r\n\r\n // Remove empty corner piece\r\n const products = Array.from(head.children[0].children)\r\n .filter((x, i) => i)\r\n .map(x => ({ info: x.innerHTML, table: [] }));\r\n\r\n Array.from(body.children).forEach(row => {\r\n // For table row headers, push to all products\r\n if (row.classList.contains('c-table__title')) {\r\n products.forEach(x => {\r\n x.table.push({ type: 'title', title: row.children[0].textContent })\r\n })\r\n } else {\r\n // For all others, loop the cells and push to their appropriate parent\r\n const cells = Array.from(row.children);\r\n const firstCell = cells.shift();\r\n\r\n cells.forEach((el, index) => {\r\n products[index].table.push({\r\n type: 'row',\r\n key: firstCell.textContent,\r\n value: el.innerHTML\r\n })\r\n })\r\n }\r\n })\r\n\r\n products.forEach(product => {\r\n const el = createMobileProduct(product);\r\n mobile.appendChild(el)\r\n })\r\n}\r\n\r\nfunction createMobileProduct(product) {\r\n const parent = document.createElement('article');\r\n parent.innerHTML = `<div class=\"c-comparison__content\">\r\n ${product.info}\r\n </div>\r\n <table class=\"c-table\">\r\n ${product.table.map(x => {\r\n if (x.type === 'title') {\r\n return `<tr class=\"c-table__title\"><th colspan=\"2\">${x.title}</th></tr>`;\r\n } else {\r\n return `<tr>\r\n <td>${x.key}</td>\r\n <td>${x.value}</td>\r\n </tr>`;\r\n }\r\n }).join('')}\r\n </table>`;\r\n\r\n return parent;\r\n}\r\n\r\nexport default Comparison;\r\n","function Gallery() {\r\n const mainSlides = document.querySelectorAll('.c-gallery__main .c-gallery__slide');\r\n const thumbnailSlides = document.querySelectorAll('.c-gallery__thumbnails .c-gallery__slide');\r\n\r\n thumbnailSlides.forEach(thumbnailSlide => thumbnailSlide.addEventListener('click', function(e) {\r\n thumbnailSlides.forEach(function(thumbnail) {\r\n if(thumbnail != e.target.parentNode) {\r\n thumbnail.classList.remove('active');\r\n }\r\n });\r\n e.target.parentNode.classList.add('active');\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(mainSlide.dataset.slide == thumbnailSlide.dataset.slide) {\r\n mainSlide.classList.add('active');\r\n } else {\r\n mainSlide.classList.remove('active');\r\n }\r\n });\r\n }));\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(!mainSlide.classList.contains('c-gallery__video')) {\r\n mainSlide.addEventListener('click', lightboxTrigger);\r\n }\r\n });\r\n\r\n function lightboxTrigger() {\r\n const lightbox = document.querySelector('.c-gallery__main').cloneNode(true);\r\n lightbox.classList.remove('c-gallery__main');\r\n lightbox.classList.add('c-lightbox');\r\n lightbox.querySelectorAll('.c-gallery__slide').forEach(function(slide) {\r\n if(slide.classList.contains('c-gallery__video')) {\r\n slide.remove();\r\n }\r\n if(!slide.classList.contains('c-gallery__video')) {\r\n var slideImg = slide.querySelector('img');\r\n if(slideImg.srcset != '') {\r\n slideImg.removeAttribute('srcset');\r\n }\r\n }\r\n slide.classList.add('c-lightbox__slide');\r\n slide.classList.remove('c-gallery__slide');\r\n });\r\n document.body.appendChild(lightbox);\r\n lightbox.insertAdjacentHTML('beforeend', '<a class=\"c-lightbox__prev\"></a><a class=\"c-lightbox__next\"></a>');\r\n\r\n lightbox.querySelector('.c-lightbox__prev').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const prevImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) - 1) + '\"]');\r\n if(prevImage != null) {\r\n lightboxActive.classList.remove('active');\r\n prevImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.querySelector('.c-lightbox__next').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const nextImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) + 1) + '\"]');\r\n if(nextImage != null) {\r\n lightboxActive.classList.remove('active');\r\n nextImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.addEventListener('click', function(e) {\r\n if (e.target !== e.currentTarget) {\r\n return;\r\n } else {\r\n lightbox.remove();\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Gallery;\r\n","export function shuffle(array) {\r\n const arr = [...array];\r\n for (let i = arr.length - 1; i > 0; i--) {\r\n let j = Math.floor(Math.random() * (i + 1));\r\n [arr[i], arr[j]] = [arr[j], arr[i]];\r\n }\r\n\r\n return arr;\r\n}\r\n\r\nexport function userPrefersReducedMotion() {\r\n const QUERY = '(prefers-reduced-motion: no-preference)';\r\n const mediaQueryList = window.matchMedia(QUERY);\r\n const prefersReducedMotion = !mediaQueryList.matches;\r\n return prefersReducedMotion;\r\n}\r\n\r\nexport const debounce = (func, limit) => {\r\n let wait = false; \r\n return () => {\r\n if (wait) return;\r\n func();\r\n wait = true;\r\n setTimeout(() => wait = false, limit);\r\n }\r\n}\r\n\r\nexport const lerp = (x, y, a) => x * (1 - a) + y * a;\r\nexport const clamp = (a, min = 0, max = 1) => Math.min(max, Math.max(min, a));\r\nexport const invlerp = (x, y, a) => clamp((a - x) / (y - x));\r\nexport const range = (x1, y1, x2, y2, a) => lerp(x2, y2, invlerp(x1, y1, a));\r\n","import { range, shuffle, userPrefersReducedMotion } from './utilities';\r\n\r\nfunction HeroPattern() {\r\n let time = 0;\r\n\r\n const c = document.querySelector('.c-hero__canvas');\r\n if (!c) return;\r\n const ctx = c.getContext(\"2d\");\r\n \r\n const sineColour = \"rgb(19,170,19)\";\r\n const reduceMotion = userPrefersReducedMotion();\r\n\r\n const crossGap = 147;\r\n const minimumOpacity = 0;\r\n const maximumOpacity = 0.5;\r\n const crossSpeed = 0.25;\r\n\r\n let width;\r\n let height;\r\n let across;\r\n let down;\r\n let crosses = [];\r\n let totalPoints;\r\n\r\n function draw() {\r\n // Sine wave\r\n time = time + 0.005;\r\n \r\n ctx.clearRect(0, 0, c.width, c.height);\r\n ctx.beginPath();\r\n \r\n for(let cnt = c.width; cnt > 0; cnt--) {\r\n ctx.lineTo(cnt, c.height * 0.5 - (Math.cos(time + cnt / 5 * 0.03) * (height * 0.3) ));\r\n }\r\n \r\n ctx.lineWidth = 0.5;\r\n ctx.strokeStyle = sineColour;\r\n ctx.stroke();\r\n \r\n // Crosses\r\n crosses.forEach(cross => {\r\n drawCross(cross.x, cross.y, range(0, crosses.length, minimumOpacity, maximumOpacity, cross.counter));\r\n \r\n cross.counter += cross.direction;\r\n if (cross.counter >= crosses.length) cross.direction = -1 * crossSpeed;\r\n if (cross.counter < 0) cross.direction = crossSpeed;\r\n })\r\n \r\n if (!reduceMotion) {\r\n window.requestAnimationFrame(draw);\r\n }\r\n }\r\n \r\n function onResize() {\r\n width = c.scrollWidth;\r\n height = c.scrollHeight;\r\n \r\n ctx.canvas.width = width;\r\n ctx.canvas.height = height;\r\n \r\n across = Math.ceil(width / crossGap);\r\n down = Math.ceil(height / crossGap);\r\n \r\n totalPoints = (across + 1) * (down + 1);\r\n const ids = shuffle(Array.from({ length: totalPoints }, (_, i) => (i)))\r\n crosses = [];\r\n for(let x = 0; x <= across; x++) {\r\n for(let y = 0; y <= down; y++) {\r\n crosses.push({\r\n counter: ids.shift(),\r\n direction: Math.random() > 0.5 ? crossSpeed : -1 * crossSpeed,\r\n x: crossGap * (x + 1) - crossGap / 1,\r\n y: crossGap * (y + 1) - crossGap / 2\r\n });\r\n }\r\n }\r\n }\r\n \r\n function drawCross(x, y, opacity) {\r\n ctx.beginPath();\r\n ctx.moveTo(x - 14, y);\r\n ctx.lineTo(x + 14, y);\r\n ctx.strokeStyle = `rgba(255, 255, 255, ${opacity}`;\r\n ctx.moveTo(x, y - 14);\r\n ctx.lineTo(x, y + 14);\r\n ctx.stroke();\r\n }\r\n\r\n window.addEventListener('resize', onResize);\r\n onResize();\r\n draw();\r\n}\r\n\r\nexport default HeroPattern;\r\n","function HeroVideo() {\r\n document.addEventListener(\"DOMContentLoaded\", () => {\r\n const videoBackground = document.getElementById('videoBackground');\r\n if(typeof(videoBackground) != 'undefined' && videoBackground != null) {\r\n const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n if(!reducedMotion || reducedMotion.matches) {\r\n videoBackground.classList.add('u-hidden');\r\n }\r\n \r\n const lightboxTrigger = document.getElementById('playVideo');\r\n const lightboxContainer = document.getElementById('lightboxVideo');\r\n const lightboxVideo = lightboxContainer.querySelector('.c-lightbox__video');\r\n\r\n lightboxTrigger.addEventListener('click', e => {\r\n videoBackground.pause();\r\n lightboxContainer.classList.remove('u-hidden');\r\n checkVideos();\r\n });\r\n \r\n lightboxContainer.addEventListener('click', (e) => {\r\n if (!e.target.classList.contains('c-lightbox__video')) {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n window.addEventListener('keydown', function(e) {\r\n if (e.key == \"Escape\") {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n\r\n function checkVideos() {\r\n if(lightboxContainer.classList.contains('u-hidden')) {\r\n if (videoBackground.paused) {\r\n videoBackground.play();\r\n }\r\n if (!lightboxVideo.paused) {\r\n lightboxVideo.pause();\r\n }\r\n } else {\r\n if (!videoBackground.paused) {\r\n videoBackground.pause();\r\n }\r\n }\r\n }\r\n }\r\n });\r\n}\r\n\r\nexport default HeroVideo;","const ResponsiveTable = () => {\r\n const tables = Array.from(document.querySelectorAll('.c-table--responsive'));\r\n tables.forEach(createResponsiveTable);\r\n\r\n /**\r\n * Create responsive table headers for large tables\r\n * @param {HTMLTableElement} table\r\n */\r\n function createResponsiveTable(table) {\r\n const headers = table.querySelectorAll('thead > :first-child th');\r\n const breakPoint = Number(table.getAttribute('data-columns')) || 2\r\n \r\n if (headers.length < breakPoint) {\r\n table.classList.remove('c-table--responsive');\r\n return;\r\n };\r\n\r\n Array.from(table.querySelectorAll('tbody tr')).forEach((row) => {\r\n Array.from(headers)\r\n .map((x) => x.textContent)\r\n .forEach((header, index) => {\r\n if (row.children[index]) {\r\n row.children[index].setAttribute('data-responsive-title', header);\r\n }\r\n });\r\n });\r\n }\r\n};\r\n\r\nexport default ResponsiveTable;\r\n","import { debounce } from './utilities';\r\n\r\nfunction ScrollbarWidth() {\r\n setScrollbarWidth();\r\n window.addEventListener('resize', debounce(setScrollbarWidth, 250));\r\n}\r\n\r\nfunction setScrollbarWidth() {\r\n document.documentElement.style.setProperty(\r\n '--scrollbarWidth', \r\n window.innerWidth - document.body.clientWidth + 'px'\r\n );\r\n}\r\n\r\nexport default ScrollbarWidth;","function ScrollSpy() {\r\n const spies = Array.from(document.querySelectorAll('.c-scroll-spy'));\r\n spies.forEach(setup);\r\n}\r\n\r\nfunction setup(element) {\r\n const anchors = Array.from(element.querySelectorAll('a'));\r\n const observer = new IntersectionObserver(observation(anchors));\r\n \r\n anchors.forEach(anchor => {\r\n const id = anchor.getAttribute('href').replace('#', '');\r\n const target = document.getElementById(id);\r\n if (!target) return;\r\n\r\n observer.observe(target);\r\n });\r\n}\r\n\r\n/**\r\n * @param {Array<HTMLAnchorElement>} results \r\n * @return {Array<IntersectionObserverEntry>}\r\n */\r\nfunction observation(anchors) {\r\n return (results) => {\r\n const firstObservation = results.find(x => x.isIntersecting);\r\n\r\n if (firstObservation) {\r\n anchors.forEach(x => {\r\n x.classList.toggle(\r\n 'c-scroll-spy-active',\r\n x.getAttribute('href') === '#' + firstObservation.target.id\r\n )\r\n })\r\n }\r\n }\r\n}\r\n\r\nexport default ScrollSpy;\r\n","function Tabs() {\r\n const tabs = Array.from(document.querySelectorAll('.c-tabs--anchor'));\r\n tabs.forEach(setupTabs);\r\n}\r\n\r\nfunction setupTabs(parent) {\r\n const controls = Array.from(parent.querySelectorAll('.c-tabs__control'));\r\n const content = Array.from(parent.querySelectorAll('.c-tab'));\r\n const persist = parent.classList.contains('c-tabs--persist');\r\n \r\n if (!controls.length || !content.length) return;\r\n\r\n controls.forEach(control => {\r\n control.addEventListener('click', controlClick(controls, content, persist))\r\n })\r\n\r\n if (persist && window.location.hash) {\r\n const control = parent.querySelector('[href=\"' + window.location.hash + '\"]');\r\n if (control) control.dispatchEvent(new Event('click'));\r\n }\r\n}\r\n\r\nfunction controlClick(controls, contents, persist) {\r\n return (event) => {\r\n const control = event.currentTarget;\r\n const content = contents.find(x => x.id === control.getAttribute('href').replace('#', ''));\r\n \r\n if (!content) {\r\n return true;\r\n };\r\n\r\n event.preventDefault();\r\n \r\n if (persist) {\r\n history.pushState(null, null, control.getAttribute('href'));\r\n }\r\n\r\n controls.forEach(c => c.classList.toggle('c-tabs__control--active', c === control));\r\n contents.forEach(c => {\r\n const isCurrent = c === content;\r\n c.classList.toggle('c-tab--active', isCurrent);\r\n \r\n if (persist) return;\r\n\r\n if (isCurrent) {\r\n c.setAttribute('tabIndex', -1);\r\n \r\n const y = window.scrollY;\r\n c.focus();\r\n window.scrollTo({ behavior: \"auto\", top: y })\r\n } else {\r\n c.removeAttribute('tabIndex');\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Tabs;\r\n","import Accordion from './imports/accordion';\r\nimport Carousel from './imports/carousel';\r\nimport ClearForm from './imports/clear-form';\r\nimport Comparison from './imports/comparison';\r\nimport Gallery from './imports/gallery';\r\nimport HeroPattern from './imports/hero-pattern';\r\nimport HeroVideo from './imports/hero-video';\r\nimport ResponsiveTable from './imports/responsive-table';\r\nimport ScrollbarWidth from './imports/scrollbar-width';\r\nimport ScrollSpy from './imports/scroll-spy';\r\nimport Tabs from './imports/tabs';\r\n\r\n(() => {\r\n if(window.NodeList && !NodeList.prototype.forEach) {\r\n NodeList.prototype.forEach = Array.prototype.forEach;\r\n }\r\n if(window.HTMLCollection && !HTMLCollection.prototype.forEach) {\r\n HTMLCollection.prototype.forEach = Array.prototype.forEach;\r\n }\r\n \r\n Accordion();\r\n Carousel();\r\n ClearForm();\r\n Comparison();\r\n Gallery();\r\n HeroPattern();\r\n HeroVideo();\r\n ResponsiveTable();\r\n ScrollbarWidth();\r\n ScrollSpy();\r\n Tabs();\r\n})();"],"names":["$c274619fa9ae66ac$var$setupAccordions","title","addEventListener","event","console","log","item","currentTarget","parentElement","classList","toggle","$c274619fa9ae66ac$export$2e2bcd8739ae039","Array","from","document","querySelectorAll","forEach","$5bdce36a18199573$export$2e2bcd8739ae039","current","bgSlides","fgSlides","length","setInterval","bgSlide","style","opacity","fgSlide","$2b04c6f63ef290fb$export$2e2bcd8739ae039","formClear","getElementById","this","closest","elements","field","value","type","toLowerCase","checked","$7fbc59e2fab6d5d2$var$extractMobileComparison","container","body","querySelector","head","mobile","products","children","filter","x","i","map","info","innerHTML","table","row","contains","push","textContent","cells","firstCell","shift","el","index","key","product","parent","createElement","join","$7fbc59e2fab6d5d2$var$createMobileProduct","appendChild","$7fbc59e2fab6d5d2$export$2e2bcd8739ae039","$dfe0031b837edf6f$export$2e2bcd8739ae039","mainSlides","thumbnailSlides","lightboxTrigger","lightbox","cloneNode","remove","add","slide","slideImg","srcset","removeAttribute","insertAdjacentHTML","lightboxActive","prevImage","parseInt","dataset","nextImage","e","target","thumbnailSlide","thumbnail","parentNode","mainSlide","$41a3994d4318effb$export$b568019c0551f0a4","y","a","min","max","Math","$41a3994d4318effb$export$7d15b64cf5a3a4c4","$2e27ca8f14f20195$export$2e2bcd8739ae039","time","c","ctx","getContext","reduceMotion","window","matchMedia","matches","crossGap","crossSpeed","width","height","across","down","totalPoints","crosses","onResize","scrollWidth","scrollHeight","canvas","ceil","ids","array","arr","j","floor","random","$41a3994d4318effb$export$448332262467e042","_","counter","direction","draw","clearRect","beginPath","cnt","lineTo","cos","lineWidth","strokeStyle","stroke","cross","x1","y1","x2","y2","$41a3994d4318effb$export$3a89f8d6f6bf6c9f","moveTo","requestAnimationFrame","$63fd9338c6a56d33$export$2e2bcd8739ae039","videoBackground","reducedMotion","lightboxContainer","lightboxVideo","checkVideos","paused","play","pause","setAttribute","headers","breakPoint","Number","getAttribute","header","$e3dc92a106d80d6c$var$setScrollbarWidth","documentElement","setProperty","innerWidth","clientWidth","$e3dc92a106d80d6c$export$2e2bcd8739ae039","func","limit","wait","setTimeout","$41a3994d4318effb$export$61fc7d43ac8f84b0","$9d1dec2ad218c628$var$setup","element","anchors","observer","IntersectionObserver","results","firstObservation","find","isIntersecting","id","$9d1dec2ad218c628$var$observation","anchor","replace","observe","$1d2dabc452d8efd6$var$setupTabs","controls","content","persist","control","contents","preventDefault","history","pushState","isCurrent","scrollY","focus","scrollTo","behavior","top","$1d2dabc452d8efd6$var$controlClick","location","hash","dispatchEvent","Event","$1d2dabc452d8efd6$export$2e2bcd8739ae039","NodeList","prototype","HTMLCollection","$384feef4bde84172$export$2e2bcd8739ae039","$9d1dec2ad218c628$export$2e2bcd8739ae039"],"version":3,"file":"app.js.map"}
|
1
|
+
{"mappings":"MAKA,SAASA,EAAgBC,GACrBA,EAAMC,iBAAiB,SAIfC,IACOA,EAAMC,cAAcC,cAC1BC,UAAUC,OAAO,kCAI9BC,EAhBA,WACuBC,MAAMC,KAAKC,SAASC,iBAAiB,wBAC7CC,QAAQb,QCmBvBc,EArBA,WACE,IAAIC,EAAU,EACd,MAAMC,EAAWL,SAASC,iBAAiB,qBACrCK,EAAWN,SAASC,iBAAiB,qBAExCK,EAASC,OAAS,GACnBC,aAAY,KACV,IAAK,IAAIC,KAAWJ,EAClBI,EAAQC,MAAMC,QAAU,EAK1B,IAAK,IAAIC,KAHTR,EAAWA,GAAWC,EAASE,OAAS,EAAKH,EAAU,EAAI,EAC3DC,EAASD,GAASM,MAAMC,QAAU,EAEdL,GAClBM,EAAQF,MAAMC,QAAU,EAE1BL,EAASF,GAASM,MAAMC,QAAU,IACjC,UCSPE,EA1BA,WACE,MAAMC,EAAYd,SAASe,eAAe,aACtCD,GACFA,EAAUvB,iBAAiB,SAAS,WACnByB,KAAKC,QAAQ,QAAQC,SAC7BhB,SAAQiB,IACb,GAAmB,IAAfA,EAAMC,MAAa,CACrB,GAC8B,QAA5BD,EAAME,KAAKC,eACiB,SAA5BH,EAAME,KAAKC,eACiB,OAA5BH,EAAME,KAAKC,eACiB,cAA5BH,EAAME,KAAKC,eACiB,YAA5BH,EAAME,KAAKC,cAGX,YADAH,EAAMC,MAAQ,IAET,GAAgC,YAA5BD,EAAME,KAAKC,cAEpB,YADAH,EAAMI,SAAU,WCb5B,SAASC,EAAwBC,GAC/B,MAAMC,EAAOD,EAAUE,cAAc,kBAC/BC,EAAOH,EAAUE,cAAc,kBAC/BE,EAASJ,EAAUE,cAAc,yBAEvC,IAAKD,IAASE,IAASC,EAAQ,OAG/B,MAAMC,EAAWhC,MAAMC,KAAK6B,EAAKG,SAAS,GAAGA,UAC1CC,QAAO,CAACC,EAAGC,IAAMA,IACjBC,KAAIF,IAAM,CAAEG,KAAMH,EAAEI,UAAWC,MAAO,OAEzCxC,MAAMC,KAAK2B,EAAKK,UAAU7B,SAAQqC,IAEhC,GAAIA,EAAI5C,UAAU6C,SAAS,kBACzBV,EAAS5B,SAAQ+B,IACfA,EAAEK,MAAMG,KAAK,CAAEpB,KAAM,QAAS/B,MAAOiD,EAAIR,SAAS,GAAGW,qBAElD,CAEL,MAAMC,EAAQ7C,MAAMC,KAAKwC,EAAIR,UACvBa,EAAYD,EAAME,QAExBF,EAAMzC,SAAQ,CAAC4C,EAAIC,KACjBjB,EAASiB,GAAOT,MAAMG,KAAK,CACzBpB,KAAM,MACN2B,IAAKJ,EAAUF,YACftB,MAAO0B,EAAGT,mBAMlBP,EAAS5B,SAAQ+C,IACf,MAAMH,EAKV,SAA6BG,GAC3B,MAAMC,EAASlD,SAASmD,cAAc,WAiBtC,OAhBAD,EAAOb,UAAY,4CACfY,EAAQb,kDAGRa,EAAQX,MAAMH,KAAIF,GACH,UAAXA,EAAEZ,KACG,8CAA8CY,EAAE3C,kBAEhD,uBACC2C,EAAEe,2BACFf,EAAEb,8BAGXgC,KAAK,kBAGHF,EAvBMG,CAAoBJ,GAC/BpB,EAAOyB,YAAYR,UAyBvBS,EAhEA,WACEvD,SAASC,iBAAiB,iBAAiBC,QAAQsB,QC0ErDgC,EA3EA,WACE,MAAMC,EAAazD,SAASC,iBAAiB,sCACvCyD,EAAkB1D,SAASC,iBAAiB,4CAyBlD,SAAS0D,IACP,MAAMC,EAAW5D,SAAS2B,cAAc,oBAAoBkC,WAAU,GACtED,EAASjE,UAAUmE,OAAO,mBAC1BF,EAASjE,UAAUoE,IAAI,cACvBH,EAAS3D,iBAAiB,qBAAqBC,SAAQ,SAAS8D,GAI9D,GAHGA,EAAMrE,UAAU6C,SAAS,qBAC1BwB,EAAMF,UAEJE,EAAMrE,UAAU6C,SAAS,oBAAqB,CAChD,IAAIyB,EAAWD,EAAMrC,cAAc,OACb,IAAnBsC,EAASC,QACVD,EAASE,gBAAgB,UAG7BH,EAAMrE,UAAUoE,IAAI,qBACpBC,EAAMrE,UAAUmE,OAAO,uBAEzB9D,SAAS0B,KAAK4B,YAAYM,GAC1BA,EAASQ,mBAAmB,YAAa,oEAEzCR,EAASjC,cAAc,qBAAqBpC,iBAAiB,SAAS,WACpE,MAAM8E,EAAiBT,EAASjC,cAAc,WACxC2C,EAAYV,EAASjC,cAAc,iBAAmB4C,SAASF,EAAeG,QAAQR,OAAS,GAAK,MAC1F,MAAbM,IACDD,EAAe1E,UAAUmE,OAAO,UAChCQ,EAAU3E,UAAUoE,IAAI,cAI5BH,EAASjC,cAAc,qBAAqBpC,iBAAiB,SAAS,WACpE,MAAM8E,EAAiBT,EAASjC,cAAc,WACxC8C,EAAYb,EAASjC,cAAc,iBAAmB4C,SAASF,EAAeG,QAAQR,OAAS,GAAK,MAC1F,MAAbS,IACDJ,EAAe1E,UAAUmE,OAAO,UAChCW,EAAU9E,UAAUoE,IAAI,cAI5BH,EAASrE,iBAAiB,SAAS,SAASmF,GACtCA,EAAEC,SAAWD,EAAEjF,eAGjBmE,EAASE,YAjEfJ,EAAgBxD,SAAQ0E,GAAkBA,EAAerF,iBAAiB,SAAS,SAASmF,GAC1FhB,EAAgBxD,SAAQ,SAAS2E,GAC5BA,GAAaH,EAAEC,OAAOG,YACvBD,EAAUlF,UAAUmE,OAAO,aAG/BY,EAAEC,OAAOG,WAAWnF,UAAUoE,IAAI,UAElCN,EAAWvD,SAAQ,SAAS6E,GACvBA,EAAUP,QAAQR,OAASY,EAAeJ,QAAQR,MACnDe,EAAUpF,UAAUoE,IAAI,UAExBgB,EAAUpF,UAAUmE,OAAO,kBAKjCL,EAAWvD,SAAQ,SAAS6E,GACtBA,EAAUpF,UAAU6C,SAAS,qBAC/BuC,EAAUxF,iBAAiB,QAASoE,OCNnC,MAYMqB,EAAU,CAAC/C,EAAGgD,EAAGC,IADT,EAACA,EAAGC,EAAM,EAAGC,EAAM,IAAMC,KAAKF,IAAIC,EAAKC,KAAKD,IAAID,EAAKD,IACtCI,EAAOJ,EAAIjD,IAAMgD,EAAIhD,QCgEzDsD,EA3FA,WACE,IAAIC,EAAO,EAEX,MAAMC,EAAIzF,SAAS2B,cAAc,mBACjC,IAAK8D,EAAG,OACR,MAAMC,EAAMD,EAAEE,WAAW,MAGnBC,GDEiBC,OAAOC,WADhB,2CAE+BC,QCDvCC,EAAW,IAGXC,EAAa,IAEnB,IAAIC,EACAC,EACAC,EACAC,EAEAC,EADAC,EAAU,GAgCd,SAASC,IACPN,EAAQT,EAAEgB,YACVN,EAASV,EAAEiB,aAEXhB,EAAIiB,OAAOT,MAASA,EACpBR,EAAIiB,OAAOR,OAASA,EAEpBC,EAASf,KAAKuB,KAAKV,EAAQF,GAC3BK,EAAOhB,KAAKuB,KAAKT,EAASH,GAE1BM,GAAeF,EAAS,IAAMC,EAAO,GACrC,MAAMQ,EDhEH,SAAiBC,GACtB,MAAMC,EAAM,IAAID,GAChB,IAAK,IAAI5E,EAAI6E,EAAIxG,OAAS,EAAG2B,EAAI,EAAGA,IAAK,CACvC,IAAI8E,EAAI3B,KAAK4B,MAAM5B,KAAK6B,UAAYhF,EAAI,KACvC6E,EAAI7E,GAAI6E,EAAIC,IAAM,CAACD,EAAIC,GAAID,EAAI7E,IAGlC,OAAO6E,ECyDOI,CAAQrH,MAAMC,KAAK,CAAEQ,OAAQ+F,IAAe,CAACc,EAAGlF,IAAOA,KACnEqE,EAAU,GACV,IAAI,IAAItE,EAAI,EAAGA,GAAKmE,EAAQnE,IAC1B,IAAI,IAAIgD,EAAI,EAAGA,GAAKoB,EAAMpB,IACxBsB,EAAQ9D,KAAK,CACX4E,QAASR,EAAIhE,QACbyE,UAAWjC,KAAK6B,SAAW,GAAMjB,GAAa,IAC9ChE,EAAG+D,GAAY/D,EAAI,GAAK+D,IACxBf,EAAGe,GAAYf,EAAI,GAAKe,OAgBhCH,OAAOtG,iBAAiB,SAAUiH,GAClCA,IAjEA,SAASe,IAEP/B,GAAc,KAEdE,EAAI8B,UAAU,EAAG,EAAG/B,EAAES,MAAOT,EAAEU,QAC/BT,EAAI+B,YAEJ,IAAI,IAAIC,EAAMjC,EAAES,MAAOwB,EAAM,EAAGA,IAC9BhC,EAAIiC,OAAOD,EAAgB,GAAXjC,EAAEU,OAAgBd,KAAKuC,IAAIpC,EAAOkC,EAAM,EAAI,MAAkB,GAATvB,IAGvET,EAAImC,UAAY,GAChBnC,EAAIoC,YA3Ba,iBA4BjBpC,EAAIqC,SAGJxB,EAAQrG,SAAQ8H,IAsClB,IAAmB/F,EAAGgD,EAAGtE,EDhDLsH,EAAIC,EAAIC,EAAIC,EAAIlD,ECgDjBjD,EArCL+F,EAAM/F,EAqCEgD,EArCC+C,EAAM/C,EDXTgD,ECWkB,EDXdC,ECWiB3B,EAAQhG,ODXrB4H,ECjBL,EDiBSC,EChBT,GDgBalD,ECWqD8C,EAAMX,QAqCtE1G,EDnDP,EAACsB,EAAGgD,EAAGC,IAAMjD,GAAK,EAAIiD,GAAKD,EAAIC,EAGPmD,CAAKF,EAAIC,EAAIpD,EAAQiD,EAAIC,EAAIhD,ICiDrEQ,EAAI+B,YACJ/B,EAAI4C,OAAOrG,EAAI,GAAIgD,GACnBS,EAAIiC,OAAO1F,EAAI,GAAIgD,GACnBS,EAAIoC,YAAc,uBAAuBnH,IACzC+E,EAAI4C,OAAOrG,EAAGgD,EAAI,IAClBS,EAAIiC,OAAO1F,EAAGgD,EAAI,IAClBS,EAAIqC,SA1CFC,EAAMX,SAAWW,EAAMV,UACnBU,EAAMX,SAAWd,EAAQhG,SAAQyH,EAAMV,WAAY,KACnDU,EAAMX,QAAU,IAAGW,EAAMV,UAAYrB,MAGtCL,GACHC,OAAO0C,sBAAsBhB,GAyCjCA,QCtCFiB,EApDA,WACExI,SAAST,iBAAiB,oBAAoB,KAC5C,MAAMkJ,EAAkBzI,SAASe,eAAe,mBAChD,QAA8B,IAApB0H,GAAsD,MAAnBA,EAAyB,CACpE,MAAMC,EAAgB7C,OAAOC,WAAW,oCACpC4C,IAAiBA,EAAc3C,SACjC0C,EAAgB9I,UAAUoE,IAAI,YAGhC,MAAMJ,EAAkB3D,SAASe,eAAe,aAC1C4H,EAAoB3I,SAASe,eAAe,iBAC5C6H,EAAgBD,EAAkBhH,cAAc,sBAuBtD,SAASkH,IACJF,EAAkBhJ,UAAU6C,SAAS,aAClCiG,EAAgBK,QAClBL,EAAgBM,OAEbH,EAAcE,QACjBF,EAAcI,SAGXP,EAAgBK,QACnBL,EAAgBO,QA/BtBrF,EAAgBpE,iBAAiB,SAASmF,IACxC+D,EAAgBO,QAChBL,EAAkBhJ,UAAUmE,OAAO,YACnC+E,OAGFF,EAAkBpJ,iBAAiB,SAAUmF,IACtCA,EAAEC,OAAOhF,UAAU6C,SAAS,uBAC/BiG,EAAgBQ,aAAa,WAAW,IACxCN,EAAkBhJ,UAAUoE,IAAI,YAChC8E,QAGJhD,OAAOtG,iBAAiB,WAAW,SAASmF,GAC7B,UAATA,EAAE1B,MACJyF,EAAgBQ,aAAa,WAAW,IACxCN,EAAkBhJ,UAAUoE,IAAI,YAChC8E,mBC9Bc,KACP/I,MAAMC,KAAKC,SAASC,iBAAiB,yBAC7CC,kBAUgBoC,SACnB4G,EAAM5G,EAAUrC,iBAAO,2BACvBkJ,EAAOC,OAAA9G,EAAA+G,aAAA,kBAAA,KACRH,EAAA3I,OAAA4I,EAGC,YADF7G,EAAU3C,UAAOmE,OAAA,kCAIXxB,EAAQrC,iBACN,aAAaC,SAAOqC,UAErBxC,KAAAmJ,GAAA/G,KAAAF,GAAAA,EAAAS,cACJxC,SAAA,CAAAoJ,EAAAvG,KACJR,EAAAR,SAAAgB,IAAAR,EAAAR,SAAAgB,GAAAkG,aAAA,wBAAAK,aCnBH,SAASC,IACLvJ,SAASwJ,gBAAgB9I,MAAM+I,YAC3B,mBACA5D,OAAO6D,WAAa1J,SAAS0B,KAAKiI,YAAc,UAIxDC,EAZA,WACIL,IACA1D,OAAOtG,iBAAiB,SJaJ,EAACsK,EAAMC,KAC7B,IAAIC,GAAO,EACX,MAAO,KACCA,IACJF,IACAE,GAAO,EACPC,YAAW,IAAMD,GAAO,GAAOD,MInBCG,CAASV,EAAmB,OCClE,SAASW,EAAMC,GACb,MAAMC,EAAUtK,MAAMC,KAAKoK,EAAQlK,iBAAiB,MAC9CoK,EAAW,IAAIC,8BAiB0CF,UAEzDG,UAEEC,EACAD,EAAAE,MAAAxI,GAAAA,EAAqByI,iBAK5BF,GAAAJ,EAAAlK,SAAA+B,IACFA,EAAAtC,UAAAC,OAAA,sBAAAqC,EAAAoH,aAAA,UAAA,IAAAmB,EAAA7F,OAAAgG,QA5B2CC,CAAYR,IAEtDA,EAAQlK,SAAQ2K,IACd,MAAMF,EAAKE,EAAOxB,aAAa,QAAQyB,QAAQ,IAAK,IAC9CnG,EAAS3E,SAASe,eAAe4J,GAClChG,GAEL0F,EAASU,QAAQpG,YAdrB,WACgB7E,MAAMC,KAAKC,SAASC,iBAAiB,kBAC7CC,QAAQgK,ICGhB,SAASc,EAAU9H,GACjB,MAAM+H,EAAWnL,MAAMC,KAAKmD,EAAOjD,iBAAiB,qBAC9CiL,EAAUpL,MAAMC,KAAKmD,EAAOjD,iBAAiB,WAC7CkL,EAAUjI,EAAOvD,UAAU6C,SAAS,mBAE1C,GAAKyI,EAAS1K,QAAW2K,EAAQ3K,SAEjC0K,EAAS/K,SAAQkL,IACfA,EAAQ7L,iBAAiB,QAS7B,SAAsB0L,EAAUI,EAAUF,GACxC,OAAQ3L,IACN,MAAM4L,EAAU5L,EAAMC,cAChByL,EAAUG,EAASZ,MAAKxI,GAAKA,EAAE0I,KAAOS,EAAQ/B,aAAa,QAAQyB,QAAQ,IAAK,MAEtF,IAAKI,EACH,OAAO,EAGT1L,EAAM8L,iBAEFH,GACFI,QAAQC,UAAU,KAAM,KAAMJ,EAAQ/B,aAAa,SAGrD4B,EAAS/K,SAAQuF,GAAKA,EAAE9F,UAAUC,OAAO,0BAA2B6F,IAAM2F,KAC1EC,EAASnL,SAAQuF,IACf,MAAMgG,EAAYhG,IAAMyF,EAGxB,GAFAzF,EAAE9F,UAAUC,OAAO,gBAAiB6L,IAEhCN,EAEJ,GAAIM,EAAW,CACbhG,EAAEwD,aAAa,YAAY,GAE3B,MAAMhE,EAAIY,OAAO6F,QACjBjG,EAAEkG,QACF9F,OAAO+F,SAAS,CAAEC,SAAU,OAAQC,IAAK7G,SAEzCQ,EAAEtB,gBAAgB,gBAtCY4H,CAAad,EAAUC,EAASC,OAGhEA,GAAWtF,OAAOmG,SAASC,MAAM,CACnC,MAAMb,EAAUlI,EAAOvB,cAAc,UAAYkE,OAAOmG,SAASC,KAAO,MACpEb,GAASA,EAAQc,cAAc,IAAIC,MAAM,eAuCjDC,EAzDA,WACetM,MAAMC,KAAKC,SAASC,iBAAiB,oBAC7CC,QAAQ8K,ICWVnF,OAAOwG,WAAaA,SAASC,UAAUpM,UACxCmM,SAASC,UAAUpM,QAAUJ,MAAMwM,UAAUpM,SAE5C2F,OAAO0G,iBAAmBA,eAAeD,UAAUpM,UACpDqM,eAAeD,UAAUpM,QAAUJ,MAAMwM,UAAUpM,SAGrDL,IACAM,IACAU,IACA0C,IACAC,IACA+B,IACAiD,IACAgE,IACA5C,IACA6C,IACAL","sources":["src/assets/js/imports/accordion.js","src/assets/js/imports/carousel.js","src/assets/js/imports/clear-form.js","src/assets/js/imports/comparison.js","src/assets/js/imports/gallery.js","src/assets/js/imports/utilities.js","src/assets/js/imports/hero-pattern.js","src/assets/js/imports/hero-video.js","src/assets/js/imports/responsive-table.js","src/assets/js/imports/scrollbar-width.js","src/assets/js/imports/scroll-spy.js","src/assets/js/imports/tabs.js","src/assets/js/app.js"],"sourcesContent":["function Accordion() {\r\n const accordions = Array.from(document.querySelectorAll('.c-accordion__title'));\r\n accordions.forEach(setupAccordions);\r\n}\r\n\r\nfunction setupAccordions(title) {\r\n title.addEventListener('click', titleClick())\r\n}\r\n\r\nfunction titleClick() {\r\n return (event) => {\r\n var item = event.currentTarget.parentElement;\r\n item.classList.toggle('c-accordion__item--open');\r\n }\r\n}\r\n\r\nexport default Accordion;\r\n","function Carousel() {\r\n let current = 0;\r\n const bgSlides = document.querySelectorAll('.c-hero__image-bg');\r\n const fgSlides = document.querySelectorAll('.c-hero__image-fg');\r\n\r\n if(fgSlides.length > 0) {\r\n setInterval(() => {\r\n for (var bgSlide of bgSlides) {\r\n bgSlide.style.opacity = 0;\r\n }\r\n current = (current != bgSlides.length - 1) ? current + 1 : 0;\r\n bgSlides[current].style.opacity = 1;\r\n \r\n for (var fgSlide of fgSlides) {\r\n fgSlide.style.opacity = 0;\r\n }\r\n fgSlides[current].style.opacity = 1;\r\n }, 5000);\r\n }\r\n}\r\n\r\nexport default Carousel;","function ClearForm() {\r\n const formClear = document.getElementById('clearForm');\r\n if (formClear) {\r\n formClear.addEventListener('click', function () {\r\n const fields = this.closest('form').elements;\r\n fields.forEach(field => {\r\n if (field.value != '') {\r\n if (\r\n field.type.toLowerCase() == 'text' || \r\n field.type.toLowerCase() == 'email' || \r\n field.type.toLowerCase() == 'tel' || \r\n field.type.toLowerCase() == 'select-one' || \r\n field.type.toLowerCase() == 'textarea'\r\n ) {\r\n field.value = '';\r\n return;\r\n } else if (field.type.toLowerCase() == 'checkbox') {\r\n field.checked = false;\r\n return;\r\n }\r\n }\r\n });\r\n });\r\n };\r\n}\r\n\r\nexport default ClearForm;","function Comparison() {\r\n document.querySelectorAll('.c-comparison').forEach(extractMobileComparison)\r\n}\r\n\r\nfunction extractMobileComparison(container) {\r\n const body = container.querySelector('.c-table tbody');\r\n const head = container.querySelector('.c-table thead');\r\n const mobile = container.querySelector('.c-comparison__mobile');\r\n\r\n if (!body || !head || !mobile) return;\r\n\r\n // Remove empty corner piece\r\n const products = Array.from(head.children[0].children)\r\n .filter((x, i) => i)\r\n .map(x => ({ info: x.innerHTML, table: [] }));\r\n\r\n Array.from(body.children).forEach(row => {\r\n // For table row headers, push to all products\r\n if (row.classList.contains('c-table__title')) {\r\n products.forEach(x => {\r\n x.table.push({ type: 'title', title: row.children[0].textContent })\r\n })\r\n } else {\r\n // For all others, loop the cells and push to their appropriate parent\r\n const cells = Array.from(row.children);\r\n const firstCell = cells.shift();\r\n\r\n cells.forEach((el, index) => {\r\n products[index].table.push({\r\n type: 'row',\r\n key: firstCell.textContent,\r\n value: el.innerHTML\r\n })\r\n })\r\n }\r\n })\r\n\r\n products.forEach(product => {\r\n const el = createMobileProduct(product);\r\n mobile.appendChild(el)\r\n })\r\n}\r\n\r\nfunction createMobileProduct(product) {\r\n const parent = document.createElement('article');\r\n parent.innerHTML = `<div class=\"c-comparison__content\">\r\n ${product.info}\r\n </div>\r\n <table class=\"c-table\">\r\n ${product.table.map(x => {\r\n if (x.type === 'title') {\r\n return `<tr class=\"c-table__title\"><th colspan=\"2\">${x.title}</th></tr>`;\r\n } else {\r\n return `<tr>\r\n <td>${x.key}</td>\r\n <td>${x.value}</td>\r\n </tr>`;\r\n }\r\n }).join('')}\r\n </table>`;\r\n\r\n return parent;\r\n}\r\n\r\nexport default Comparison;\r\n","function Gallery() {\r\n const mainSlides = document.querySelectorAll('.c-gallery__main .c-gallery__slide');\r\n const thumbnailSlides = document.querySelectorAll('.c-gallery__thumbnails .c-gallery__slide');\r\n\r\n thumbnailSlides.forEach(thumbnailSlide => thumbnailSlide.addEventListener('click', function(e) {\r\n thumbnailSlides.forEach(function(thumbnail) {\r\n if(thumbnail != e.target.parentNode) {\r\n thumbnail.classList.remove('active');\r\n }\r\n });\r\n e.target.parentNode.classList.add('active');\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(mainSlide.dataset.slide == thumbnailSlide.dataset.slide) {\r\n mainSlide.classList.add('active');\r\n } else {\r\n mainSlide.classList.remove('active');\r\n }\r\n });\r\n }));\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(!mainSlide.classList.contains('c-gallery__video')) {\r\n mainSlide.addEventListener('click', lightboxTrigger);\r\n }\r\n });\r\n\r\n function lightboxTrigger() {\r\n const lightbox = document.querySelector('.c-gallery__main').cloneNode(true);\r\n lightbox.classList.remove('c-gallery__main');\r\n lightbox.classList.add('c-lightbox');\r\n lightbox.querySelectorAll('.c-gallery__slide').forEach(function(slide) {\r\n if(slide.classList.contains('c-gallery__video')) {\r\n slide.remove();\r\n }\r\n if(!slide.classList.contains('c-gallery__video')) {\r\n var slideImg = slide.querySelector('img');\r\n if(slideImg.srcset != '') {\r\n slideImg.removeAttribute('srcset');\r\n }\r\n }\r\n slide.classList.add('c-lightbox__slide');\r\n slide.classList.remove('c-gallery__slide');\r\n });\r\n document.body.appendChild(lightbox);\r\n lightbox.insertAdjacentHTML('beforeend', '<a class=\"c-lightbox__prev\"></a><a class=\"c-lightbox__next\"></a>');\r\n\r\n lightbox.querySelector('.c-lightbox__prev').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const prevImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) - 1) + '\"]');\r\n if(prevImage != null) {\r\n lightboxActive.classList.remove('active');\r\n prevImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.querySelector('.c-lightbox__next').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const nextImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) + 1) + '\"]');\r\n if(nextImage != null) {\r\n lightboxActive.classList.remove('active');\r\n nextImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.addEventListener('click', function(e) {\r\n if (e.target !== e.currentTarget) {\r\n return;\r\n } else {\r\n lightbox.remove();\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Gallery;\r\n","export function shuffle(array) {\r\n const arr = [...array];\r\n for (let i = arr.length - 1; i > 0; i--) {\r\n let j = Math.floor(Math.random() * (i + 1));\r\n [arr[i], arr[j]] = [arr[j], arr[i]];\r\n }\r\n\r\n return arr;\r\n}\r\n\r\nexport function userPrefersReducedMotion() {\r\n const QUERY = '(prefers-reduced-motion: no-preference)';\r\n const mediaQueryList = window.matchMedia(QUERY);\r\n const prefersReducedMotion = !mediaQueryList.matches;\r\n return prefersReducedMotion;\r\n}\r\n\r\nexport const debounce = (func, limit) => {\r\n let wait = false; \r\n return () => {\r\n if (wait) return;\r\n func();\r\n wait = true;\r\n setTimeout(() => wait = false, limit);\r\n }\r\n}\r\n\r\nexport const lerp = (x, y, a) => x * (1 - a) + y * a;\r\nexport const clamp = (a, min = 0, max = 1) => Math.min(max, Math.max(min, a));\r\nexport const invlerp = (x, y, a) => clamp((a - x) / (y - x));\r\nexport const range = (x1, y1, x2, y2, a) => lerp(x2, y2, invlerp(x1, y1, a));\r\n","import { range, shuffle, userPrefersReducedMotion } from './utilities';\r\n\r\nfunction HeroPattern() {\r\n let time = 0;\r\n\r\n const c = document.querySelector('.c-hero__canvas');\r\n if (!c) return;\r\n const ctx = c.getContext(\"2d\");\r\n \r\n const sineColour = \"rgb(19,170,19)\";\r\n const reduceMotion = userPrefersReducedMotion();\r\n\r\n const crossGap = 147;\r\n const minimumOpacity = 0;\r\n const maximumOpacity = 0.5;\r\n const crossSpeed = 0.25;\r\n\r\n let width;\r\n let height;\r\n let across;\r\n let down;\r\n let crosses = [];\r\n let totalPoints;\r\n\r\n function draw() {\r\n // Sine wave\r\n time = time + 0.005;\r\n \r\n ctx.clearRect(0, 0, c.width, c.height);\r\n ctx.beginPath();\r\n \r\n for(let cnt = c.width; cnt > 0; cnt--) {\r\n ctx.lineTo(cnt, c.height * 0.5 - (Math.cos(time + cnt / 5 * 0.03) * (height * 0.3) ));\r\n }\r\n \r\n ctx.lineWidth = 0.5;\r\n ctx.strokeStyle = sineColour;\r\n ctx.stroke();\r\n \r\n // Crosses\r\n crosses.forEach(cross => {\r\n drawCross(cross.x, cross.y, range(0, crosses.length, minimumOpacity, maximumOpacity, cross.counter));\r\n \r\n cross.counter += cross.direction;\r\n if (cross.counter >= crosses.length) cross.direction = -1 * crossSpeed;\r\n if (cross.counter < 0) cross.direction = crossSpeed;\r\n })\r\n \r\n if (!reduceMotion) {\r\n window.requestAnimationFrame(draw);\r\n }\r\n }\r\n \r\n function onResize() {\r\n width = c.scrollWidth;\r\n height = c.scrollHeight;\r\n \r\n ctx.canvas.width = width;\r\n ctx.canvas.height = height;\r\n \r\n across = Math.ceil(width / crossGap);\r\n down = Math.ceil(height / crossGap);\r\n \r\n totalPoints = (across + 1) * (down + 1);\r\n const ids = shuffle(Array.from({ length: totalPoints }, (_, i) => (i)))\r\n crosses = [];\r\n for(let x = 0; x <= across; x++) {\r\n for(let y = 0; y <= down; y++) {\r\n crosses.push({\r\n counter: ids.shift(),\r\n direction: Math.random() > 0.5 ? crossSpeed : -1 * crossSpeed,\r\n x: crossGap * (x + 1) - crossGap / 1,\r\n y: crossGap * (y + 1) - crossGap / 2\r\n });\r\n }\r\n }\r\n }\r\n \r\n function drawCross(x, y, opacity) {\r\n ctx.beginPath();\r\n ctx.moveTo(x - 14, y);\r\n ctx.lineTo(x + 14, y);\r\n ctx.strokeStyle = `rgba(255, 255, 255, ${opacity}`;\r\n ctx.moveTo(x, y - 14);\r\n ctx.lineTo(x, y + 14);\r\n ctx.stroke();\r\n }\r\n\r\n window.addEventListener('resize', onResize);\r\n onResize();\r\n draw();\r\n}\r\n\r\nexport default HeroPattern;\r\n","function HeroVideo() {\r\n document.addEventListener(\"DOMContentLoaded\", () => {\r\n const videoBackground = document.getElementById('videoBackground');\r\n if(typeof(videoBackground) != 'undefined' && videoBackground != null) {\r\n const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n if(!reducedMotion || reducedMotion.matches) {\r\n videoBackground.classList.add('u-hidden');\r\n }\r\n \r\n const lightboxTrigger = document.getElementById('playVideo');\r\n const lightboxContainer = document.getElementById('lightboxVideo');\r\n const lightboxVideo = lightboxContainer.querySelector('.c-lightbox__video');\r\n\r\n lightboxTrigger.addEventListener('click', e => {\r\n videoBackground.pause();\r\n lightboxContainer.classList.remove('u-hidden');\r\n checkVideos();\r\n });\r\n \r\n lightboxContainer.addEventListener('click', (e) => {\r\n if (!e.target.classList.contains('c-lightbox__video')) {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n window.addEventListener('keydown', function(e) {\r\n if (e.key == \"Escape\") {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n\r\n function checkVideos() {\r\n if(lightboxContainer.classList.contains('u-hidden')) {\r\n if (videoBackground.paused) {\r\n videoBackground.play();\r\n }\r\n if (!lightboxVideo.paused) {\r\n lightboxVideo.pause();\r\n }\r\n } else {\r\n if (!videoBackground.paused) {\r\n videoBackground.pause();\r\n }\r\n }\r\n }\r\n }\r\n });\r\n}\r\n\r\nexport default HeroVideo;","const ResponsiveTable = () => {\r\n const tables = Array.from(document.querySelectorAll('.c-table--responsive'));\r\n tables.forEach(createResponsiveTable);\r\n\r\n /**\r\n * Create responsive table headers for large tables\r\n * @param {HTMLTableElement} table\r\n */\r\n function createResponsiveTable(table) {\r\n const headers = table.querySelectorAll('thead > :first-child th');\r\n const breakPoint = Number(table.getAttribute('data-columns')) || 2\r\n \r\n if (headers.length < breakPoint) {\r\n table.classList.remove('c-table--responsive');\r\n return;\r\n };\r\n\r\n Array.from(table.querySelectorAll('tbody tr')).forEach((row) => {\r\n Array.from(headers)\r\n .map((x) => x.textContent)\r\n .forEach((header, index) => {\r\n if (row.children[index]) {\r\n row.children[index].setAttribute('data-responsive-title', header);\r\n }\r\n });\r\n });\r\n }\r\n};\r\n\r\nexport default ResponsiveTable;\r\n","import { debounce } from './utilities';\r\n\r\nfunction ScrollbarWidth() {\r\n setScrollbarWidth();\r\n window.addEventListener('resize', debounce(setScrollbarWidth, 250));\r\n}\r\n\r\nfunction setScrollbarWidth() {\r\n document.documentElement.style.setProperty(\r\n '--scrollbarWidth', \r\n window.innerWidth - document.body.clientWidth + 'px'\r\n );\r\n}\r\n\r\nexport default ScrollbarWidth;","function ScrollSpy() {\r\n const spies = Array.from(document.querySelectorAll('.c-scroll-spy'));\r\n spies.forEach(setup);\r\n}\r\n\r\nfunction setup(element) {\r\n const anchors = Array.from(element.querySelectorAll('a'));\r\n const observer = new IntersectionObserver(observation(anchors));\r\n \r\n anchors.forEach(anchor => {\r\n const id = anchor.getAttribute('href').replace('#', '');\r\n const target = document.getElementById(id);\r\n if (!target) return;\r\n\r\n observer.observe(target);\r\n });\r\n}\r\n\r\n/**\r\n * @param {Array<HTMLAnchorElement>} results \r\n * @return {Array<IntersectionObserverEntry>}\r\n */\r\nfunction observation(anchors) {\r\n return (results) => {\r\n const firstObservation = results.find(x => x.isIntersecting);\r\n\r\n if (firstObservation) {\r\n anchors.forEach(x => {\r\n x.classList.toggle(\r\n 'c-scroll-spy-active',\r\n x.getAttribute('href') === '#' + firstObservation.target.id\r\n )\r\n })\r\n }\r\n }\r\n}\r\n\r\nexport default ScrollSpy;\r\n","function Tabs() {\r\n const tabs = Array.from(document.querySelectorAll('.c-tabs--anchor'));\r\n tabs.forEach(setupTabs);\r\n}\r\n\r\nfunction setupTabs(parent) {\r\n const controls = Array.from(parent.querySelectorAll('.c-tabs__control'));\r\n const content = Array.from(parent.querySelectorAll('.c-tab'));\r\n const persist = parent.classList.contains('c-tabs--persist');\r\n \r\n if (!controls.length || !content.length) return;\r\n\r\n controls.forEach(control => {\r\n control.addEventListener('click', controlClick(controls, content, persist))\r\n })\r\n\r\n if (persist && window.location.hash) {\r\n const control = parent.querySelector('[href=\"' + window.location.hash + '\"]');\r\n if (control) control.dispatchEvent(new Event('click'));\r\n }\r\n}\r\n\r\nfunction controlClick(controls, contents, persist) {\r\n return (event) => {\r\n const control = event.currentTarget;\r\n const content = contents.find(x => x.id === control.getAttribute('href').replace('#', ''));\r\n \r\n if (!content) {\r\n return true;\r\n };\r\n\r\n event.preventDefault();\r\n \r\n if (persist) {\r\n history.pushState(null, null, control.getAttribute('href'));\r\n }\r\n\r\n controls.forEach(c => c.classList.toggle('c-tabs__control--active', c === control));\r\n contents.forEach(c => {\r\n const isCurrent = c === content;\r\n c.classList.toggle('c-tab--active', isCurrent);\r\n \r\n if (persist) return;\r\n\r\n if (isCurrent) {\r\n c.setAttribute('tabIndex', -1);\r\n \r\n const y = window.scrollY;\r\n c.focus();\r\n window.scrollTo({ behavior: \"auto\", top: y })\r\n } else {\r\n c.removeAttribute('tabIndex');\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Tabs;\r\n","import Accordion from './imports/accordion';\r\nimport Carousel from './imports/carousel';\r\nimport ClearForm from './imports/clear-form';\r\nimport Comparison from './imports/comparison';\r\nimport Gallery from './imports/gallery';\r\nimport HeroPattern from './imports/hero-pattern';\r\nimport HeroVideo from './imports/hero-video';\r\nimport ResponsiveTable from './imports/responsive-table';\r\nimport ScrollbarWidth from './imports/scrollbar-width';\r\nimport ScrollSpy from './imports/scroll-spy';\r\nimport Tabs from './imports/tabs';\r\n\r\n(() => {\r\n if(window.NodeList && !NodeList.prototype.forEach) {\r\n NodeList.prototype.forEach = Array.prototype.forEach;\r\n }\r\n if(window.HTMLCollection && !HTMLCollection.prototype.forEach) {\r\n HTMLCollection.prototype.forEach = Array.prototype.forEach;\r\n }\r\n \r\n Accordion();\r\n Carousel();\r\n ClearForm();\r\n Comparison();\r\n Gallery();\r\n HeroPattern();\r\n HeroVideo();\r\n ResponsiveTable();\r\n ScrollbarWidth();\r\n ScrollSpy();\r\n Tabs();\r\n})();"],"names":["$c274619fa9ae66ac$var$setupAccordions","title","addEventListener","event","currentTarget","parentElement","classList","toggle","$c274619fa9ae66ac$export$2e2bcd8739ae039","Array","from","document","querySelectorAll","forEach","$5bdce36a18199573$export$2e2bcd8739ae039","current","bgSlides","fgSlides","length","setInterval","bgSlide","style","opacity","fgSlide","$2b04c6f63ef290fb$export$2e2bcd8739ae039","formClear","getElementById","this","closest","elements","field","value","type","toLowerCase","checked","$7fbc59e2fab6d5d2$var$extractMobileComparison","container","body","querySelector","head","mobile","products","children","filter","x","i","map","info","innerHTML","table","row","contains","push","textContent","cells","firstCell","shift","el","index","key","product","parent","createElement","join","$7fbc59e2fab6d5d2$var$createMobileProduct","appendChild","$7fbc59e2fab6d5d2$export$2e2bcd8739ae039","$dfe0031b837edf6f$export$2e2bcd8739ae039","mainSlides","thumbnailSlides","lightboxTrigger","lightbox","cloneNode","remove","add","slide","slideImg","srcset","removeAttribute","insertAdjacentHTML","lightboxActive","prevImage","parseInt","dataset","nextImage","e","target","thumbnailSlide","thumbnail","parentNode","mainSlide","$41a3994d4318effb$export$b568019c0551f0a4","y","a","min","max","Math","$41a3994d4318effb$export$7d15b64cf5a3a4c4","$2e27ca8f14f20195$export$2e2bcd8739ae039","time","c","ctx","getContext","reduceMotion","window","matchMedia","matches","crossGap","crossSpeed","width","height","across","down","totalPoints","crosses","onResize","scrollWidth","scrollHeight","canvas","ceil","ids","array","arr","j","floor","random","$41a3994d4318effb$export$448332262467e042","_","counter","direction","draw","clearRect","beginPath","cnt","lineTo","cos","lineWidth","strokeStyle","stroke","cross","x1","y1","x2","y2","$41a3994d4318effb$export$3a89f8d6f6bf6c9f","moveTo","requestAnimationFrame","$63fd9338c6a56d33$export$2e2bcd8739ae039","videoBackground","reducedMotion","lightboxContainer","lightboxVideo","checkVideos","paused","play","pause","setAttribute","headers","breakPoint","Number","getAttribute","header","$e3dc92a106d80d6c$var$setScrollbarWidth","documentElement","setProperty","innerWidth","clientWidth","$e3dc92a106d80d6c$export$2e2bcd8739ae039","func","limit","wait","setTimeout","$41a3994d4318effb$export$61fc7d43ac8f84b0","$9d1dec2ad218c628$var$setup","element","anchors","observer","IntersectionObserver","results","firstObservation","find","isIntersecting","id","$9d1dec2ad218c628$var$observation","anchor","replace","observe","$1d2dabc452d8efd6$var$setupTabs","controls","content","persist","control","contents","preventDefault","history","pushState","isCurrent","scrollY","focus","scrollTo","behavior","top","$1d2dabc452d8efd6$var$controlClick","location","hash","dispatchEvent","Event","$1d2dabc452d8efd6$export$2e2bcd8739ae039","NodeList","prototype","HTMLCollection","$384feef4bde84172$export$2e2bcd8739ae039","$9d1dec2ad218c628$export$2e2bcd8739ae039"],"version":3,"file":"app.js.map"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
@import "https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";.u-breakout{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:safe-space(0);padding-right:safe-space(0);position:relative;transform:translate(-50vw)}.u-cutoff{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--gutter)),calc(100% - var(--gutter))100%,0 100%)}.u-cutoff--top-right{clip-path:polygon(0 0,calc(100% - var(--gutter))0,100% var(--gutter),100% 100%,0 100%)}.u-cutoff--top-left{clip-path:polygon(var(--gutter)0,100% 0,100% 100%,0 100%,0 var(--gutter))}.u-cutoff--bottom-left{clip-path:polygon(0 0,100% 0,100% 100%,var(--gutter)100%,0 calc(100% - var(--gutter)))}:root{--fluid-min-width:320;--fluid-max-width:1332;--fluid-screen:100vw;--fluid-bp:calc( (var(--fluid-screen) - var(--fluid-min-width)/16*1rem)/(var(--fluid-max-width) - var(--fluid-min-width)))}@media screen and (min-width:1332px){:root{--fluid-screen:calc(var(--fluid-max-width)*1px)}}:root{--f--2-min:12.64;--f--2-max:12.5;--step--2:calc( ((var(--f--2-min)/16)*1rem) + (var(--f--2-max) - var(--f--2-min))*var(--fluid-bp));--f--1-min:14.22;--f--1-max:15;--step--1:calc( ((var(--f--1-min)/16)*1rem) + (var(--f--1-max) - var(--f--1-min))*var(--fluid-bp));--f-0-min:16;--f-0-max:18;--step-0:calc( ((var(--f-0-min)/16)*1rem) + (var(--f-0-max) - var(--f-0-min))*var(--fluid-bp));--f-1-min:18;--f-1-max:21.6;--step-1:calc( ((var(--f-1-min)/16)*1rem) + (var(--f-1-max) - var(--f-1-min))*var(--fluid-bp));--f-2-min:20.25;--f-2-max:25.92;--step-2:calc( ((var(--f-2-min)/16)*1rem) + (var(--f-2-max) - var(--f-2-min))*var(--fluid-bp));--f-3-min:22.78;--f-3-max:31.1;--step-3:calc( ((var(--f-3-min)/16)*1rem) + (var(--f-3-max) - var(--f-3-min))*var(--fluid-bp));--f-4-min:25.63;--f-4-max:37.32;--step-4:calc( ((var(--f-4-min)/16)*1rem) + (var(--f-4-max) - var(--f-4-min))*var(--fluid-bp));--f-5-min:28.83;--f-5-max:44.79;--step-5:calc( ((var(--f-5-min)/16)*1rem) + (var(--f-5-max) - var(--f-5-min))*var(--fluid-bp));--f-6-min:32.44;--f-6-max:53.75;--step-6:calc( ((var(--f-6-min)/16)*1rem) + (var(--f-6-max) - var(--f-6-min))*var(--fluid-bp));--f-7-min:36.49;--f-7-max:64.5;--step-7:calc( ((var(--f-7-min)/16)*1rem) + (var(--f-7-max) - var(--f-7-min))*var(--fluid-bp));--f-8-min:41.05;--f-8-max:77.4;--step-8:calc( ((var(--f-8-min)/16)*1rem) + (var(--f-8-max) - var(--f-8-min))*var(--fluid-bp));--f-9-min:46.18;--f-9-max:92.88;--step-9:calc( ((var(--f-9-min)/16)*1rem) + (var(--f-9-max) - var(--f-9-min))*var(--fluid-bp));--f-10-min:51.96;--f-10-max:111.45;--step-10:calc( ((var(--f-10-min)/16)*1rem) + (var(--f-10-max) - var(--f-10-min))*var(--fluid-bp))}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(../Inter-Regular.ed77b881.woff2)format("woff2"),url(../Inter-Regular.ca6858d7.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(../Inter-SemiBold.dd034768.woff2)format("woff2"),url(../Inter-SemiBold.cc1168df.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(../Inter-Bold.af5441a3.woff2)format("woff2"),url(../Inter-Bold.419e8c71.woff)format("woff")}:root{--max-screen:83.25;--fc-screen:100vw;--fc-bp:calc((var(--fc-screen) - 20em)/(var(--max-screen) - 20));--fc-base:18;--fc-3xs:4.5;--space-3xs:calc(var(--fc-3xs)/16*1rem);--fc-2xs:9;--space-2xs:calc(var(--fc-2xs)/16*1rem);--fc-xs:13.5;--space-xs:calc(var(--fc-xs)/16*1rem);--fc-s:18;--space-s:calc(var(--fc-s)/16*1rem);--fc-m:27;--space-m:calc(var(--fc-m)/16*1rem);--fc-l:36;--space-l:calc(var(--fc-l)/16*1rem);--fc-xl:54;--space-xl:calc(var(--fc-xl)/16*1rem);--fc-2xl:72;--space-2xl:calc(var(--fc-2xl)/16*1rem);--fc-3xl:108;--space-3xl:calc(var(--fc-3xl)/16*1rem);--fc-4xl:144;--space-4xl:calc(var(--fc-4xl)/16*1rem);--space--3xs:calc( ((var(--fc-)/16)*1rem) + (var(--fc-3xs) - var(--fc-))*var(--fluid-bp));--space-3xs-2xs:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-2xs) - var(--fc-3xs))*var(--fluid-bp));--space-2xs-xs:calc( ((var(--fc-2xs)/16)*1rem) + (var(--fc-xs) - var(--fc-2xs))*var(--fluid-bp));--space-xs-s:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-s) - var(--fc-xs))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-m-l:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-l) - var(--fc-m))*var(--fluid-bp));--space-l-xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-xl) - var(--fc-l))*var(--fluid-bp));--space-xl-2xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-2xl) - var(--fc-xl))*var(--fluid-bp));--space-2xl-3xl:calc( ((var(--fc-2xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-2xl))*var(--fluid-bp));--space-3xl-4xl:calc( ((var(--fc-3xl)/16)*1rem) + (var(--fc-4xl) - var(--fc-3xl))*var(--fluid-bp));--space-s-l:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-l) - var(--fc-s))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-xs-l:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-l) - var(--fc-xs))*var(--fluid-bp));--space-m-xl:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-xl) - var(--fc-m))*var(--fluid-bp));--space-l-2xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-2xl) - var(--fc-l))*var(--fluid-bp));--space-s-xl:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-xl) - var(--fc-s))*var(--fluid-bp));--space-l-3xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-3xl) - var(--fc-l))*var(--fluid-bp));--space-xl-3xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-xl))*var(--fluid-bp));--space-l-4xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-4xl) - var(--fc-l))*var(--fluid-bp));--space-3xs-m:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-m) - var(--fc-3xs))*var(--fluid-bp));--gutter:var(--space-s-l)}@media screen and (min-width:75em){:root{--fc-screen:calc(var(--max-screen)*1rem)}}*,:before,:after{box-sizing:border-box}body{min-height:100vh;flex-direction:column;justify-content:flex-start;align-items:stretch;margin:0;display:flex}html{scroll-behavior:smooth}blockquote,pre,ol,ul,figure{margin:0;padding:0}img{max-width:100%;height:auto;border:0;display:block}article,aside,figure,footer,header,aside,main,nav{display:block}iframe{border:0}body{letter-spacing:-.01em;font:400 18px/1.2 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:var(--step-0);color:#333}h1,h2,h3,h4,h5,h6,p,ul,ol,dl{margin:0}ul,ol,p{line-height:1.2}a{text-decoration:none}a,a:hover{cursor:pointer;color:inherit}.mp ol,.mp ul{list-style:none}cite,address{font-style:normal}[type=submit],[type=button],button{box-shadow:none;appearance:none;cursor:pointer;color:inherit;font:inherit;background:0 0;border:0;border-radius:0;padding:0}[disabled],.mp.c-button[disabled]{opacity:.5;cursor:not-allowed}label{cursor:pointer}fieldset{border:0;padding:.01em 0 0}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}code[class*=language-],pre[class*=language-]{text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;color:#3d7b87;tab-size:4;-webkit-hyphens:none;hyphens:none;background:#ebf1f2;font-family:Source Code Pro,monospace;font-size:1rem;line-height:1.5em}code[class*=language-]::selection,pre[class*=language-]::selection,code[class*=language-] ::selection,pre[class*=language-] ::selection{color:#263238;background:#cceae7}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.2em;padding:.1em}pre[class*=language-]{padding:18px;padding:var(--space-s);position:relative;overflow:auto}.language-css>code,.language-sass>code,.language-scss>code{color:#f2a60d}[class*=language-] .namespace{opacity:.7}.token.atrule{color:#3d7b87}.token.attr-name{color:#00a2c2}.token.attr-value,.token.attribute{color:#13aa13}.token.boolean{color:#ce0058}.token.builtin,.token.cdata,.token.char,.token.class{color:#00a2c2}.token.class-name{color:#6182b8}.token.comment{color:#aabfc9}.token.constant{color:#3d7b87}.token.deleted{color:#ce0058}.token.doctype{color:#aabfc9}.token.entity{color:#ce0058}.token.function{color:#3d7b87}.token.hexcode{color:#f2a60d}.token.id,.token.important{color:#3d7b87;font-weight:700}.token.inserted{color:#00a2c2}.token.keyword{color:#3d7b87}.token.number{color:#f2a60d}.token.operator{color:#00a2c2}.token.prolog{color:#aabfc9}.token.property{color:#00a2c2}.token.pseudo-class,.token.pseudo-element{color:#13aa13}.token.punctuation,.token.regex{color:#00a2c2}.token.selector{color:#ce0058}.token.string{color:#13aa13}.token.symbol{color:#3d7b87}.token.tag{color:#005461}.token.unit{color:#f2a60d}.token.url,.token.variable{color:#ce0058}.u-hr,.c-library hr,.o-prose hr{padding-bottom:27px;padding-bottom:var(--space-m-xl);margin:0 0 27px;margin-bottom:var(--space-m-xl);border:0;border-bottom:1px solid #bfd3d6}.u-border-top{border-top:1px solid #bfd3d6}.u-border-bottom{border-bottom:1px solid #bfd3d6}.u-border{border:1px solid #bfd3d6}.o-grid{margin-bottom:-18px;margin-bottom:calc(-1*var(--gutter));width:100%;flex-wrap:wrap;justify-content:stretch;display:flex}.o-grid--float:after{content:" ";clear:both;display:table}.o-grid--between{justify-content:space-between}.o-grid--no-height-match{align-items:start}.o-grid>*{width:100%;margin-bottom:18px;margin-bottom:var(--gutter)}@media (min-width:40em){.o-grid--of-two>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-two-late>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-late>:nth-child(2n+1){margin-left:0}}@media (min-width:22.4em){.o-grid--of-two-early>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-early>:nth-child(2n+1){margin-left:0}}@media (min-width:38em) and (max-width:54.9375em){.o-grid--of-three>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three>*{width:calc(33.3333% - (($columns - 1)*18px/$columns) - .1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:67.9375em){.o-grid--of-three-late>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(2n+1){margin-left:0}}@media (min-width:68em){.o-grid--of-three-late>*{width:calc(33.3333% - (($columns - 1)*18px/$columns) - .1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(3n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:54.9375em){.o-grid--of-three-early>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three-early>*{width:calc(33.3333% - (($columns - 1)*18px/$columns) - .1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:59.9375em){.o-grid--of-four>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four>*{width:calc(25% - (($columns - 1)*18px/$columns) - .1px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(4n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:59.9375em){.o-grid--of-four-early>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four-early>*{width:calc(25% - (($columns - 1)*18px/$columns) - .1px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(4n+1){margin-left:0}}@media (max-width:54.9375em){.o-grid--swipeable{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:var(--gutter);padding-right:var(--gutter);scroll-snap-type:x mandatory;scroll-padding:var(--gutter);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;position:relative;overflow-x:scroll;transform:translate(-50vw)}.o-grid--swipeable>*{max-width:23em;width:calc(85vw - var(--gutter)*2.333);scroll-snap-align:start;scroll-snap-stop:always;flex:none}.o-grid--swipeable>*+*{margin-left:var(--gutter)!important}}@media (min-width:55em){.o-grid--4\/7>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+2){width:57.1429%}.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--8\/4>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--8\/4-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){width:65.7143%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--4\/8>:nth-child(2n+1),.o-grid--4\/7>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2),.o-grid--4\/8-switch>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+1){width:31.4286%}.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){margin-left:2.85714%;margin-right:0}.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+1){max-width:828px}.o-grid[class*=switch]>:nth-child(2n+1){order:1}.o-grid--layout,.o-grid--layout>:nth-last-child(1),.o-grid--layout>:nth-last-child(2){margin-bottom:0}.o-grid--push{justify-content:space-between}.o-grid--pull{justify-content:flex-start}.o-grid--float{display:block}.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2){float:left}.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){float:right}}@media (min-width:70em){.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1){width:74.2857%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2){width:22.8571%}}.c-library{min-height:100vh;grid-template-rows:auto 1fr auto;display:grid}.c-library--components{grid-template-rows:auto 1fr}.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:9px;padding:var(--space-2xs);color:#fff;background:#005461;flex-direction:column;align-items:flex-start;font-weight:700}@media only screen and (min-width:650px){.c-library__header{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);flex-direction:row;align-items:center}}@media only screen and (min-width:1000px){.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:18px;padding:var(--space-s)var(--space-s-l)}}.c-library__header img{filter:saturate(0)brightness(10)}.c-library__header .c-library-page-active{position:relative}.c-library__header .c-library-page-active:after{content:"";width:100%;border-bottom:1px solid ;position:absolute;bottom:-6px;left:0}.c-library__hero{color:#fff;background:linear-gradient(#005461,#0000),linear-gradient(45deg,#00a2c2,#005461)}.c-library__body{grid-template-rows:auto auto;display:grid}@media only screen and (min-width:600px){.c-library__body{grid-template-columns:10em 1fr}}@media only screen and (min-width:800px){.c-library__body{grid-template-columns:17em 1fr}}@media only screen and (min-width:600px){.c-library--components .c-library__body>*{height:calc(100vh - var(--headerHeight) - 1px);overflow-y:scroll}}.c-library__sidebar{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);scroll-behavior:none;border-right:1px solid #ebf1f2;grid-row:-1}@media only screen and (min-width:600px){.c-library__sidebar{grid-row:auto}}@media only screen and (min-width:800px){.c-library__sidebar{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}}.c-library__sidebar>*{padding:18px;padding:var(--space-s-l)var(--space-s)var(--space-s-l)var(--space-s-l)}.c-library__sidebar li{position:relative}.c-library__sidebar li a{color:#006daf}.c-library__sidebar li a:hover{color:#006daf;text-decoration:underline}.c-library__sidebar li+li{margin-top:13.5px;margin-top:var(--space-xs)}.c-library__sidebar ul ul{padding:13.5px;padding:var(--space-xs);padding-bottom:0}.c-library__sidebar ul ul li+li{margin-top:9px;margin-top:var(--space-2xs)}.c-library__skip-link{padding:13.5px;padding:var(--space-xs)}@media only screen and (min-width:600px){.c-library__skip-link{display:none}}.c-library__logo{max-width:15%;min-width:100px;justify-content:center;align-items:center;display:flex}@media only screen and (min-width:650px){.c-library__logo{justify-content:flex-start}}.c-library__logo-name{padding-left:13.5px;padding-left:var(--space-xs-s);margin-left:13.5px;margin-left:var(--space-xs-s);white-space:nowrap;border-left:1px solid #3d7b87}.c-library__logo-name span{display:block}.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){text-transform:uppercase;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);letter-spacing:.08em;color:#bfd3d6}.c-library__logo-name span:nth-last-child(2){color:#fff;letter-spacing:-.03em;font-size:37.32px;font-size:var(--step-4)}.c-library__logo-name span:nth-last-child(3){color:#3d7b87}.has-js .c-library__sidebar ul>li>ul{display:none}.has-js .c-library__sidebar ul>.c-library-accordion-open>ul{display:block}.c-library .c-library-accordion-open>.c-library-accordion__toggle{transform:rotate(180deg)}.c-library .c-library-accordion__toggle{color:#006daf;justify-content:center;align-items:center;padding:.25rem;font-size:1rem;line-height:1;display:flex;position:absolute;top:0;right:0}.c-library-menu-active{font-weight:700;position:relative}.c-library-menu-active:before{content:"▸ ";position:absolute;top:0;left:-17px}.c-library-stretch{flex-direction:column;flex:1;display:flex}.c-library__main{overflow-y:auto}@media only screen and (min-width:600px){.c-library__main{overflow-y:scroll}}.c-library__frame{width:100%;position:relative}.c-library__frame-links{right:0;top:calc(-1*(var(--space-m) + var(--space-s)));z-index:1;position:absolute}.c-library__frame-links a,.c-library__frame-links button{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:0 0 .25em .25em;padding:.25em .666em}.c-library__frame-background{border-radius:0 0 0 .25em;top:0}.c-library__frame iframe{height:100%;width:100%;transition:all .3s cubic-bezier(.22,.61,.36,1);top:0;left:0}@media only screen and (min-width:600px){.c-library__frame iframe{position:absolute}}.c-library-code{font-family:Source Code Pro}.c-library-pre{padding:18px;padding:var(--space-s);background:#ebf1f2;font-family:Source Code Pro;line-height:1.4;overflow-x:auto}.c-library-pre--bordered{border-bottom:1px solid #bfd3d6}.c-library-version{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595}.c-library-status{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:.25em;padding:.25em .666em}.c-library-status--ready{color:#fff;background:#13aa13}.c-library-status--in-production,.c-library-status--development,.c-library-status--placeholder{color:#fff;background:#f2a60d}.c-library-status--deprecated{color:#fff;background:#ce0058}.c-library__swatch-grid{margin-bottom:var(--space-m);grid-auto-rows:minmax(4em,auto);gap:0 1em;display:grid}@media only screen and (min-width:680px){.c-library__swatch-grid{grid-template-rows:5em auto;grid-template-columns:repeat(5,auto);gap:0}}.c-library__swatch-grid--has-labels{grid-auto-flow:row}@media only screen and (min-width:40em){.c-library__swatch-grid--has-labels{grid-template-rows:auto;grid-template-columns:minmax(15%,15em) auto}}@media only screen and (min-width:1000px){.c-library__swatch-grid--has-labels{grid-template-rows:5em auto;grid-template-columns:repeat(5,1fr);grid-auto-flow:column}}.c-library__swatches,.c-library__swatch-labels{grid-template-columns:repeat(auto-fit,165px);display:grid}.c-library__swatch{display:flex}.c-library__swatch>*{justify-content:center;margin:auto;font-weight:700}.c-library__swatches>*{height:0;padding-bottom:50%;position:relative}.c-library__swatches>*>*{text-align:center;height:100%;width:100%;justify-content:center;align-items:center;padding:.5rem;font-weight:700;display:flex;position:absolute;top:0;left:0}.c-library__swatch-grid table{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__swatch-grid table td,.c-library__swatch-grid table th{padding:9px 0 9px 4.5px;padding:var(--space-2xs)0 var(--space-2xs)var(--space-3xs)}.c-library__swatch-grid table th{width:3em}.c-library__swatch-grid table td{font-family:monospace}.c-library__image-row{max-width:100%;display:flex}.c-library__image-row img{object-fit:contain;width:6%;flex:auto;margin:0 2% 0 0}.c-library__image-row img:last-child{margin-right:0}.c-library__space{display:block}.c-library__space span{height:0;background:linear-gradient(45deg,#fff3 0%,#fff0 100%),#ce005880;padding-bottom:100%;display:block;position:relative}.c-library__space code{margin-left:18px;margin-left:var(--space-s);white-space:nowrap;line-height:1;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.c-library-grid{color:#fff;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);background:#00758c;justify-content:center;align-items:center;padding:3rem 1rem;display:flex}.c-library-grid--alt{background:#3d7b87;padding:2rem 1rem}.c-library-grid--alt:before{content:" ";display:block}.c-library-grid--first{background:#005461;padding:2rem 1rem}.c-library-grid--first:before{content:"First on mobile"}.c-library-copy{position:relative}.c-library-copy__trigger{letter-spacing:-.01em;font-size:15px;font-weight:700;font-size:var(--step--1);padding:4.5px 9px;padding:var(--space-3xs)var(--space-2xs);letter-spacing:.02em;background:#bfd3d6;position:absolute;bottom:0;right:0}.c-library-copy__trigger:hover{color:#ce0058}.c-library__typo__sidebar{width:14.2857%}.c-library__typo__sidebar span{display:block}.c-library__typo__sidebar .x2{height:2em;border:1px solid #333;border-width:1px 0;margin-top:4.25em;line-height:2em}.c-library__typo__main{width:82.8572%}.c-library__semi{font-weight:600}.c-library__photo-grid{margin-top:54px;margin-top:var(--space-xl);grid-template-columns:1fr;gap:2px;display:grid}@media only screen and (min-width:880px){.c-library__photo-grid{grid-auto-flow:dense;grid-auto-rows:auto}.c-library__photo-grid img{height:100%;width:100%;object-fit:cover}.c-library__photo-grid div{grid-area:1/1/2/3;display:flex}.c-library__photo-grid div h2{margin:auto var(--space-s)}.c-library__photo-grid.grid-1{grid-template-columns:40% 20% 40%;grid-template-rows:var(--space-2xl)400px 400px}.c-library__photo-grid.grid-1 img:nth-child(2){grid-area:2/1/3/3}.c-library__photo-grid.grid-1 img:nth-child(3){grid-area:1/3/3/4}.c-library__photo-grid.grid-1 img:nth-child(5){grid-column:2/4}.c-library__photo-grid.grid-2{grid-template-columns:50% 50%;grid-template-rows:var(--space-2xl)300px 300px}.c-library__photo-grid.grid-2 div{grid-column:1/2}.c-library__photo-grid.grid-2 img:nth-child(2){grid-row:2/4}.c-library__photo-grid.grid-2 img:nth-child(3){grid-row:1/3}}.c-library__illustration-grid{gap:var(--gutter);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.c-library__illustration-grid :nth-child(2n+1):nth-last-child(3){grid-column:1/-1}.c-library .c-alert ul li{margin-left:1em;padding-left:.5rem;list-style:outside url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"20\" viewBox=\"0 0 10 20\"><circle cx=\"5\" cy=\"14\" r=\"3.5\" fill=\"%2313AA13\" fill-rule=\"evenodd\"/></svg>")}.c-library .c-alert ul li h3,.c-library .c-alert ul li h4{color:#13aa13;font-size:1em;line-height:1.6}@media only screen and (max-width:1050px){.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__logo-name span:nth-last-child(2){letter-spacing:-.02em;font-size:21.6px;font-size:var(--step-1)}.c-library__header nav li:last-child{display:none}}@media only screen and (min-width:650px) and (max-width:700px),screen and (max-width:450px){.c-library__header nav .u-row{gap:9px;gap:var(--space-2xs);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}}@media only screen and (max-width:650px){.c-library__header nav a{padding:9px 0;padding:var(--space-2xs)0;display:block}.c-library__header .c-library-page-active:after{bottom:4.5px;bottom:var(--space-3xs)}}
|
1
|
+
@import "https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";.u-breakout{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:safe-space(0);padding-right:safe-space(0);position:relative;transform:translate(-50vw)}.u-cutoff{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--gutter)),calc(100% - var(--gutter))100%,0 100%)}.u-cutoff--top-right{clip-path:polygon(0 0,calc(100% - var(--gutter))0,100% var(--gutter),100% 100%,0 100%)}.u-cutoff--top-left{clip-path:polygon(0 var(--gutter),var(--gutter)0,100% 0,100% 100%,0 100%)}.u-cutoff--bottom-left{clip-path:polygon(0 0,100% 0,100% 100%,var(--gutter)100%,0 calc(100% - var(--gutter)))}.u-cutoff--xl{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-xl)),calc(100% - var(--space-xl))100%,0 100%)}:root{--fluid-min-width:320;--fluid-max-width:1332;--fluid-screen:100vw;--fluid-bp:calc( (var(--fluid-screen) - var(--fluid-min-width)/16*1rem)/(var(--fluid-max-width) - var(--fluid-min-width)))}@media screen and (min-width:1332px){:root{--fluid-screen:calc(var(--fluid-max-width)*1px)}}:root{--f--2-min:12.64;--f--2-max:12.5;--step--2:calc( ((var(--f--2-min)/16)*1rem) + (var(--f--2-max) - var(--f--2-min))*var(--fluid-bp));--f--1-min:14.22;--f--1-max:15;--step--1:calc( ((var(--f--1-min)/16)*1rem) + (var(--f--1-max) - var(--f--1-min))*var(--fluid-bp));--f-0-min:16;--f-0-max:18;--step-0:calc( ((var(--f-0-min)/16)*1rem) + (var(--f-0-max) - var(--f-0-min))*var(--fluid-bp));--f-1-min:18;--f-1-max:21.6;--step-1:calc( ((var(--f-1-min)/16)*1rem) + (var(--f-1-max) - var(--f-1-min))*var(--fluid-bp));--f-2-min:20.25;--f-2-max:25.92;--step-2:calc( ((var(--f-2-min)/16)*1rem) + (var(--f-2-max) - var(--f-2-min))*var(--fluid-bp));--f-3-min:22.78;--f-3-max:31.1;--step-3:calc( ((var(--f-3-min)/16)*1rem) + (var(--f-3-max) - var(--f-3-min))*var(--fluid-bp));--f-4-min:25.63;--f-4-max:37.32;--step-4:calc( ((var(--f-4-min)/16)*1rem) + (var(--f-4-max) - var(--f-4-min))*var(--fluid-bp));--f-5-min:28.83;--f-5-max:44.79;--step-5:calc( ((var(--f-5-min)/16)*1rem) + (var(--f-5-max) - var(--f-5-min))*var(--fluid-bp));--f-6-min:32.44;--f-6-max:53.75;--step-6:calc( ((var(--f-6-min)/16)*1rem) + (var(--f-6-max) - var(--f-6-min))*var(--fluid-bp));--f-7-min:36.49;--f-7-max:64.5;--step-7:calc( ((var(--f-7-min)/16)*1rem) + (var(--f-7-max) - var(--f-7-min))*var(--fluid-bp));--f-8-min:41.05;--f-8-max:77.4;--step-8:calc( ((var(--f-8-min)/16)*1rem) + (var(--f-8-max) - var(--f-8-min))*var(--fluid-bp));--f-9-min:46.18;--f-9-max:92.88;--step-9:calc( ((var(--f-9-min)/16)*1rem) + (var(--f-9-max) - var(--f-9-min))*var(--fluid-bp));--f-10-min:51.96;--f-10-max:111.45;--step-10:calc( ((var(--f-10-min)/16)*1rem) + (var(--f-10-max) - var(--f-10-min))*var(--fluid-bp))}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(../Inter-Regular.ed77b881.woff2)format("woff2"),url(../Inter-Regular.ca6858d7.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(../Inter-SemiBold.dd034768.woff2)format("woff2"),url(../Inter-SemiBold.cc1168df.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(../Inter-Bold.af5441a3.woff2)format("woff2"),url(../Inter-Bold.419e8c71.woff)format("woff")}:root{--max-screen:83.25;--fc-screen:100vw;--fc-bp:calc((var(--fc-screen) - 20em)/(var(--max-screen) - 20));--fc-base:18;--fc-3xs:4.5;--space-3xs:calc(var(--fc-3xs)/16*1rem);--fc-2xs:9;--space-2xs:calc(var(--fc-2xs)/16*1rem);--fc-xs:13.5;--space-xs:calc(var(--fc-xs)/16*1rem);--fc-s:18;--space-s:calc(var(--fc-s)/16*1rem);--fc-m:27;--space-m:calc(var(--fc-m)/16*1rem);--fc-l:36;--space-l:calc(var(--fc-l)/16*1rem);--fc-xl:54;--space-xl:calc(var(--fc-xl)/16*1rem);--fc-2xl:72;--space-2xl:calc(var(--fc-2xl)/16*1rem);--fc-3xl:108;--space-3xl:calc(var(--fc-3xl)/16*1rem);--fc-4xl:144;--space-4xl:calc(var(--fc-4xl)/16*1rem);--space--3xs:calc( ((var(--fc-)/16)*1rem) + (var(--fc-3xs) - var(--fc-))*var(--fluid-bp));--space-3xs-2xs:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-2xs) - var(--fc-3xs))*var(--fluid-bp));--space-2xs-xs:calc( ((var(--fc-2xs)/16)*1rem) + (var(--fc-xs) - var(--fc-2xs))*var(--fluid-bp));--space-xs-s:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-s) - var(--fc-xs))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-m-l:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-l) - var(--fc-m))*var(--fluid-bp));--space-l-xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-xl) - var(--fc-l))*var(--fluid-bp));--space-xl-2xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-2xl) - var(--fc-xl))*var(--fluid-bp));--space-2xl-3xl:calc( ((var(--fc-2xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-2xl))*var(--fluid-bp));--space-3xl-4xl:calc( ((var(--fc-3xl)/16)*1rem) + (var(--fc-4xl) - var(--fc-3xl))*var(--fluid-bp));--space-s-l:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-l) - var(--fc-s))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-xs-l:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-l) - var(--fc-xs))*var(--fluid-bp));--space-m-xl:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-xl) - var(--fc-m))*var(--fluid-bp));--space-l-2xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-2xl) - var(--fc-l))*var(--fluid-bp));--space-s-xl:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-xl) - var(--fc-s))*var(--fluid-bp));--space-l-3xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-3xl) - var(--fc-l))*var(--fluid-bp));--space-xl-3xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-xl))*var(--fluid-bp));--space-l-4xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-4xl) - var(--fc-l))*var(--fluid-bp));--space-3xs-m:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-m) - var(--fc-3xs))*var(--fluid-bp));--gutter:var(--space-s-l)}@media screen and (min-width:75em){:root{--fc-screen:calc(var(--max-screen)*1rem)}}*,:before,:after{box-sizing:border-box}body{min-height:100vh;flex-direction:column;justify-content:flex-start;align-items:stretch;margin:0;display:flex}html{scroll-behavior:smooth}blockquote,pre,ol,ul,figure{margin:0;padding:0}img{max-width:100%;height:auto;border:0;display:block}article,aside,figure,footer,header,aside,main,nav{display:block}iframe{border:0}body{letter-spacing:-.01em;font:400 18px/1.2 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:var(--step-0);color:#333}h1,h2,h3,h4,h5,h6,p,ul,ol,dl{margin:0}ul,ol,p{line-height:1.2}a{text-decoration:none}a,a:hover{cursor:pointer;color:inherit}.mp ol,.mp ul{list-style:none}cite,address{font-style:normal}[type=submit],[type=button],button{box-shadow:none;appearance:none;cursor:pointer;color:inherit;font:inherit;background:0 0;border:0;border-radius:0;padding:0}[disabled],.mp.c-button[disabled]{opacity:.5;cursor:not-allowed}label{cursor:pointer}fieldset{border:0;padding:.01em 0 0}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}code[class*=language-],pre[class*=language-]{text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;color:#3d7b87;tab-size:4;-webkit-hyphens:none;hyphens:none;background:#ebf1f2;font-family:Source Code Pro,monospace;font-size:1rem;line-height:1.5em}.c-alert code[class*=language-],.c-alert pre[class*=language-]{background:0 0}code[class*=language-]::selection,pre[class*=language-]::selection,code[class*=language-] ::selection,pre[class*=language-] ::selection{color:#263238;background:#cceae7}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.2em;padding:.1em}pre[class*=language-]{padding:18px;padding:var(--space-s);position:relative;overflow:auto}.language-css>code,.language-sass>code,.language-scss>code{color:#f2a60d}[class*=language-] .namespace{opacity:.7}.token.atrule{color:#3d7b87}.token.attr-name{color:#00a2c2}.token.attr-value,.token.attribute{color:#13aa13}.token.boolean{color:#ce0058}.token.builtin,.token.cdata,.token.char,.token.class{color:#00a2c2}.token.class-name{color:#6182b8}.token.comment{color:#aabfc9}.token.constant{color:#3d7b87}.token.deleted{color:#ce0058}.token.doctype{color:#aabfc9}.token.entity{color:#ce0058}.token.function{color:#3d7b87}.token.hexcode{color:#f2a60d}.token.id,.token.important{color:#3d7b87;font-weight:700}.token.inserted{color:#00a2c2}.token.keyword{color:#3d7b87}.token.number{color:#f2a60d}.token.operator{color:#00a2c2}.token.prolog{color:#aabfc9}.token.property{color:#00a2c2}.token.pseudo-class,.token.pseudo-element{color:#13aa13}.token.punctuation,.token.regex{color:#00a2c2}.token.selector{color:#ce0058}.token.string{color:#13aa13}.token.symbol{color:#3d7b87}.token.tag{color:#005461}.token.unit{color:#f2a60d}.token.url,.token.variable{color:#ce0058}.u-hr,.c-library hr,.o-prose hr{padding-bottom:27px;padding-bottom:var(--space-m-xl);margin:0 0 27px;margin-bottom:var(--space-m-xl);border:0;border-bottom:1px solid #bfd3d6}.u-border-top{border-top:1px solid #bfd3d6}.u-border-bottom{border-bottom:1px solid #bfd3d6}.u-border{border:1px solid #bfd3d6}.o-grid{margin-bottom:-18px;margin-bottom:calc(-1*var(--gutter));width:100%;flex-wrap:wrap;justify-content:stretch;display:flex}.o-grid--float:after{content:" ";clear:both;display:table}.o-grid--between{justify-content:space-between}.o-grid--no-height-match{align-items:start}.o-grid>*{width:100%;margin-bottom:18px;margin-bottom:var(--gutter)}@media (min-width:40em){.o-grid--of-two>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-two-late>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-late>:nth-child(2n+1){margin-left:0}}@media (min-width:22.4em){.o-grid--of-two-early>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-early>:nth-child(2n+1){margin-left:0}}@media (min-width:38em) and (max-width:54.9375em){.o-grid--of-three>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three>*{width:calc(33.3333% - (($columns - 1)*18px/$columns) - .1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:67.9375em){.o-grid--of-three-late>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(2n+1){margin-left:0}}@media (min-width:68em){.o-grid--of-three-late>*{width:calc(33.3333% - (($columns - 1)*18px/$columns) - .1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(3n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:54.9375em){.o-grid--of-three-early>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three-early>*{width:calc(33.3333% - (($columns - 1)*18px/$columns) - .1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:59.9375em){.o-grid--of-four>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four>*{width:calc(25% - (($columns - 1)*18px/$columns) - .1px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(4n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:59.9375em){.o-grid--of-four-early>*{width:calc(50% - (($columns - 1)*18px/$columns) - .1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four-early>*{width:calc(25% - (($columns - 1)*18px/$columns) - .1px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(4n+1){margin-left:0}}@media (max-width:54.9375em){.o-grid--swipeable{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:var(--gutter);padding-right:var(--gutter);scroll-snap-type:x mandatory;scroll-padding:var(--gutter);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;position:relative;overflow-x:scroll;transform:translate(-50vw)}.o-grid--swipeable>*{max-width:23em;width:calc(85vw - var(--gutter)*2.333);scroll-snap-align:start;scroll-snap-stop:always;flex:none}.o-grid--swipeable>*+*{margin-left:var(--gutter)!important}}@media (min-width:55em){.o-grid--4\/7>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+2){width:57.1429%}.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--8\/4>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--8\/4-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){width:65.7143%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--4\/8>:nth-child(2n+1),.o-grid--4\/7>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2),.o-grid--4\/8-switch>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+1){width:31.4286%}.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){margin-left:2.85714%;margin-right:0}.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+1){max-width:828px}.o-grid[class*=switch]>:nth-child(2n+1){order:1}.o-grid--layout,.o-grid--layout>:nth-last-child(1),.o-grid--layout>:nth-last-child(2){margin-bottom:0}.o-grid--push{justify-content:space-between}.o-grid--pull{justify-content:flex-start}.o-grid--float{display:block}.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2){float:left}.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){float:right}}@media (min-width:70em){.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1){width:74.2857%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2){width:22.8571%}}.c-library{min-height:100vh;grid-template-rows:auto 1fr auto;display:grid}.c-library--components{grid-template-rows:auto 1fr}.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:9px;padding:var(--space-2xs);color:#fff;background:#005461;flex-direction:column;align-items:flex-start;font-weight:700}@media only screen and (min-width:650px){.c-library__header{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);flex-direction:row;align-items:center}}@media only screen and (min-width:1000px){.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:18px;padding:var(--space-s)var(--space-s-l)}}.c-library__header img{filter:saturate(0)brightness(10)}.c-library__header .c-library-page-active{position:relative}.c-library__header .c-library-page-active:after{content:"";width:100%;border-bottom:1px solid ;position:absolute;bottom:-6px;left:0}.c-library__hero{color:#fff;background:linear-gradient(#005461,#0000),linear-gradient(45deg,#00a2c2,#005461)}.c-library__body{grid-template-rows:auto auto;display:grid}@media only screen and (min-width:600px){.c-library__body{grid-template-columns:10em 1fr}}@media only screen and (min-width:800px){.c-library__body{grid-template-columns:17em 1fr}}@media only screen and (min-width:600px){.c-library--components .c-library__body>*{height:calc(100vh - var(--headerHeight) - 1px);overflow-y:auto}}.c-library__sidebar{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);scroll-behavior:none;border-right:1px solid #ebf1f2;grid-row:-1}@media only screen and (min-width:600px){.c-library__sidebar{grid-row:auto}}@media only screen and (min-width:800px){.c-library__sidebar{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}}.c-library__sidebar>*{padding:18px;padding:var(--space-s-l)var(--space-s)var(--space-s-l)var(--space-s-l)}.c-library__sidebar li{position:relative}.c-library__sidebar li a{color:#006daf}.c-library__sidebar li a:hover{color:#006daf;text-decoration:underline}.c-library__sidebar li+li{margin-top:13.5px;margin-top:var(--space-xs)}.c-library__sidebar ul ul{padding:13.5px;padding:var(--space-xs);padding-bottom:0}.c-library__sidebar ul ul li+li{margin-top:9px;margin-top:var(--space-2xs)}.c-library__skip-link{padding:13.5px;padding:var(--space-xs)}@media only screen and (min-width:600px){.c-library__skip-link{display:none}}.c-library__logo{max-width:15%;min-width:100px;justify-content:center;align-items:center;display:flex}@media only screen and (min-width:650px){.c-library__logo{justify-content:flex-start}}.c-library__logo-name{padding-left:13.5px;padding-left:var(--space-xs-s);margin-left:13.5px;margin-left:var(--space-xs-s);white-space:nowrap;border-left:1px solid #3d7b87}.c-library__logo-name span{display:block}.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){text-transform:uppercase;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);letter-spacing:.08em;color:#bfd3d6}.c-library__logo-name span:nth-last-child(2){color:#fff;letter-spacing:-.03em;font-size:37.32px;font-size:var(--step-4)}.c-library__logo-name span:nth-last-child(3){color:#3d7b87}.has-js .c-library__sidebar ul>li>ul{display:none}.has-js .c-library__sidebar ul>.c-library-accordion-open>ul{display:block}.c-library .c-library-accordion-open>.c-library-accordion__toggle{transform:rotate(180deg)}.c-library .c-library-accordion__toggle{color:#006daf;justify-content:center;align-items:center;padding:.25rem;font-size:1rem;line-height:1;display:flex;position:absolute;top:0;right:0}.c-library-menu-active{font-weight:700;position:relative}.c-library-menu-active:before{content:"▸ ";position:absolute;top:0;left:-17px}.c-library-stretch{flex-direction:column;flex:1;display:flex}.c-library__main{overflow-y:auto}@media only screen and (min-width:600px){.c-library__main{overflow-y:scroll}}.c-library__frame{width:100%;position:relative}.c-library__frame-links{right:0;top:calc(-1*(var(--space-m) + var(--space-s)));z-index:1;position:absolute}.c-library__frame-links a,.c-library__frame-links button{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:0 0 .25em .25em;padding:.25em .666em}.c-library__frame-background{border-radius:0 0 0 .25em;top:0}.c-library__frame iframe{height:100%;width:100%;resize:both;transition:padding .3s cubic-bezier(.22,.61,.36,1),background-color .3s cubic-bezier(.22,.61,.36,1);top:0;left:0}@media only screen and (min-width:600px){.c-library__frame iframe{position:absolute}}.c-library-code{font-family:Source Code Pro}.c-library-pre{padding:18px;padding:var(--space-s);background:#ebf1f2;font-family:Source Code Pro;line-height:1.4;overflow-x:auto}.c-library-pre--bordered{border-bottom:1px solid #bfd3d6}.c-library-version{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595}.c-library-status{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:.25em;padding:.25em .666em}.c-library-status--ready{color:#fff;background:#13aa13}.c-library-status--in-production,.c-library-status--development,.c-library-status--placeholder{color:#fff;background:#f2a60d}.c-library-status--deprecated{color:#fff;background:#ce0058}.c-library__swatch-grid{margin-bottom:var(--space-m);grid-auto-rows:minmax(4em,auto);gap:0 1em;display:grid}@media only screen and (min-width:680px){.c-library__swatch-grid{grid-template-rows:5em auto;grid-template-columns:repeat(5,auto);gap:0}}.c-library__swatch-grid--has-labels{grid-auto-flow:row}@media only screen and (min-width:40em){.c-library__swatch-grid--has-labels{grid-template-rows:auto;grid-template-columns:minmax(15%,15em) auto}}@media only screen and (min-width:1000px){.c-library__swatch-grid--has-labels{grid-template-rows:5em auto;grid-template-columns:repeat(5,1fr);grid-auto-flow:column}}.c-library__swatches,.c-library__swatch-labels{grid-template-columns:repeat(auto-fit,165px);display:grid}.c-library__swatch{display:flex}.c-library__swatch>*{justify-content:center;margin:auto;font-weight:700}.c-library__swatches>*{height:0;padding-bottom:50%;position:relative}.c-library__swatches>*>*{text-align:center;height:100%;width:100%;justify-content:center;align-items:center;padding:.5rem;font-weight:700;display:flex;position:absolute;top:0;left:0}.c-library__swatch-grid table{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__swatch-grid table td,.c-library__swatch-grid table th{padding:9px 0 9px 4.5px;padding:var(--space-2xs)0 var(--space-2xs)var(--space-3xs)}.c-library__swatch-grid table th{width:3em}.c-library__swatch-grid table td{font-family:monospace}.c-library__image-row{max-width:100%;display:flex}.c-library__image-row img{object-fit:contain;width:6%;flex:auto;margin:0 2% 0 0}.c-library__image-row img:last-child{margin-right:0}.c-library__space{display:block}.c-library__space span{height:0;background:linear-gradient(45deg,#fff3 0%,#fff0 100%),#ce005880;padding-bottom:100%;display:block;position:relative}.c-library__space code{margin-left:18px;margin-left:var(--space-s);white-space:nowrap;line-height:1;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.c-library-grid{color:#fff;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);background:#00758c;justify-content:center;align-items:center;padding:3rem 1rem;display:flex}.c-library-grid--alt{background:#3d7b87;padding:2rem 1rem}.c-library-grid--alt:before{content:" ";display:block}.c-library-grid--first{background:#005461;padding:2rem 1rem}.c-library-grid--first:before{content:"First on mobile"}.c-library-copy{position:relative}.c-library-copy__trigger{letter-spacing:-.01em;font-size:15px;font-weight:700;font-size:var(--step--1);padding:4.5px 9px;padding:var(--space-3xs)var(--space-2xs);letter-spacing:.02em;background:#bfd3d6;position:absolute;bottom:0;right:0}.c-library-copy__trigger:hover{color:#ce0058}.c-library__typo__sidebar{width:14.2857%}.c-library__typo__sidebar span{display:block}.c-library__typo__sidebar .x2{height:2em;border:1px solid #333;border-width:1px 0;margin-top:4.25em;line-height:2em}.c-library__typo__main{width:82.8572%}.c-library__semi{font-weight:600}.c-library__photo-grid{margin-top:54px;margin-top:var(--space-xl);grid-template-columns:1fr;gap:2px;display:grid}@media only screen and (min-width:880px){.c-library__photo-grid{grid-auto-flow:dense;grid-auto-rows:auto}.c-library__photo-grid img{height:100%;width:100%;object-fit:cover}.c-library__photo-grid div{grid-area:1/1/2/3;display:flex}.c-library__photo-grid div h2{margin:auto var(--space-s)}.c-library__photo-grid.grid-1{grid-template-columns:40% 20% 40%;grid-template-rows:var(--space-2xl)400px 400px}.c-library__photo-grid.grid-1 img:nth-child(2){grid-area:2/1/3/3}.c-library__photo-grid.grid-1 img:nth-child(3){grid-area:1/3/3/4}.c-library__photo-grid.grid-1 img:nth-child(5){grid-column:2/4}.c-library__photo-grid.grid-2{grid-template-columns:50% 50%;grid-template-rows:var(--space-2xl)300px 300px}.c-library__photo-grid.grid-2 div{grid-column:1/2}.c-library__photo-grid.grid-2 img:nth-child(2){grid-row:2/4}.c-library__photo-grid.grid-2 img:nth-child(3){grid-row:1/3}}.c-library__illustration-grid{gap:var(--gutter);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.c-library__illustration-grid :nth-child(2n+1):nth-last-child(5){grid-column:1/-1}.c-library .c-alert ul li{margin-left:1em;padding-left:.5rem;list-style:outside url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"20\" viewBox=\"0 0 10 20\"><circle cx=\"5\" cy=\"14\" r=\"3.5\" fill=\"%2313AA13\" fill-rule=\"evenodd\"/></svg>")}.c-library .c-alert ul li h3,.c-library .c-alert ul li h4{color:#13aa13;font-size:1em;line-height:1.6}@media only screen and (max-width:1050px){.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__logo-name span:nth-last-child(2){letter-spacing:-.02em;font-size:21.6px;font-size:var(--step-1)}.c-library__header nav li:last-child{display:none}}@media only screen and (min-width:650px) and (max-width:700px),screen and (max-width:450px){.c-library__header nav .u-row{gap:9px;gap:var(--space-2xs);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}}@media only screen and (max-width:650px){.c-library__header nav a{padding:9px 0;padding:var(--space-2xs)0;display:block}.c-library__header .c-library-page-active:after{bottom:4.5px;bottom:var(--space-3xs)}}
|
2
2
|
/*# sourceMappingURL=library.css.map */
|