@swisspost/design-system-styles 9.13.0 → 9.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_svg-icon-map.scss +12 -2
- package/components/stepper.css +1 -1
- package/components/stepper.scss +121 -22
- package/index.css +1 -1
- package/intranet.css +1 -1
- package/package.json +3 -3
- package/post-external.css +1 -1
- package/post-internal.css +1 -1
- package/tokens/temp/_channel.scss +1 -1
- package/tokens/temp/_components.scss +1 -1
- package/tokens/temp/_core.scss +1 -1
- package/tokens/temp/_device.scss +1 -1
- package/tokens/temp/_index.scss +1 -1
- package/tokens/temp/_mode.scss +1 -1
- package/tokens/temp/_theme.scss +1 -1
package/_svg-icon-map.scss
CHANGED
|
@@ -561,6 +561,16 @@ $svg-icon-map: (
|
|
|
561
561
|
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.6 24h-9.7v-1.5c4-3.5 7.8-7.6 7.8-10.3 0-4.2-6.3-2.4-6.9-2l-.3-1.4c.6-.3 8.8-3.1 8.8 3.4 0 3.8-7.3 10.1-7.8 10.4h8.1z'/%3E%3C/svg%3E",
|
|
562
562
|
'3000':
|
|
563
563
|
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Crect/%3E%3Cpath d='M17.4 8.2V24h-1.6V9.9c-.2.2-.5.5-.9.8-.3.3-.7.6-1 .9l-.9.8-.8-1L16 8.2z'/%3E%3C/svg%3E",
|
|
564
|
+
'2801':
|
|
565
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.62 5.68c1.45 0 2.62-1.18 2.62-2.63S10.07.41 8.62.41 6 1.59 6 3.04s1.18 2.63 2.62 2.63Zm0-3.93c.71 0 1.29.58 1.29 1.3s-.58 1.3-1.29 1.3-1.29-.58-1.29-1.3.58-1.3 1.29-1.3m6.8 14.44h-3.51v-5.91c0-1.82-1.48-3.3-3.29-3.3s-3.29 1.48-3.29 3.3v4.15a9.23 9.23 0 0 0-5.29 8.35c0 5.11 4.14 9.26 9.24 9.26 2.9 0 5.56-1.35 7.29-3.6l.34 1.31 3.82-.91-2.83-10.79a2.59 2.59 0 0 0-2.48-1.86M9.28 30.7c-4.36 0-7.91-3.56-7.91-7.93a7.91 7.91 0 0 1 3.96-6.86v2.91c0 1.82 1.48 3.3 3.29 3.3h.67v-1.97h5.11l1.72 6.56c-1.41 2.46-3.99 3.98-6.84 3.98Zm8.59-2.55-2.45-9.33H9.28v-8.54H7.95v10.4c-.75-.27-1.29-1-1.29-1.85v-8.55c0-1.08.88-1.96 1.96-1.96s1.96.88 1.96 1.96v7.24h4.84c.55 0 1.05.37 1.2.88l2.48 9.45-1.23.29ZM32.04 4.68v-.37h-.69V3c0-1.47-1.17-2.97-2.96-2.97h-6.66c-.83 0-1.58.28-2.13.83s-.83 1.3-.83 2.14v1.31h-.67v2.97h.67v6.48h3.7v-1.11h5.18v1.1h3.7V7.28h.69zM20.11 3c0-.34.08-.83.44-1.19s.85-.44 1.19-.44h6.66c1.01 0 1.63.85 1.63 1.63v4.31h-9.92zm-.01 8.08V8.64h9.92v2.44z'/%3E%3C/svg%3E",
|
|
566
|
+
'2800':
|
|
567
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 5.34c1.47 0 2.67-1.19 2.67-2.66S15.47.02 14 .02s-2.67 1.19-2.67 2.66S12.52 5.34 14 5.34m0-3.99a1.33 1.33 0 1 1 .001 2.659A1.33 1.33 0 0 1 14 1.35m12.3 27.43-2.88-10.91a2.625 2.625 0 0 0-2.51-1.88h-3.58V10c0-1.84-1.5-3.33-3.33-3.33S10.67 8.16 10.67 10v4.21c-3.27 1.55-5.37 4.8-5.37 8.44 0 5.16 4.21 9.36 9.37 9.36 2.95 0 5.65-1.38 7.41-3.65l.35 1.34zM12 10c0-1.1.9-2 2-2s2 .9 2 2v7.32h4.91c.57 0 1.07.38 1.23.9l2.52 9.57-1.27.3-2.49-9.44h-6.24V9.99h-1.33v10.54A1.98 1.98 0 0 1 12 18.65V9.99Zm2.67 20.68c-4.43 0-8.04-3.6-8.04-8.03 0-2.91 1.56-5.54 4.04-6.96v2.96c0 1.84 1.5 3.33 3.33 3.33h.67v-2h5.21l1.75 6.65c-1.44 2.49-4.06 4.04-6.96 4.04Zm-13.34-.04h6.1v1.33H0V.02h7.43v1.33h-6.1v29.3ZM32 .02v31.96h-7.43v-1.33h6.1V1.35h-6.1V.02z'/%3E%3C/svg%3E",
|
|
568
|
+
'2799':
|
|
569
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m10.82 7.97-1.3-1.3h1.15c.37 0 .67.3.67.67 0 .32-.22.57-.52.64ZM14.84 12h5.07l-1.79 3.28.98.98 1.66-3.04 1.61 2.69a6.1 6.1 0 0 0-1.67 1.96l1.01 1.01c.3-.71.76-1.34 1.35-1.82L25.42 21a.657.657 0 0 0 .91.22c.32-.19.42-.6.23-.91l-2.38-3.96a4.675 4.675 0 0 1 6.47 4.31c0 1.94-1.19 3.6-2.87 4.31l.98.98c1.91-1 3.22-2.98 3.22-5.29 0-3.31-2.69-6-6-6-.89 0-1.73.21-2.49.56l-4.26-7.1.07-.12h4.02a.67.67 0 0 1 0 1.34.67.67 0 0 0 0 1.34c1.1 0 2-.9 2-2s-.9-2-2-2H19.3c-.51 0-.97.27-1.23.72-.25.45-.25.98.02 1.42l1.12 1.86H13.5l1.33 1.33Zm16.22 20-5.37-5.37c-3.06-.16-5.5-2.6-5.66-5.66l-2.26-2.26-.32.58c.34.36.55.84.55 1.37 0 1.1-.9 2-2 2-.87 0-1.6-.56-1.88-1.33h-2.19c-.34 3-2.85 5.33-5.93 5.33-3.31 0-6-2.68-6-5.99s2.69-6 6-6a6 6 0 0 1 2.24.44l1.75-3.25-1.46-2.4L7.07 8h-.39a.67.67 0 0 1-.67-.67c0-.11.03-.21.08-.31L0 .94.94 0l6.67 6.67h.02l1.91 1.92.03.05 2.03 2.03h.02L12.95 12h-.01l4.51 4.51.98.98 1.74 1.75 1.18 1.19 10.64 10.64-.94.94ZM10.6 21.33H6c-.23 0-.45-.12-.57-.32a.65.65 0 0 1-.01-.66L7.6 16.3c-.5-.18-1.03-.3-1.59-.3a4.669 4.669 0 1 0 0 9.34c2.34 0 4.27-1.74 4.6-4Zm0-1.33a4.66 4.66 0 0 0-1.83-3.07L7.12 20zm3.94-.69-3.75-6.13-1.38 2.56c1.39.96 2.32 2.5 2.52 4.26h2.19q.135-.39.42-.69m2.13 1.36a.67.67 0 1 0-1.34 0 .67.67 0 0 0 1.34 0m.11-2.94-4.24-4.24 3.19 5.21c.09-.01.18-.03.28-.03.09 0 .17.01.26.03l.53-.97Zm7.05 7.04-1.94-1.94c.44.83 1.11 1.5 1.94 1.94'/%3E%3C/svg%3E",
|
|
570
|
+
'2798':
|
|
571
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.56 9.16V2.52H2.92v6.64h6.63Zm-5.3-1.33V6.5h3.97v1.33zm3.97-3.97v1.3H4.26v-1.3zm11.9 5.3V2.52H13.5v6.64zm-5.3-1.33V6.5h3.97v1.33zm3.97-3.97v1.3h-3.97v-1.3zm11.91 5.3V2.52h-6.63v6.64zm-5.3-1.33V6.5h3.97v1.33zm3.97-3.97v1.3h-3.97v-1.3zM32 0H0v11.68h5.57v3.86H0v1.33h9.9v8.63H0v1.33h9.9v1.89H0v1.33h11.24l.74-.02c.37 1.13 1.42 1.96 2.67 1.96s2.34-.85 2.69-2.01l1.69-.02c.64 0 1.16-.17 1.16-1.43v-1.56H32v-1.33h-1.66v-5.27h-5.27v5.27h-2.04V11.67h8.98v-1.33H1.34V1.33H32zM6.91 15.54v-3.86h14.78v13.97h-1.5v-.16l-.79-3.17c-.27-1.36-.76-2.26-1.36-2.69-.03-.02-.05-.04-.08-.06-.08-.05-.16-.09-.25-.13l-.15-.06c-.13-.04-.27-.06-.41-.06h-5.91v-3.79H6.91Zm9.07 5.12h1.17s.03 0 .05.01c.12.05.47.36.91 2.12l.15.56h-2.28v-2.7Zm-1.33 10.01c-.82 0-1.49-.67-1.49-1.49s.67-1.49 1.49-1.49 1.49.67 1.49 1.49-.67 1.49-1.49 1.49m4.21-2.12v.09l-1.44.02c-.25-1.3-1.39-2.3-2.77-2.3s-2.55 1.02-2.77 2.35h-.64v-8.05h3.41v4.04h3.97l.24.96zm7.53-6.83h2.6v3.93h-2.6z'/%3E%3C/svg%3E",
|
|
572
|
+
'2797':
|
|
573
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m31.36 10.39-3.33 2.65v4.64l3.33-2.65zm-1.33 4-.67.53v-1.24l.67-.53zM32 0H8.8L3.45 3.41h-.02v19.52c-.18.16-.34.33-.49.51h-.02L.86 26.1c-.53.63-.87 1.42-.87 2.3 0 1.98 1.62 3.58 3.61 3.58h23.46l4.93-3.6v-1.62l-4.87 3.4V4.75l4.87-3.4V0ZM5.78 23.37h1.38L5.7 24.82H3.67c.33-.84 1.14-1.45 2.1-1.45ZM4.2 29.01h19.18v1.6l-19.77.05c-1.25 0-2.27-1.01-2.27-2.26 0-.54.2-1.02.51-1.41S2 26.8 2 26.8c.41-.41.98-.66 1.6-.66l19.79-.02v1.56H4.19c-.37 0-.67.3-.67.66s.3.66.67.66Zm3.39-4.19 1.45-1.45h.87v1.44H7.59Zm13.87-.01 1.44-1.44h.5v1.44zm1.92-2.76h-3.13v-5.7h-6.17v-2.21h9.31v7.91Zm-3.41 1.32h1.05l-1.45 1.44h-1.05zm-2.65.76v-4.26l1.59-1.36v4.04zm.53-6.46-1.29 1.11h-4.28l1.25-1.11h4.33Zm-1.86 2.43v4.71h-4.74V20.1zm9.8 10.52h-1.08V12.81H12.74v3.78L9.91 19.1v2.95H5.78c-.35 0-.69.07-1.01.16V4.75H25.8v25.87Zm.94-27.21H5.92l3.27-2.09h20.53zM24.38 6.4h-4.67v4.64h4.67zm-1.34 3.32h-2V7.73h2zm4.99 14.59 3.33-2.65v-4.64l-3.33 2.65zm1.33-4 .67-.53v1.24l-.67.53zM17.74 6.4h-4.67v4.64h4.67zM16.4 9.72h-2V7.73h2zM11.09 6.4H6.42v4.64h4.67zM9.76 9.72h-2V7.73h2zm6.75 8.73h-1.15l.72-.58h1.15zm-5.42-5.42H6.42v4.64h4.67zm-1.33 3.32h-2v-1.99h2zm21.6-12.6L28.03 6.4v4.64l3.33-2.65zm-1.33 4.01-.67.53V7.05l.67-.53z'/%3E%3C/svg%3E",
|
|
564
574
|
'2796':
|
|
565
575
|
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M32 30.67V32H0v-1.33h24.97c2.03-5.5.86-9.46.14-11.11-3.33 1.25-3.31 4.62-3.31 4.77l-.6.02v-2.98c.42-.84 1.08-1.71 2.1-2.39-.79-.18-1.5-.13-2.1.07v-1.39c.96-.23 2.07-.19 3.26.29-.85-1.85-2.31-2.48-3.26-2.7V13.9c1.05.19 2.73.77 3.91 2.51.6-1.3 1.92-2.6 4.5-2.6v1.33c-3.07 0-3.52 2.22-3.59 2.84 3.27-.35 5.84 2.1 5.95 2.22l-.93.96s-2.09-1.95-4.6-1.86c.8 1.94 1.79 5.93-.08 11.38h5.63ZM7.94 0H6.61v3.37h1.33zM3.61 5.17.69 3.48.03 4.64l2.92 1.69.67-1.15ZM.09 11.5l.67 1.15 2.92-1.69-.67-1.15zm6.64 4.54h1.33v-3.37H6.73zm7.85-11.51-.67-1.15-2.92 1.69.67 1.15zM3.39 8.02c0-2.18 1.76-3.94 3.94-3.94s3.94 1.76 3.94 3.94c0 .68-.19 1.31-.49 1.87-1.22.03-2.23.85-2.58 1.96-.28.06-.57.1-.87.1-2.18 0-3.94-1.76-3.94-3.94Zm1.34 0c0 1.44 1.17 2.61 2.61 2.61s2.61-1.17 2.61-2.61-1.17-2.61-2.61-2.61-2.61 1.17-2.61 2.61m6.13 3.2h7.56c.8 0 1.46.65 1.46 1.46v15.05c0 .8-.65 1.46-1.46 1.46h-7.56c-.8 0-1.46-.65-1.46-1.46V12.68c0-.8.65-1.46 1.46-1.46m7.68 16.5v-2.19h-7.81v2.19c0 .07.06.12.12.12h7.56c.07 0 .12-.06.12-.12Zm-.12-15.17h-7.56c-.07 0-.12.06-.12.12v11.52h7.81V12.67c0-.07-.06-.12-.12-.12Zm-4.5 14.78h1.5V26h-1.5zm4.03-5.01h-6.67v-6h.65v-.57c0-1.51 1.2-2.74 2.68-2.74s2.68 1.23 2.68 2.74v.57h.65v6Zm-4.68-6h2.69v-.57c0-.78-.6-1.41-1.35-1.41s-1.35.63-1.35 1.41v.57Zm3.34 1.33h-4v3.33h4zm-2 2.53c.37 0 .67-.3.67-.67v-.42a.67.67 0 0 0-1.34 0v.42c0 .37.3.67.67.67'/%3E%3C/svg%3E",
|
|
566
576
|
'2795':
|
|
@@ -1308,11 +1318,11 @@ $svg-icon-map: (
|
|
|
1308
1318
|
'2423':
|
|
1309
1319
|
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.49 31.565h17.32c1.473 0 2.667-1.177 2.667-2.628V5.917c0-1.451-1.194-2.628-2.667-2.628l-.003-.6c-.006-1.38-1.022-2.4-2.325-2.4q-.145 0-.294.017L3.615 2.456a.184.184 0 0 0-.158.181l.122 29.217zM22.343 1.61a1 1 0 0 1 .14-.008c.58 0 .988.45.99 1.092l.101 24.172c.004.82-.646 1.588-1.42 1.677L4.908 30.54 4.795 3.642zm3.8 27.326c0 .724-.598 1.314-1.333 1.314h-5.97l3.47-.402c1.44-.167 2.604-1.504 2.597-2.988l-.092-22.257c.733.003 1.328.59 1.328 1.313zM10.664 6.016l-.156-1.305 8.875-1.028.156 1.305zM8.798 8.692l-.155-1.305 10.75-1.244.156 1.305zm10.606-.089.156 1.305-7 .81-.156-1.305zm.087 3.113-3.583.415.01 2.46-2.39.276.016 3.69 2.39-.276.01 2.46 3.583-.415-.01-2.46 2.389-.276-.015-3.69-2.39.276zm1.072 3.66.005 1.045-1.207.14-1.182.137.005 1.173.005 1.287-.918.106-.004-.989-.007-1.47-1.482.17-.907.106-.004-1.046 1.206-.14 1.183-.136-.005-1.174-.005-1.286.918-.107.004.99.006 1.47 1.483-.171zm-8.173 13.16 9.557-1.106-.026-6.15-9.556 1.106zm6.476-4.488a1.7 1.7 0 0 0-.442-.613 1.7 1.7 0 0 0-.644-.353l2.814-.326.005 1.092zm-1.783 1.438a.4.4 0 0 1-.31-.087.47.47 0 0 1-.145-.356c-.002-.342.28-.675.6-.712l.057-.004q.149 0 .254.091a.46.46 0 0 1 .145.354c0 .343-.28.677-.601.714m-3.38-1.932 2.683-.31a2.05 2.05 0 0 0-.98 1.205l-1.698.197zm.01 2.414 1.732-.201c.102.235.251.446.444.615.204.178.447.28.703.345l-2.874.332zm6.896.294-2.677.31c.469-.251.812-.691.973-1.204l1.7-.197z'/%3E%3C/svg%3E",
|
|
1310
1320
|
'2422':
|
|
1311
|
-
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 1.
|
|
1321
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 1.33H1.98a.67.67 0 0 0 0 1.34h3.35v28h5.33c.23-.87.66-1.69 1.34-2.37 1.03-1.03 2.51-1.54 3.99-1.54s2.96.51 3.99 1.54c.68.68 1.11 1.5 1.34 2.37h5.33v-28h3.33a.67.67 0 0 0 0-1.34Zm-4.67 28h-3.06c-.32-.74-.77-1.41-1.34-1.98-1.23-1.23-3.03-1.93-4.93-1.93s-3.71.7-4.93 1.93c-.57.57-1.02 1.23-1.34 1.98H6.67V2.67h18.67v26.67ZM8.9 18.67l1.53-2.39-1.37-2.26h1.45l.34.62c.09.16.17.32.26.49.08.16.15.31.21.44.03-.07.07-.14.1-.22l.12-.24c.04-.08.08-.17.12-.24.04-.08.08-.15.11-.22l.34-.63h1.35l-1.36 2.19 1.49 2.46H12.1l-.39-.73c-.04-.07-.08-.15-.13-.24-.04-.09-.09-.17-.13-.26s-.08-.17-.12-.25-.06-.14-.08-.19c-.02.05-.05.11-.09.19s-.08.16-.13.24c-.05.09-.09.17-.14.26s-.09.17-.13.24l-.41.73H8.92Zm6.69-4.04c.09.16.17.32.26.49.08.16.15.31.21.44.03-.07.07-.14.1-.22l.12-.24c.04-.08.08-.17.12-.24.04-.08.08-.15.11-.22l.34-.63h1.35l-1.36 2.19 1.49 2.46h-1.49l-.39-.73c-.04-.07-.08-.15-.13-.24-.04-.09-.09-.17-.13-.26s-.08-.17-.12-.25-.06-.14-.08-.19c-.02.05-.05.11-.09.19s-.08.16-.13.24c-.05.09-.09.17-.14.26s-.09.17-.13.24l-.41.73h-1.43l1.53-2.39L13.82 14h1.45l.34.62Zm2.95-.62h1.45l.34.62c.09.16.17.32.26.49.08.16.15.31.21.44.03-.07.07-.14.1-.22l.12-.24c.04-.08.08-.17.12-.24.04-.08.08-.15.11-.22l.34-.63h1.35l-1.36 2.19 1.49 2.46h-1.49l-.39-.73c-.04-.07-.08-.15-.13-.24-.04-.09-.09-.17-.13-.26s-.08-.17-.12-.25-.06-.14-.08-.19c-.02.05-.05.11-.09.19s-.08.16-.13.24c-.05.09-.09.17-.14.26s-.09.17-.13.24l-.41.73H18.4l1.53-2.39L18.56 14ZM10 21.33h1.33v1.33H10zm-1.33 1.34H7.34v-1.33h1.33zm4-1.34H14v1.33h-1.33zm2.66 0h1.33v1.33h-1.33zm2.67 0h1.33v1.33H18zm2.67 0H22v1.33h-1.33zm4 1.34h-1.33v-1.33h1.33zM13.66 9.14h-1.42V7.12h1.42V5.64h2.1v1.95h-.5V6.11h-1.1v1.48h-1.42v1.09h1.42v1.48h1.1V8.68h.5v1.95h-2.1V9.15Zm3.74 0h.81c.99 0 1.76-.76 1.76-1.73s-.78-1.77-1.76-1.77h-2.16v4.99h1.35V9.15Zm0-2.32h.56c.38 0 .66.25.66.59s-.29.63-.66.63h-.56z'/%3E%3C/svg%3E",
|
|
1312
1322
|
'2421':
|
|
1313
1323
|
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.367 29.727c-.374.34-.79.717-1.246 1.174l-.943-.942c.473-.474.904-.866 1.29-1.218 1.639-1.49 2.293-2.127 2.18-5.327h-.017V10.416a1.129 1.129 0 0 0-2.257 0v7.356h-1.338V6.732a1.129 1.129 0 0 0-2.257 0l-.003 11.044h-1.334l.003-7.524V3.806a1.125 1.125 0 0 0-2.248 0v1.281c.002.031.012.063.012.094l-.016 12.246-1.333-.002.01-7.173h-.007V5.15c-.032-.215-.457-.733-1.115-.733a1.13 1.13 0 0 0-1.129 1.128l-.006 15.739H10.28l.002-6.074h-.012a2.16 2.16 0 0 0-2.155-2.155h-.101v8.308l-.002 2.12c-.134 3.195.886 4.14 2.429 5.573.303.281.622.577.948.904l-.942.942a35 35 0 0 0-.913-.87c-1.617-1.5-3.014-2.795-2.855-6.578l.001-2.157V11.72h1.435c.823 0 1.57.3 2.168.778l.003-6.954a2.464 2.464 0 0 1 2.462-2.462c.425 0 .815.115 1.16.29A2.46 2.46 0 0 1 16.32 1.35a2.46 2.46 0 0 1 2.457 2.457v.753c.34-.178.72-.288 1.13-.288a2.464 2.464 0 0 1 2.461 2.462v1.511a2.44 2.44 0 0 1 1.133-.29 2.464 2.464 0 0 1 2.462 2.462v12.462c.23 4.091-.63 5.057-2.597 6.849'/%3E%3C/svg%3E",
|
|
1314
1324
|
'2420':
|
|
1315
|
-
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='
|
|
1325
|
+
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.27-.04c-.23.86-.66 1.68-1.34 2.36-1.03 1.03-2.51 1.54-3.99 1.54s-2.96-.51-3.99-1.54c-.68-.68-1.11-1.5-1.34-2.36H5.28v32h5.33c.23-.86.66-1.68 1.34-2.36 1.03-1.03 2.51-1.54 3.99-1.54s2.96.51 3.99 1.54c.68.68 1.11 1.5 1.34 2.36h5.33v-32zm4 8.79v21.88h-3.06c-.32-.74-.77-1.4-1.34-1.97-1.23-1.22-3.03-1.93-4.93-1.93s-3.71.7-4.93 1.93c-.57.57-1.02 1.23-1.34 1.97H6.61V1.29h3.06c.32.74.77 1.4 1.34 1.97 1.23 1.22 3.03 1.93 4.93 1.93s3.71-.7 4.93-1.93c.57-.57 1.02-1.23 1.34-1.97h3.06zM12.95 16.6l1.16 1.91h-1.16l-.31-.57c-.03-.06-.06-.12-.1-.18-.04-.07-.07-.14-.1-.2-.03-.07-.07-.13-.09-.19a1 1 0 0 1-.06-.15c-.02.04-.04.09-.07.14-.03.06-.07.12-.1.19-.04.07-.07.14-.11.2s-.07.13-.1.19l-.32.57h-1.12l1.19-1.86-1.07-1.76h1.13l.26.48c.07.12.14.25.2.38s.12.24.16.34c.02-.05.05-.11.08-.17s.06-.12.09-.19.06-.13.09-.19.06-.12.09-.17l.27-.49h1.06l-1.06 1.71Zm3.71 0 1.16 1.91h-1.16l-.31-.57c-.03-.06-.06-.12-.1-.18-.04-.07-.07-.14-.1-.2-.03-.07-.07-.13-.09-.19a1 1 0 0 1-.06-.15c-.02.04-.04.09-.07.14-.03.06-.07.12-.1.19-.04.07-.07.14-.11.2s-.07.13-.1.19l-.32.57h-1.12l1.19-1.86-1.07-1.76h1.13l.26.48c.07.12.14.25.2.38s.12.24.16.34c.02-.05.05-.11.08-.17s.06-.12.09-.19.06-.13.09-.19.06-.12.09-.17l.27-.49h1.05l-1.06 1.71Zm4.86 1.91h-1.16l-.31-.57c-.03-.06-.06-.12-.1-.18-.03-.07-.07-.14-.1-.2-.03-.07-.07-.13-.09-.19a1 1 0 0 1-.06-.15c-.02.04-.04.09-.07.14-.03.06-.07.12-.1.19-.04.07-.07.14-.11.2s-.07.13-.1.19l-.32.57h-1.12l1.19-1.86L18 14.89h1.13l.27.48c.07.12.14.25.2.38s.12.24.16.34c.02-.05.05-.11.08-.17s.06-.12.09-.19.06-.13.09-.19.06-.12.09-.17l.27-.49h1.05l-1.06 1.71 1.16 1.91ZM10 21.33h1.33v1.33H10zm-2.67 0h1.33v1.33H7.33zm5.34 0H14v1.33h-1.33zm2.66 0h1.33v1.33h-1.33zm2.67 0h1.33v1.33H18zm2.67 0H22v1.33h-1.33zm4 1.33h-1.33v-1.33h1.33zM13.9 10.87h-1.27V9.06h1.27V7.74h1.88v1.74h-.45V8.16h-.98v1.32h-1.27v.97h1.27v1.32h.98v-1.32h.45v1.74H13.9zm3.35 0h.72c.89 0 1.57-.67 1.57-1.55s-.7-1.58-1.57-1.58h-1.93v4.45h1.21zm0-2.06h.5c.34 0 .59.22.59.52s-.26.56-.59.56h-.5V8.8Z'/%3E%3C/svg%3E",
|
|
1316
1326
|
'2419':
|
|
1317
1327
|
"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.333 4H4.667v7.333h12.666zM16 10H6V5.333h10zm1.333 4H4.667v-1.333h12.666zm5.334-.667a9.4 9.4 0 0 0-2 .22V1.334H1.333v23.334h12.22C14.47 28.859 18.2 32 22.668 32a9.333 9.333 0 0 0 0-18.667m-20 10V2.667h16.666v11.29a9.3 9.3 0 0 0-2.428 1.376H4.667v1.334h10.855a9.4 9.4 0 0 0-.93 1.333H4.667v1.333h9.29a9 9 0 0 0-.403 1.334H4.667V22h8.7c-.016.221-.034.442-.034.667s.018.445.034.666zm20 7.334c-4.412 0-8-3.59-8-8s3.588-8 8-8 8 3.588 8 8-3.59 8-8 8m4.83-12.01c.322.32.502.754.503 1.218 0 .465-.181.901-.51 1.23l-3.112 3.114a1.734 1.734 0 0 1-2.456 0l-.405-.426.966-.92.393.415c.147.147.4.146.559-.012l3.113-3.115a.4.4 0 0 0 .001-.567l-.794-.815a.4.4 0 0 0-.562.007l-1.772 1.77-.943-.943 1.772-1.77c.328-.329.764-.51 1.228-.51h.001c.464.002.899.181 1.227.51zm-5.629 6.277.943.942-1.728 1.73c-.338.338-.784.506-1.228.506s-.889-.168-1.226-.507l-.793-.815a1.72 1.72 0 0 1-.503-1.218c0-.465.181-.901.51-1.23l3.113-3.114a1.74 1.74 0 0 1 2.455 0l.614.637-.959.924-.605-.628a.4.4 0 0 0-.563.01l-3.113 3.114a.4.4 0 0 0-.001.568l.794.816a.403.403 0 0 0 .564-.008z'/%3E%3C/svg%3E",
|
|
1318
1328
|
'2418':
|
package/components/stepper.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.stepper-container{margin-bottom:1.25rem}@media(min-width: 780px){.stepper-container{margin-bottom:2rem}}@media(min-width: 1280px){.stepper-container{margin-bottom:2.5rem}}.stepper-container>.stepper-bar{display:none}.stepper{counter-reset:step-index;margin:0;padding:0;list-style:none;display:grid;position:relative;overflow-y:hidden;overflow-x:auto;grid-template-columns:1.25rem;grid-auto-columns:minmax(2.5rem, 1fr);padding-inline-end:1.25rem}.stepper-item{grid-row:1;position:relative}.stepper-item:not(:first-child){padding-inline-start:.5rem}.stepper-item:not(:last-child){padding-inline-end:.5rem;grid-column:span 2}.stepper-item::before,.stepper-item::after{content:"";display:block;position:absolute;inset-block-start:1.125rem;height:.25rem;background-color:#999;inset-inline:0}.stepper-item:not(:first-child,:last-child)::before{inset-inline-end:50%}.stepper-item:not(:first-child,:last-child)::after{inset-inline-start:50%}.stepper-item:not(.stepper-item[aria-current=step]~*,:first-child)::before,.stepper-item:not([aria-current=step],.stepper-item[aria-current=step]~*)::after{background-color:#fc0;z-index:1}.stepper-link{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;position:relative;z-index:2;overflow:hidden;text-decoration:none;color:var(--post-gray-60);width:fit-content;line-height:1.2;word-break:break-word}.stepper-link:not([title]){-webkit-line-clamp:initial}.stepper-item:not(:first-child,:last-child)>.stepper-link{margin-inline:auto;text-align:center}.stepper-item:last-child>.stepper-link{margin-inline-start:auto;margin-inline-end:-1.25rem;text-align:end}.stepper-item[aria-current=step]>.stepper-link{color:var(--post-gray-80);font-weight:700}.stepper-link::before{content:counter(step-index);display:flex;align-items:center;counter-increment:step-index;justify-content:center;z-index:1;height:2.5rem;width:2.5rem;box-sizing:border-box;margin-block-end:.5rem;color:#000;background-color:#fc0;border:.25rem solid rgb(var(--post-bg-rgb, 255 255 255));border-radius:50%;font-weight:700;text-indent:initial;transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1),background-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}.stepper-item:not(:first-child,:last-child)>.stepper-link::before{margin-inline:auto}.stepper-item:last-child>.stepper-link::before{margin-inline-start:auto}.stepper-item:not([aria-current=step],.stepper-item[aria-current=step]~*)>.stepper-link::before{color:rgba(0,0,0,0)}.stepper-item[aria-current=step]~.stepper-item>.stepper-link::before{color:#fff;background-color:#666}.stepper-link::after{mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;display:block;position:absolute;top:.5rem;z-index:1;height:1.5rem;width:1.5rem;transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1),background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);color:#000}.stepper-item:first-child>.stepper-link::after{left:.5rem}.stepper-item:not(:first-child,:last-child)>.stepper-link::after{left:calc(50% - 0.75rem)}.stepper-item:last-child>.stepper-link::after{right:.5rem}.stepper-item:not([aria-current=step],.stepper-item[aria-current=step]~*)>.stepper-link::after{content:""}.stepper-link:is(a[href]){outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){color:var(--post-gray-60)}.stepper-item[aria-current=step]>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){color:var(--post-gray-80)}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before,.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{color:var(--post-contrast-color-inverted);background-color:var(--post-contrast-color)}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::after{color:var(--post-contrast-color-inverted)}@supports not selector(:has(:focus-visible)){.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){color:var(--post-gray-60)}.stepper-item[aria-current=step]>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){color:var(--post-gray-80)}.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before,.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{color:var(--post-contrast-color-inverted);background-color:var(--post-contrast-color)}.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::after{color:var(--post-contrast-color-inverted)}}.stepper-link:is(a[href]):hover{color:var(--post-gray-60)}.stepper-item[aria-current=step]>.stepper-link:is(a[href]):hover{color:var(--post-gray-80)}.stepper-link:is(a[href]):hover::before,.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):hover::before{color:var(--post-contrast-color-inverted);background-color:var(--post-contrast-color)}.stepper-link:is(a[href]):hover::after{color:var(--post-contrast-color-inverted)}@media(max-width: 599.98px){.stepper-item:first-child,.stepper-item:last-child{padding-inline:0}.stepper-item[aria-current=step]{display:contents}.stepper-item[aria-current=step]>.stepper-link{display:contents}.stepper-item[aria-current=step]::before{grid-row:-1;margin-block-start:1.125rem;position:static}.stepper-item[aria-current=step]:not(:last-child)>.stepper-link::before{grid-row:-1}.stepper-item[aria-current=step]:not(:first-child,:last-child)::after{inset-inline-start:0}.stepper-item:not([aria-current=step]){grid-row:-1;justify-self:stretch}.stepper-item:not([aria-current=step])>.stepper-link{-webkit-line-clamp:initial;line-height:0;text-indent:100%;height:2.5rem}.stepper-link{white-space:nowrap;width:100%;overflow:hidden}.stepper-item[aria-current=step]:first-child>.stepper-link::before{order:-1}.stepper-item[aria-current=step]:not(:first-child,:last-child)>.stepper-link::before{margin-inline-start:0;transform:translateX(-50%)}.stepper-item[aria-current=step]:last-child>.stepper-link::before{position:absolute;z-index:2;inset-block-start:0;inset-inline-end:0}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.stepper-item::before,.stepper-item::after{background-color:CanvasText}.stepper-item:not(.stepper-item[aria-current=step]~.stepper-item,:first-child)::before,.stepper-item:not([aria-current=step]:not(:last-child),.stepper-item[aria-current=step]~*)::after{background-color:Highlight}.stepper-link::before{forced-color-adjust:none}.stepper-item[aria-current=step]>.stepper-link::before{background-color:Canvas;color:CanvasText}.stepper-item[aria-current=step]~.stepper-item>.stepper-link::before,.stepper-item:not([aria-current=step])>.stepper-link::before{color:Canvas;border-color:Canvas;background-color:CanvasText}.stepper-link::after{color:Canvas}.stepper-item[aria-current=step]>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{border-color:Highlight}@supports not selector(:has(:focus-visible)){.stepper-item[aria-current=step]>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{border-color:Highlight}}.stepper-item[aria-current=step]>.stepper-link:is(a[href]):hover::before{border-color:Highlight}.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href])::before{color:Canvas}.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{background-color:Highlight;color:HighlightText}@supports not selector(:has(:focus-visible)){.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{background-color:Highlight;color:HighlightText}}.stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):hover::before{background-color:Highlight;color:HighlightText}.stepper-item:not([aria-current=step])>.stepper-link:is(a[href])::before{background-color:LinkText}.stepper-item:not([aria-current=step])>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{background-color:Highlight}.stepper-item:not([aria-current=step])>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::after{color:HighlightText}@supports not selector(:has(:focus-visible)){.stepper-item:not([aria-current=step])>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{background-color:Highlight}.stepper-item:not([aria-current=step])>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::after{color:HighlightText}}.stepper-item:not([aria-current=step])>.stepper-link:is(a[href]):hover::before{background-color:Highlight}.stepper-item:not([aria-current=step])>.stepper-link:is(a[href]):hover::after{color:HighlightText}}
|
|
1
|
+
.stepper-container{margin-bottom:1.25rem}@media(min-width: 780px){.stepper-container{margin-bottom:2rem}}@media(min-width: 1280px){.stepper-container{margin-bottom:2.5rem}}.stepper-container>.stepper-bar{display:none}.stepper{counter-reset:step-index;margin:0;padding:0;list-style:none;display:grid;position:relative;overflow-y:hidden;overflow-x:auto;grid-template-columns:1.25rem;grid-auto-columns:minmax(2.5rem, 1fr);padding-inline-end:1.25rem}.stepper-item{grid-row:1;position:relative}.stepper-item:not(:first-child){padding-inline-start:.5rem}.stepper-item:not(:last-child){padding-inline-end:.5rem;grid-column:span 2}.stepper-item::before,.stepper-item::after{content:"";display:block;position:absolute;inset-block-start:1.125rem;height:.25rem;background-color:#999;inset-inline:0}.stepper-item:not(:first-child,:last-child)::before{inset-inline-end:50%}.stepper-item:not(:first-child,:last-child)::after{inset-inline-start:50%}.stepper-item:not(.stepper-item.stepper-item-current~*,:first-child)::before,.stepper-item:not(.stepper-item-current,.stepper-item.stepper-item-current~*)::after{background-color:#fc0;z-index:1}.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]::after{background-color:#999;z-index:auto}.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item::before,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item::after{background-color:#999;z-index:auto}.stepper-link{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;position:relative;z-index:2;overflow:hidden;text-decoration:none;color:var(--post-gray-60);width:fit-content;line-height:1.2;word-break:break-word}.stepper-link:not([title]){-webkit-line-clamp:initial}.stepper-item:not(:first-child,:last-child)>.stepper-link{margin-inline:auto;text-align:center}.stepper-item:last-child>.stepper-link{margin-inline-start:auto;margin-inline-end:-1.25rem;text-align:end}.stepper-item[aria-current=step]:not(.stepper-item-current~*)>.stepper-link{color:var(--post-gray-80);font-weight:700}.stepper-link::before{content:counter(step-index);display:flex;align-items:center;counter-increment:step-index;justify-content:center;z-index:1;height:2.5rem;width:2.5rem;box-sizing:border-box;margin-block-end:.5rem;color:#000;background-color:#fc0;border:.25rem solid rgb(var(--post-bg-rgb, 255 255 255));border-radius:50%;font-weight:700;text-indent:initial;transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1),background-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}.stepper-item:not(:first-child,:last-child)>.stepper-link::before{margin-inline:auto}.stepper-item:last-child>.stepper-link::before{margin-inline-start:auto}.stepper-item:not(.stepper-item-current:not([aria-current=step]),.stepper-item.stepper-item-current~*)>.stepper-link::before{color:rgba(0,0,0,0)}.stepper-item.stepper-item-current~.stepper-item>.stepper-link::before{color:#fff;background-color:#666}.stepper-item[aria-current]>.stepper-link::before{color:rgba(0,0,0,0);background-color:var(--post-gray-80)}.stepper-link::after{mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12.667 24.533-7.6-7.6 1.867-1.867 5.733 5.733 12.4-12.4 1.867 1.867z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;display:block;position:absolute;top:.5rem;z-index:1;height:1.5rem;width:1.5rem;transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1),background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);color:#000}.stepper-item:first-child>.stepper-link::after{left:.5rem}.stepper-item:not(:first-child,:last-child)>.stepper-link::after{left:calc(50% - 0.75rem)}.stepper-item:last-child>.stepper-link::after{right:.5rem}.stepper-item:not(.stepper-item-current:not([aria-current=step]),.stepper-item.stepper-item-current~*)>.stepper-link::after{content:""}.stepper-item[aria-current]>.stepper-link::after{mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M26 1.067 2.933 24.134l-1.6 6.533 6.533-1.6L30.933 6zM29.067 6l-1.733 1.733-3.067-3.067L26 2.933zM26.4 8.667 8.133 26.934l-3.067-3.067L23.333 5.6zM3.067 28.933l1.067-4L7.201 28z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;mask-size:16px;mask-repeat:no-repeat;mask-position:center;color:#fff}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .stepper-item[aria-current]>.stepper-link::after{color:#000}.stepper-item.stepper-item-current~.stepper-item::before,.stepper-item.stepper-item-current~.stepper-item::after,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item::before,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item::after{background-color:#999;z-index:auto}.stepper-item.stepper-item-current~.stepper-item>.stepper-link::before,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item>.stepper-link::before{color:#fff;background-color:#666}.stepper-item.stepper-item-current~.stepper-item>.stepper-link::after,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item>.stepper-link::after{content:none}.stepper-link:is(a[href]){outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){color:var(--post-gray-60)}.stepper-item.stepper-item-current>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus){color:var(--post-gray-80)}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before,.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{color:var(--post-contrast-color-inverted);background-color:var(--post-contrast-color)}.stepper-item[aria-current]>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{color:rgba(0,0,0,0);background-color:var(--post-gray-80)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .stepper-item[aria-current]>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{border-color:Canvas}.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::after{color:var(--post-contrast-color-inverted)}@supports not selector(:has(:focus-visible)){.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){color:var(--post-gray-60)}.stepper-item.stepper-item-current>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus){color:var(--post-gray-80)}.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before,.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{color:var(--post-contrast-color-inverted);background-color:var(--post-contrast-color)}.stepper-item[aria-current]>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{color:rgba(0,0,0,0);background-color:var(--post-gray-80)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .stepper-item[aria-current]>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{border-color:Canvas}.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::after{color:var(--post-contrast-color-inverted)}}.stepper-link:is(a[href]):hover{color:var(--post-gray-60)}.stepper-item.stepper-item-current>.stepper-link:is(a[href]):hover{color:var(--post-gray-80)}.stepper-link:is(a[href]):hover::before,.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href]):hover::before,.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current=step]~.stepper-item>.stepper-link:is(a[href]):hover::before{color:var(--post-contrast-color-inverted);background-color:var(--post-contrast-color)}.stepper-item[aria-current]>.stepper-link:is(a[href]):hover::before{color:rgba(0,0,0,0);background-color:var(--post-gray-80)}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .stepper-item[aria-current]>.stepper-link:is(a[href]):hover::before{border-color:Canvas}.stepper-link:is(a[href]):hover::after{color:var(--post-contrast-color-inverted)}@media(max-width: 599.98px){.stepper-item:first-child,.stepper-item:last-child{padding-inline:0}.stepper-item[aria-current=step]:not(.stepper-item-current~*){display:contents}.stepper-item[aria-current=step]:not(.stepper-item-current~*)>.stepper-link{display:contents}.stepper-item[aria-current=step]:not(.stepper-item-current~*)>.stepper-link::before,.stepper-item[aria-current=step]:not(.stepper-item-current~*)>.stepper-link::after{z-index:2}.stepper-item[aria-current=step]:not(.stepper-item-current~*)>.stepper-link::before{content:"";background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='1' fill='%23ffffff' d='M26 1.067 2.933 24.134l-1.6 6.533 6.533-1.6L30.933 6zM29.067 6l-1.733 1.733-3.067-3.067L26 2.933zM26.4 8.667 8.133 26.934l-3.067-3.067L23.333 5.6zM3.067 28.933l1.067-4L7.201 28z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:16px}.stepper-item[aria-current=step]:not(.stepper-item-current~*)>.stepper-link::after{content:none}.stepper-item[aria-current=step]:not(.stepper-item-current~*)::before{grid-row:-1;margin-block-start:1.125rem;position:static}.stepper-item[aria-current=step]:not(.stepper-item-current~*):not(:last-child)>.stepper-link::before{grid-row:-1}.stepper-item[aria-current=step]:not(.stepper-item-current~*):not(:first-child,:last-child)::after{inset-inline-start:0}.stepper-item:not([aria-current=step]){grid-row:-1;justify-self:stretch}.stepper-item:not([aria-current=step])>.stepper-link{-webkit-line-clamp:initial;line-height:0;text-indent:100%;height:2.5rem}.stepper-link{white-space:nowrap;width:100%;overflow:hidden}.stepper-item[aria-current=step]:first-child>.stepper-link::before{order:-1}.stepper-item[aria-current=step]:not(:first-child,:last-child)>.stepper-link::before{margin-inline-start:0;transform:translateX(-50%)}.stepper-item[aria-current=step]:last-child>.stepper-link::before{position:absolute;z-index:2;inset-block-start:0;inset-inline-end:0}}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.stepper-item::before,.stepper-item::after{forced-color-adjust:none}.stepper-item:not(.stepper-item.stepper-item-current~.stepper-item,:first-child)::before,.stepper-item:not(.stepper-item-current:not(:last-child),.stepper-item.stepper-item-current~*)::after{background-color:Highlight}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .stepper-item[aria-current=step]>.stepper-link::after{color:#fff}.stepper-link::before{forced-color-adjust:none}.stepper-item.stepper-item-current>.stepper-link::before{background-color:AccentColor;color:AccentColorText}:where(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .stepper-item.stepper-item-current>.stepper-link::before{border-color:Canvas}.stepper-item.stepper-item-current~.stepper-item>.stepper-link::before,.stepper-item:not(.stepper-item-current)>.stepper-link::before{color:Canvas;border-color:Canvas;background-color:GrayText}.stepper-link::after{color:Canvas}.stepper-item.stepper-item-current>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{background-color:Highlight;color:HighlightText}@supports not selector(:has(:focus-visible)){.stepper-item.stepper-item-current>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{background-color:Highlight;color:HighlightText}}.stepper-item.stepper-item-current>.stepper-link:is(a[href]):hover::before{background-color:Highlight;color:HighlightText}.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href])::before{color:Canvas;background-color:GrayText}.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{background-color:Highlight;color:HighlightText}@supports not selector(:has(:focus-visible)){.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{background-color:Highlight;color:HighlightText}}.stepper-item.stepper-item-current~.stepper-item>.stepper-link:is(a[href]):hover::before{background-color:Highlight;color:HighlightText}.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href])::before{background-color:LinkText}.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::before{background-color:Highlight}.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href]):is(:focus-visible,:has(:focus-visible),.pretend-focus)::after{color:HighlightText}@supports not selector(:has(:focus-visible)){.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::before{background-color:Highlight}.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href]):is(:focus-visible,:focus-within,.pretend-focus)::after{color:HighlightText}}.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href]):hover::before{background-color:Highlight}.stepper-item:not(.stepper-item-current)>.stepper-link:is(a[href]):hover::after{color:HighlightText}}
|
package/components/stepper.scss
CHANGED
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
@use './../mixins/icons' as icons-mx;
|
|
4
4
|
@use './../mixins/size' as size-mx;
|
|
5
5
|
@use './../mixins/utilities';
|
|
6
|
+
@use './../functions/icons' as icon-fn;
|
|
7
|
+
@use './../mixins/color' as color-mx;
|
|
6
8
|
|
|
7
9
|
@use './../variables/color';
|
|
8
10
|
@use './../variables/commons';
|
|
@@ -75,12 +77,25 @@
|
|
|
75
77
|
}
|
|
76
78
|
|
|
77
79
|
// current and completed steps are preceded by a yellow segment (except for the first step)
|
|
78
|
-
&:not(
|
|
80
|
+
&:not(&.stepper-item-current ~ *, :first-child)::before,
|
|
79
81
|
// steps that are not the current step or preceded by a current step are followed by a yellow segment
|
|
80
|
-
&:not(
|
|
82
|
+
&:not(.stepper-item-current, .stepper-item.stepper-item-current ~ *)::after {
|
|
81
83
|
background-color: stepper.$stepper-bar-fill-color;
|
|
82
84
|
z-index: 1;
|
|
83
85
|
}
|
|
86
|
+
|
|
87
|
+
.stepper:not(:has(.stepper-item-current)) &[aria-current='step']::after {
|
|
88
|
+
background-color: stepper.$stepper-bar-color;
|
|
89
|
+
z-index: auto;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current='step'] ~ & {
|
|
93
|
+
&::before,
|
|
94
|
+
&::after {
|
|
95
|
+
background-color: stepper.$stepper-bar-color;
|
|
96
|
+
z-index: auto;
|
|
97
|
+
}
|
|
98
|
+
}
|
|
84
99
|
}
|
|
85
100
|
|
|
86
101
|
.stepper-link {
|
|
@@ -114,7 +129,7 @@
|
|
|
114
129
|
text-align: end;
|
|
115
130
|
}
|
|
116
131
|
|
|
117
|
-
.stepper-item[aria-current='step'] > & {
|
|
132
|
+
.stepper-item[aria-current='step']:not(.stepper-item-current ~ *) > & {
|
|
118
133
|
color: stepper.$stepper-link-current-color;
|
|
119
134
|
font-weight: stepper.$stepper-link-current-font-weight;
|
|
120
135
|
}
|
|
@@ -148,14 +163,23 @@
|
|
|
148
163
|
margin-inline-start: auto;
|
|
149
164
|
}
|
|
150
165
|
|
|
151
|
-
.stepper-item:not(
|
|
166
|
+
.stepper-item:not(
|
|
167
|
+
.stepper-item-current:not([aria-current='step']),
|
|
168
|
+
.stepper-item.stepper-item-current ~ *
|
|
169
|
+
)
|
|
170
|
+
> & {
|
|
152
171
|
color: transparent;
|
|
153
172
|
}
|
|
154
173
|
|
|
155
|
-
.stepper-item
|
|
174
|
+
.stepper-item.stepper-item-current ~ .stepper-item > & {
|
|
156
175
|
color: stepper.$stepper-indicator-future-color;
|
|
157
176
|
background-color: stepper.$stepper-indicator-future-bg;
|
|
158
177
|
}
|
|
178
|
+
|
|
179
|
+
.stepper-item[aria-current] > & {
|
|
180
|
+
color: transparent;
|
|
181
|
+
background-color: stepper.$stepper-link-current-color;
|
|
182
|
+
}
|
|
159
183
|
}
|
|
160
184
|
|
|
161
185
|
// check icon
|
|
@@ -189,9 +213,43 @@
|
|
|
189
213
|
}
|
|
190
214
|
|
|
191
215
|
// show only for completed steps
|
|
192
|
-
.stepper-item:not(
|
|
216
|
+
.stepper-item:not(
|
|
217
|
+
.stepper-item-current:not([aria-current='step']),
|
|
218
|
+
.stepper-item.stepper-item-current ~ *
|
|
219
|
+
)
|
|
220
|
+
> & {
|
|
193
221
|
content: '';
|
|
194
222
|
}
|
|
223
|
+
|
|
224
|
+
.stepper-item[aria-current] > & {
|
|
225
|
+
@include icons-mx.icon(3193);
|
|
226
|
+
mask-size: 16px;
|
|
227
|
+
mask-repeat: no-repeat;
|
|
228
|
+
mask-position: center;
|
|
229
|
+
color: stepper.$stepper-indicator-future-color;
|
|
230
|
+
|
|
231
|
+
@include color-mx.on-dark-background {
|
|
232
|
+
color: stepper.$stepper-indicator-color;
|
|
233
|
+
}
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.stepper-item.stepper-item-current ~ .stepper-item,
|
|
238
|
+
.stepper:not(:has(.stepper-item-current)) .stepper-item[aria-current='step'] ~ .stepper-item {
|
|
239
|
+
&::before,
|
|
240
|
+
&::after {
|
|
241
|
+
background-color: stepper.$stepper-bar-color;
|
|
242
|
+
z-index: auto;
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
> .stepper-link::before {
|
|
246
|
+
color: stepper.$stepper-indicator-future-color;
|
|
247
|
+
background-color: stepper.$stepper-indicator-future-bg;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
> .stepper-link::after {
|
|
251
|
+
content: none;
|
|
252
|
+
}
|
|
195
253
|
}
|
|
196
254
|
|
|
197
255
|
// hover/focus state
|
|
@@ -203,17 +261,30 @@
|
|
|
203
261
|
@include utilities.focus-hover-style-custom() {
|
|
204
262
|
color: stepper.$stepper-link-color;
|
|
205
263
|
|
|
206
|
-
.stepper-item
|
|
264
|
+
.stepper-item.stepper-item-current > & {
|
|
207
265
|
color: stepper.$stepper-link-current-color;
|
|
208
266
|
}
|
|
209
267
|
|
|
210
268
|
// step indicator
|
|
211
269
|
&::before,
|
|
212
|
-
.stepper-item
|
|
270
|
+
.stepper-item.stepper-item-current ~ .stepper-item > &::before,
|
|
271
|
+
.stepper:not(:has(.stepper-item-current))
|
|
272
|
+
.stepper-item[aria-current='step']
|
|
273
|
+
~ .stepper-item
|
|
274
|
+
> &::before {
|
|
213
275
|
color: stepper.$stepper-indicator-hover-color;
|
|
214
276
|
background-color: stepper.$stepper-indicator-hover-bg;
|
|
215
277
|
}
|
|
216
278
|
|
|
279
|
+
.stepper-item[aria-current] > &::before {
|
|
280
|
+
color: transparent;
|
|
281
|
+
background-color: stepper.$stepper-link-current-color;
|
|
282
|
+
|
|
283
|
+
@include color-mx.on-dark-background {
|
|
284
|
+
border-color: Canvas;
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
|
|
217
288
|
// check icon
|
|
218
289
|
&::after {
|
|
219
290
|
color: stepper.$stepper-indicator-hover-color;
|
|
@@ -228,12 +299,29 @@
|
|
|
228
299
|
padding-inline: 0;
|
|
229
300
|
}
|
|
230
301
|
|
|
231
|
-
.stepper-item[aria-current='step'] {
|
|
302
|
+
.stepper-item[aria-current='step']:not(.stepper-item-current ~ *) {
|
|
232
303
|
// using "display: contents" on the stepper-item and stepper-link so that label, indicator and progress bar can be directly placed in the grid
|
|
233
304
|
display: contents;
|
|
234
305
|
|
|
235
306
|
> .stepper-link {
|
|
236
307
|
display: contents;
|
|
308
|
+
|
|
309
|
+
&::before,
|
|
310
|
+
&::after {
|
|
311
|
+
z-index: 2;
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
&::before {
|
|
315
|
+
content: '';
|
|
316
|
+
background-image: url('#{icon-fn.get-colored-svg-url(3193, color.$white)}');
|
|
317
|
+
background-repeat: no-repeat;
|
|
318
|
+
background-position: center;
|
|
319
|
+
background-size: 16px;
|
|
320
|
+
}
|
|
321
|
+
|
|
322
|
+
&::after {
|
|
323
|
+
content: none;
|
|
324
|
+
}
|
|
237
325
|
}
|
|
238
326
|
|
|
239
327
|
// progress bar
|
|
@@ -298,33 +386,42 @@
|
|
|
298
386
|
.stepper-item {
|
|
299
387
|
&::before,
|
|
300
388
|
&::after {
|
|
301
|
-
|
|
389
|
+
forced-color-adjust: none;
|
|
302
390
|
}
|
|
303
391
|
|
|
304
|
-
&:not(
|
|
305
|
-
&:not(
|
|
392
|
+
&:not(&.stepper-item-current ~ &, :first-child)::before,
|
|
393
|
+
&:not(.stepper-item-current:not(:last-child), .stepper-item.stepper-item-current ~ *)::after {
|
|
306
394
|
background-color: Highlight;
|
|
307
395
|
}
|
|
308
396
|
}
|
|
309
397
|
|
|
398
|
+
.stepper-item[aria-current='step'] > .stepper-link::after {
|
|
399
|
+
@include color-mx.on-dark-background {
|
|
400
|
+
color: color.$white;
|
|
401
|
+
}
|
|
402
|
+
}
|
|
403
|
+
|
|
310
404
|
.stepper-link {
|
|
311
405
|
&::before {
|
|
312
406
|
forced-color-adjust: none;
|
|
313
407
|
}
|
|
314
408
|
|
|
315
|
-
.stepper-item
|
|
409
|
+
.stepper-item.stepper-item-current > & {
|
|
316
410
|
&::before {
|
|
317
|
-
background-color:
|
|
318
|
-
color:
|
|
411
|
+
background-color: AccentColor;
|
|
412
|
+
color: AccentColorText;
|
|
413
|
+
@include color-mx.on-dark-background {
|
|
414
|
+
border-color: Canvas;
|
|
415
|
+
}
|
|
319
416
|
}
|
|
320
417
|
}
|
|
321
418
|
|
|
322
|
-
.stepper-item
|
|
323
|
-
.stepper-item:not(
|
|
419
|
+
.stepper-item.stepper-item-current ~ .stepper-item > &,
|
|
420
|
+
.stepper-item:not(.stepper-item-current) > & {
|
|
324
421
|
&::before {
|
|
325
422
|
color: Canvas;
|
|
326
423
|
border-color: Canvas;
|
|
327
|
-
background-color:
|
|
424
|
+
background-color: GrayText;
|
|
328
425
|
}
|
|
329
426
|
}
|
|
330
427
|
|
|
@@ -334,17 +431,19 @@
|
|
|
334
431
|
}
|
|
335
432
|
|
|
336
433
|
.stepper-link:is(a[href]) {
|
|
337
|
-
.stepper-item
|
|
434
|
+
.stepper-item.stepper-item-current > & {
|
|
338
435
|
@include utilities.focus-hover-style-custom() {
|
|
339
436
|
&::before {
|
|
340
|
-
|
|
437
|
+
background-color: Highlight;
|
|
438
|
+
color: HighlightText;
|
|
341
439
|
}
|
|
342
440
|
}
|
|
343
441
|
}
|
|
344
442
|
|
|
345
|
-
.stepper-item
|
|
443
|
+
.stepper-item.stepper-item-current ~ .stepper-item > & {
|
|
346
444
|
&::before {
|
|
347
445
|
color: Canvas;
|
|
446
|
+
background-color: GrayText;
|
|
348
447
|
}
|
|
349
448
|
|
|
350
449
|
@include utilities.focus-hover-style-custom() {
|
|
@@ -355,7 +454,7 @@
|
|
|
355
454
|
}
|
|
356
455
|
}
|
|
357
456
|
|
|
358
|
-
.stepper-item:not(
|
|
457
|
+
.stepper-item:not(.stepper-item-current) > & {
|
|
359
458
|
&::before {
|
|
360
459
|
background-color: LinkText;
|
|
361
460
|
}
|