@roadtrip/components 3.2.1 → 3.4.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/dist/cjs/index-a2306350.js +16 -4
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/road-alert.cjs.entry.js +1 -1
- package/dist/cjs/road-badge_14.cjs.entry.js +2 -2
- package/dist/cjs/road-button-floating.cjs.entry.js +66 -0
- package/dist/cjs/road-global-navigation.cjs.entry.js +1 -1
- package/dist/cjs/road-progress-indicator-horizontal.cjs.entry.js +40 -0
- package/dist/cjs/road-progress-tracker-item.cjs.entry.js +19 -0
- package/dist/cjs/road-progress-tracker.cjs.entry.js +19 -0
- package/dist/cjs/roadtrip.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +4 -1
- package/dist/collection/components/alert/alert.css +8 -4
- package/dist/collection/components/button/button.css +1 -2
- package/dist/collection/components/button-floating/button-floating.css +122 -0
- package/dist/collection/components/button-floating/button-floating.js +220 -0
- package/dist/collection/components/button-floating/button-floating.stories.js +75 -0
- package/dist/collection/components/global-navigation/global-navigation.css +1 -0
- package/dist/collection/components/icon/icon.css +10 -9
- package/dist/collection/components/icon/svg/becommerce-color.svg +1 -0
- package/dist/collection/components/icon/svg/becommerce-outline.svg +1 -0
- package/dist/collection/components/icon/svg/discount-workshop-color.svg +1 -0
- package/dist/collection/components/icon/svg/discount-workshop-outline.svg +1 -0
- package/dist/collection/components/icon/svg/discount-workshop-solid.svg +1 -0
- package/dist/collection/components/icon/svg/flag-belgium-color.svg +1 -1
- package/dist/collection/components/icon/svg/garage-color.svg +1 -1
- package/dist/collection/components/icon/svg/garage-house-color.svg +1 -1
- package/dist/collection/components/icon/svg/garage-house-outline.svg +1 -1
- package/dist/collection/components/icon/svg/garage-outline.svg +1 -1
- package/dist/collection/components/icon/svg/keep-in-repair-outline.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-all-color.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-all-outline.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-all-solid.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-color.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-garage-auto5-color.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-garage-auto5-outline.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-garage-auto5-solid.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-garage-color.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-garage-norauto-color.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-garage-norauto-outline.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-garage-norauto-solid.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-garage-outline.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-garage-solid.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-number-outline.svg +1 -0
- package/dist/collection/components/icon/svg/location-pin-number-solid.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-outline.svg +1 -1
- package/dist/collection/components/icon/svg/location-pin-solid.svg +1 -1
- package/dist/collection/components/icon/svg/tire-pressure-color.svg +1 -0
- package/dist/collection/components/icon/svg/tire-pressure-outline.svg +1 -0
- package/dist/collection/components/{stepper/stepper.css → progress-indicator-horizontal/progress-indicator-horizontal.css} +40 -38
- package/dist/collection/components/{stepper/stepper.js → progress-indicator-horizontal/progress-indicator-horizontal.js} +24 -24
- package/dist/collection/components/progress-indicator-horizontal/progress-indicator-horizontal.stories.js +201 -0
- package/dist/collection/components/progress-tracker/progress-tracker.css +25 -0
- package/dist/collection/components/progress-tracker/progress-tracker.js +26 -0
- package/dist/collection/components/progress-tracker/progress-tracker.stories.js +264 -0
- package/dist/collection/components/progress-tracker-item/progress-tracker-item.css +163 -0
- package/dist/collection/components/progress-tracker-item/progress-tracker-item.js +28 -0
- package/dist/esm/index-a99a5e7b.js +16 -4
- package/dist/esm/loader.js +1 -1
- package/dist/esm/road-alert.entry.js +1 -1
- package/dist/esm/road-badge_14.entry.js +2 -2
- package/dist/esm/road-button-floating.entry.js +62 -0
- package/dist/esm/road-global-navigation.entry.js +1 -1
- package/dist/esm/road-progress-indicator-horizontal.entry.js +36 -0
- package/dist/esm/road-progress-tracker-item.entry.js +15 -0
- package/dist/esm/road-progress-tracker.entry.js +15 -0
- package/dist/esm/roadtrip.js +1 -1
- package/dist/html.html-data.json +162 -92
- package/dist/icons/icons.svg +1 -1
- package/dist/icons/index.d.ts +14 -1
- package/dist/icons/index.js +79 -64
- package/dist/roadtrip/p-00762fb0.entry.js +1 -0
- package/dist/roadtrip/p-47472e0c.entry.js +1 -0
- package/dist/roadtrip/p-604b9899.entry.js +1 -0
- package/dist/roadtrip/{p-dd9eea16.entry.js → p-72612490.entry.js} +1 -1
- package/dist/roadtrip/p-b3f165f4.entry.js +1 -0
- package/dist/roadtrip/p-b68c2056.entry.js +1 -0
- package/dist/roadtrip/p-e51617fb.entry.js +1 -0
- package/dist/roadtrip/roadtrip.css +1 -1
- package/dist/roadtrip/roadtrip.esm.js +1 -1
- package/dist/roadtrip/svg/becommerce-color.svg +1 -0
- package/dist/roadtrip/svg/becommerce-outline.svg +1 -0
- package/dist/roadtrip/svg/discount-workshop-color.svg +1 -0
- package/dist/roadtrip/svg/discount-workshop-outline.svg +1 -0
- package/dist/roadtrip/svg/discount-workshop-solid.svg +1 -0
- package/dist/roadtrip/svg/flag-belgium-color.svg +1 -1
- package/dist/roadtrip/svg/garage-color.svg +1 -1
- package/dist/roadtrip/svg/garage-house-color.svg +1 -1
- package/dist/roadtrip/svg/garage-house-outline.svg +1 -1
- package/dist/roadtrip/svg/garage-outline.svg +1 -1
- package/dist/roadtrip/svg/keep-in-repair-outline.svg +1 -1
- package/dist/roadtrip/svg/location-pin-all-color.svg +1 -1
- package/dist/roadtrip/svg/location-pin-all-outline.svg +1 -1
- package/dist/roadtrip/svg/location-pin-all-solid.svg +1 -1
- package/dist/roadtrip/svg/location-pin-color.svg +1 -1
- package/dist/roadtrip/svg/location-pin-garage-auto5-color.svg +1 -0
- package/dist/roadtrip/svg/location-pin-garage-auto5-outline.svg +1 -0
- package/dist/roadtrip/svg/location-pin-garage-auto5-solid.svg +1 -1
- package/dist/roadtrip/svg/location-pin-garage-color.svg +1 -0
- package/dist/roadtrip/svg/location-pin-garage-norauto-color.svg +1 -0
- package/dist/roadtrip/svg/location-pin-garage-norauto-outline.svg +1 -0
- package/dist/roadtrip/svg/location-pin-garage-norauto-solid.svg +1 -1
- package/dist/roadtrip/svg/location-pin-garage-outline.svg +1 -0
- package/dist/roadtrip/svg/location-pin-garage-solid.svg +1 -1
- package/dist/roadtrip/svg/location-pin-number-outline.svg +1 -0
- package/dist/roadtrip/svg/location-pin-number-solid.svg +1 -1
- package/dist/roadtrip/svg/location-pin-outline.svg +1 -1
- package/dist/roadtrip/svg/location-pin-solid.svg +1 -1
- package/dist/roadtrip/svg/tire-pressure-color.svg +1 -0
- package/dist/roadtrip/svg/tire-pressure-outline.svg +1 -0
- package/dist/types/components/button-floating/button-floating.d.ts +48 -0
- package/dist/types/components/{stepper/stepper.d.ts → progress-indicator-horizontal/progress-indicator-horizontal.d.ts} +13 -13
- package/dist/types/components/progress-tracker/progress-tracker.d.ts +11 -0
- package/dist/types/components/progress-tracker-item/progress-tracker-item.d.ts +14 -0
- package/dist/types/components.d.ts +168 -85
- package/icons/icons.svg +1 -1
- package/icons/index.d.ts +14 -1
- package/icons/index.js +79 -64
- package/package.json +1 -1
- package/dist/cjs/road-stepper.cjs.entry.js +0 -40
- package/dist/collection/components/stepper/stepper.stories.js +0 -201
- package/dist/esm/road-stepper.entry.js +0 -36
- package/dist/roadtrip/p-2ebc384d.entry.js +0 -1
- package/dist/roadtrip/p-91dacad4.entry.js +0 -1
- package/dist/roadtrip/p-e6e9d15a.entry.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M22.68 24.39h5.88l.66 4.03h2.53l-2.52-15.5h-2.57l-9.31 15.5h2.92l2.42-4.03h-.01Zm4.63-7.7.85 5.2h-3.97l3.13-5.2h-.01ZM37.94 29.35c2.61 0 4.67-1.27 5.81-3.59.86-1.75.9-3.83.11-5.3-.63-1.18-1.76-1.94-3.17-2.13-.94-.13-1.78-.04-2.52.15l.99-2.68h6.23l.45-2.5h-8.42l-3.24 8.75h2.56c.06-.06 1.49-1.53 3.62-1.24.62.08 1.04.35 1.3.83.41.76.35 2.01-.15 3.03-.71 1.45-1.91 2.19-3.56 2.19-.79 0-1.5-.27-1.87-.7-.29-.34-.38-.79-.28-1.39h-2.51c-.13 1.45.39 2.43.88 3.01.85 1 2.23 1.58 3.78 1.58l-.01-.01Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.1 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.11C55.5 11.43 45.07 1 32.25 1Zm10.99 42.68c-3.87 4.29-8.19 9.07-10.99 15.93-2.8-6.86-7.12-11.64-10.99-15.93-5.24-5.79-9.76-10.8-9.76-19.43 0-11.44 9.31-20.75 20.75-20.75S53 12.81 53 24.25c0 8.63-4.52 13.64-9.76 19.43Z"/><path d="M46.79 30.67c-.53-.44-1.32-.37-1.76.16-.04.05-4.42 5.17-12.82 5.17s-12.6-4.96-12.78-5.17c-.44-.53-1.23-.6-1.76-.16-.53.44-.61 1.23-.17 1.76.21.25 5.14 6.07 14.7 6.07 9.56 0 14.53-5.82 14.74-6.07.44-.53.37-1.32-.16-1.76h.01Z" fill="var(--road-icon-variant, rgb(252, 183, 49))"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M22.68 24.39h5.88l.66 4.03h2.53l-2.52-15.5h-2.57l-9.31 15.5h2.92l2.42-4.03h-.01Zm4.63-7.7.85 5.2h-3.97l3.13-5.2h-.01ZM37.94 29.35c2.61 0 4.67-1.27 5.81-3.59.86-1.75.9-3.83.11-5.3-.63-1.18-1.76-1.94-3.17-2.13-.94-.13-1.78-.04-2.52.15l.99-2.68h6.23l.45-2.5h-8.42l-3.24 8.75h2.56c.06-.06 1.49-1.53 3.62-1.24.62.08 1.04.35 1.3.83.41.76.35 2.01-.15 3.03-.71 1.45-1.91 2.19-3.56 2.19-.79 0-1.5-.27-1.87-.7-.29-.34-.38-.79-.28-1.39h-2.51c-.13 1.45.39 2.43.88 3.01.85 1 2.23 1.58 3.78 1.58l-.01-.01Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.1 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.11C55.5 11.43 45.07 1 32.25 1Zm10.99 42.68c-3.87 4.29-8.19 9.07-10.99 15.93-2.8-6.86-7.12-11.64-10.99-15.93-5.24-5.79-9.76-10.8-9.76-19.43 0-11.44 9.31-20.75 20.75-20.75S53 12.81 53 24.25c0 8.63-4.52 13.64-9.76 19.43Z"/><path d="M46.79 30.67c-.53-.44-1.32-.37-1.76.16-.04.05-4.42 5.17-12.82 5.17s-12.6-4.96-12.78-5.17c-.44-.53-1.23-.6-1.76-.16-.53.44-.61 1.23-.17 1.76.21.25 5.14 6.07 14.7 6.07 9.56 0 14.53-5.82 14.74-6.07.44-.53.37-1.32-.16-1.76h.01Z"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg"
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.1 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.11C55.5 11.43 45.07 1 32.25 1Zm1.66 24.75h3.45c-.12.59 0 1.21.34 1.71.22.19.48.33.76.42.28.09.57.11.86.08 1.89 0 3.08-1.09 3.54-3.27.09-.42.14-.85.15-1.28.05-.29.02-.6-.07-.88a2.1 2.1 0 0 0-.45-.76c-.21-.21-.46-.38-.74-.47-.28-.1-.58-.13-.88-.09-.5 0-.99.11-1.43.34-.44.23-.82.56-1.09.98h-3.22l3.75-9.75h9.47l-.68 3.07h-7.3l-1.39 3.62c1.11-.62 2.35-.96 3.62-.99a3.846 3.846 0 0 1 3 1.24c.77.9 1.17 2.06 1.11 3.24 0 .52-.06 1.04-.18 1.55a7.932 7.932 0 0 1-2.82 4.57 7.634 7.634 0 0 1-4.98 1.81c-1.28.04-2.54-.36-3.56-1.14a3.456 3.456 0 0 1-1.45-2.83c0-.4.07-.79.2-1.16l-.01-.01Zm-9.19-12.98h4.05l2.34 16.79H27.3l-.34-3.46h-6.19l-1.91 3.46h-3.69l9.55-16.79Zm-5.75 17.79-.06.1-.16-.1h.22Zm12.71 8.88c-9.18 0-16.55-6.29-16.55-7.04s7.38 4.35 16.55 4.35c9.17 0 16.68-5.09 16.68-4.35 0 .74-7.5 7.04-16.68 7.04Z"/><path d="M25.92 16.56h-.04l-3.57 6.64h4.28l-.67-6.64Z"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="m41.33 27.67-1.45-4.31c-.3-.91-1.15-1.52-2.11-1.52H26.74c-.96 0-1.81.61-2.11 1.52l-1.45 4.31h-.24c-.69 0-1.25.56-1.25 1.25 0 .65.51 1.17 1.14 1.23v7.46a1.25 1.25 0 0 0 2.5 0v-.85h13.86v.85a1.25 1.25 0 0 0 2.5 0v-7.46a1.24 1.24 0 0 0 1.14-1.23c0-.69-.56-1.25-1.25-1.25h-.25Zm-14.4-3.33h10.64l1.12 3.33H25.81l1.12-3.33Zm-1.61 5.83h13.86v4.08H25.32v-4.08Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.11 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.1C55.5 11.43 45.07 1 32.25 1Zm10.99 42.68c-3.87 4.29-8.19 9.07-10.99 15.93-2.8-6.86-7.12-11.64-10.99-15.93-5.24-5.79-9.76-10.8-9.76-19.43 0-11.44 9.31-20.75 20.75-20.75S53 12.81 53 24.25c0 8.63-4.52 13.63-9.76 19.43Z"/><path d="M48.58 16.53h-4.46v-5.89H20.34v5.89h-4.42v2.5h1.05v15.71h2.5V19.03h25.51v15.71h2.5V19.03h1.09v-2.5h.01Zm-25.73 0v-3.39h18.77v3.39H22.84h.01Z" fill="var(--road-icon-variant, rgb(252, 183, 49))"/><path d="M37.05 33.51a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5ZM27.45 33.51a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z" fill="var(--road-icon-variant, rgb(252, 183, 49))"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="m35.67 27.23-5.88-8.98c-.28-.42-.75-.68-1.25-.68h-1.71l-1.95 13.35h2.53l1.41-9.62 5.86 8.94c.28.42.75.68 1.25.68h1.75l1.91-13.35h-2.53l-1.38 9.66h-.01Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.1 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.11C55.5 11.43 45.07 1 32.25 1Zm10.99 42.68c-3.87 4.29-8.19 9.07-10.99 15.93-2.8-6.86-7.12-11.64-10.99-15.93-5.24-5.79-9.76-10.8-9.76-19.43 0-11.44 9.31-20.75 20.75-20.75S53 12.81 53 24.25c0 8.63-4.52 13.64-9.76 19.43Z"/><path d="M44.15 13.94c-2.46-3.02-5.97-4.87-9.88-5.21-4.18-.36-8.29 1.01-11.58 3.87-6.55 5.69-7.62 15.54-2.4 21.96 2.46 3.02 5.97 4.87 9.88 5.21.44.04.88.06 1.31.06 3.72 0 7.32-1.37 10.27-3.93 6.55-5.69 7.62-15.54 2.4-21.96Zm-4.04 20.07c-2.77 2.41-6.23 3.57-9.72 3.27-3.23-.28-6.13-1.81-8.16-4.3-4.38-5.39-3.44-13.68 2.1-18.49 2.49-2.16 5.52-3.31 8.63-3.31.36 0 .73.02 1.09.05 3.23.28 6.13 1.81 8.15 4.3 4.38 5.38 3.44 13.68-2.1 18.49l.01-.01Z" fill="var(--road-icon-variant, rgb(252, 183, 49))"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="m35.67 27.23-5.88-8.98c-.28-.42-.75-.68-1.25-.68h-1.71l-1.95 13.35h2.53l1.41-9.62 5.86 8.94c.28.42.75.68 1.25.68h1.75l1.91-13.35h-2.53l-1.38 9.66h-.01Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.1 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.11C55.5 11.43 45.07 1 32.25 1Zm10.99 42.68c-3.87 4.29-8.19 9.07-10.99 15.93-2.8-6.86-7.12-11.64-10.99-15.93-5.24-5.79-9.76-10.8-9.76-19.43 0-11.44 9.31-20.75 20.75-20.75S53 12.81 53 24.25c0 8.63-4.52 13.64-9.76 19.43Z"/><path d="M44.15 13.94c-2.46-3.02-5.97-4.87-9.88-5.21-4.18-.36-8.29 1.01-11.58 3.87-6.55 5.69-7.62 15.54-2.4 21.96 2.46 3.02 5.97 4.87 9.88 5.21.44.04.88.06 1.31.06 3.72 0 7.32-1.37 10.27-3.93 6.55-5.69 7.62-15.54 2.4-21.96Zm-4.04 20.07c-2.77 2.41-6.23 3.57-9.72 3.27-3.23-.28-6.13-1.81-8.16-4.3-4.38-5.39-3.44-13.68 2.1-18.49 2.49-2.16 5.52-3.31 8.63-3.31.36 0 .73.02 1.09.05 3.23.28 6.13 1.81 8.15 4.3 4.38 5.38 3.44 13.68-2.1 18.49l.01-.01Z"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg"
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M33.75 13.8c-5.39 0-10.24 3.91-11.19 10.51-.95 6.6 2.83 10.38 8.22 10.38 5.39 0 10.24-3.77 11.19-10.38.94-6.6-2.83-10.51-8.22-10.51Zm3.57 16.51H35.6c-.27.03-.55-.01-.8-.12s-.47-.29-.62-.51l-4.77-7.17-1.1 7.8h-2.77l1.76-12h1.5c.98 0 1.27.07 1.65.64l4.73 7.22 1.11-7.89h2.77l-1.72 12.04-.02-.01Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.1 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.11C55.5 11.43 45.07 1 32.25 1ZM42.9 36.55a19.864 19.864 0 0 1-13.08 4.83c-9.52 0-16.37-6.73-14.86-17.07.65-4.77 3-9.15 6.64-12.31 3.63-3.16 8.29-4.9 13.11-4.88 9.52 0 16.26 6.85 14.87 17.19-.67 4.75-3.04 9.1-6.67 12.24h-.01Z"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="m41.33 27.67-1.45-4.31c-.3-.91-1.15-1.52-2.11-1.52H26.74c-.96 0-1.81.61-2.11 1.52l-1.45 4.31h-.24c-.69 0-1.25.56-1.25 1.25 0 .65.51 1.17 1.14 1.23v7.46a1.25 1.25 0 0 0 2.5 0v-.85h13.86v.85a1.25 1.25 0 0 0 2.5 0v-7.46a1.24 1.24 0 0 0 1.14-1.23c0-.69-.56-1.25-1.25-1.25h-.25Zm-14.4-3.33h10.64l1.12 3.33H25.81l1.12-3.33Zm-1.61 5.83h13.86v4.08H25.32v-4.08Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.11 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.1C55.5 11.43 45.07 1 32.25 1Zm10.99 42.68c-3.87 4.29-8.19 9.07-10.99 15.93-2.8-6.86-7.12-11.64-10.99-15.93-5.24-5.79-9.76-10.8-9.76-19.43 0-11.44 9.31-20.75 20.75-20.75S53 12.81 53 24.25c0 8.63-4.52 13.63-9.76 19.43Z"/><path d="M48.58 16.53h-4.46v-5.89H20.34v5.89h-4.42v2.5h1.05v15.71h2.5V19.03h25.51v15.71h2.5V19.03h1.09v-2.5h.01Zm-25.73 0v-3.39h18.77v3.39H22.84h.01Z"/><path d="M37.05 33.51a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5ZM27.45 33.51a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg"
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M26.96 33.37a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5ZM37.56 33.37a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5ZM37.58 24.19H26.94l-1.12 3.33H38.7l-1.12-3.33Z"/><path d="M32.25 1C19.43 1 9 11.43 9 24.25c0 9.59 5.05 15.19 10.4 21.11 4.52 5 9.18 10.16 11.65 18.37h2.39c2.46-8.2 7.13-13.37 11.65-18.37 5.35-5.92 10.4-11.51 10.4-21.1C55.5 11.43 45.07 1 32.25 1Zm9.44 29v7.46a1.25 1.25 0 0 1-2.5 0v-.85H25.33v.85a1.25 1.25 0 0 1-2.5 0V30c-.63-.06-1.14-.58-1.14-1.23 0-.69.56-1.25 1.25-1.25h.25l1.45-4.31c.3-.91 1.15-1.52 2.11-1.52h11.03c.96 0 1.8.61 2.11 1.52l1.45 4.31h.24c.69 0 1.25.56 1.25 1.25 0 .65-.5 1.17-1.14 1.23Zm6.89-11.11h-1.09V34.6h-2.5V18.89H19.48V34.6h-2.5V18.89h-1.05v-2.5h4.42V11.5h23.77v4.89h4.46v2.5Z"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M30.67 58.34c-2.07-6.9-6.01-11.26-9.82-15.47-4.55-5.04-8.85-9.8-8.85-18C12 14.29 21.29 5 31.87 5c10.58 0 19.87 9.29 19.87 19.87 0 8.19-4.3 12.95-8.86 17.99-3.81 4.21-7.75 8.57-9.82 15.47h-2.39v.01Zm1.2-50.84c-9.25 0-17.37 8.12-17.37 17.37 0 7.23 3.8 11.44 8.21 16.32 3.21 3.55 6.78 7.5 9.16 13.11 2.38-5.61 5.95-9.56 9.16-13.11 4.41-4.87 8.21-9.08 8.21-16.32 0-9.25-8.12-17.37-17.37-17.37Z"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg"
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M31.87 5C21.29 5 12 14.29 12 24.87c0 8.19 4.3 12.95 8.86 17.99 3.81 4.21 7.75 8.57 9.82 15.47h2.39c2.07-6.9 6.01-11.26 9.82-15.47 4.55-5.04 8.86-9.8 8.86-17.99C51.74 14.29 42.46 5 31.87 5Z"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg"
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M30.67 58.34c-2.07-6.9-6.01-11.26-9.82-15.47-4.55-5.04-8.85-9.8-8.85-18C12 14.29 21.29 5 31.87 5c10.58 0 19.87 9.29 19.87 19.87 0 8.19-4.3 12.95-8.86 17.99-3.81 4.21-7.75 8.57-9.82 15.47h-2.39v.01Zm1.2-50.84c-9.25 0-17.37 8.12-17.37 17.37 0 7.23 3.8 11.44 8.21 16.32 3.21 3.55 6.78 7.5 9.16 13.11 2.38-5.61 5.95-9.56 9.16-13.11 4.41-4.87 8.21-9.08 8.21-16.32 0-9.25-8.12-17.37-17.37-17.37Z"/><path d="M31.9 32.28c-4.13 0-7.48-3.33-7.48-7.43s3.36-7.43 7.48-7.43c4.12 0 7.48 3.33 7.48 7.43s-3.36 7.43-7.48 7.43Zm0-12.36c-2.75 0-4.98 2.21-4.98 4.93 0 2.72 2.24 4.93 4.98 4.93s4.98-2.21 4.98-4.93c0-2.72-2.24-4.93-4.98-4.93Z"/></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg"
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M31.87 5C21.29 5 12 14.29 12 24.87c0 8.19 4.3 12.95 8.86 17.99 3.81 4.21 7.75 8.57 9.82 15.47h2.39c2.07-6.9 6.01-11.26 9.82-15.47 4.55-5.04 8.86-9.8 8.86-17.99C51.74 14.29 42.46 5 31.87 5Zm.03 26.03c-3.44 0-6.23-2.77-6.23-6.18 0-3.41 2.79-6.18 6.23-6.18 3.44 0 6.23 2.77 6.23 6.18 0 3.41-2.79 6.18-6.23 6.18Z"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M54.49 16.24c-.91-1.11-1.41-2.44-1.41-3.77V7.69h-2.5v4.78c0 1.9.7 3.8 1.97 5.35 7.84 9.56 7.15 23.37-1.61 32.13l-.37.37v5.09c0 .96-.79 1.75-1.75 1.75h-3.68v-5.35h-2.5v5.35h-5.43v-5.35h-2.5v5.35h-5.43v-5.35h-2.5v5.35h-5.43v-5.35h-2.5v5.35h-3.68c-.96 0-1.75-.79-1.75-1.75v-5.09l-.37-.37C4.3 41.2 3.6 27.38 11.44 17.82c1.27-1.55 1.98-3.45 1.98-5.35V7.31h-2.5v5.16c0 1.32-.5 2.66-1.41 3.77-8.55 10.42-7.92 25.42 1.41 35.11v4.06a4.26 4.26 0 0 0 4.25 4.25h33.67a4.26 4.26 0 0 0 4.25-4.25v-4.06a26.375 26.375 0 0 0 1.41-35.11h-.01Z"/><path d="M33.25 15.12h-2.5v14h2.5v-14ZM33.25 33.55h-2.5v3.33h2.5v-3.33Z"/><path d="M11.53 39.17c1.58 4.77 6.16 7.97 11.38 7.97h18.16c5.36 0 10.14-3.57 11.62-8.68 1.99-6.84.1-14.21-4.92-19.23a5.701 5.701 0 0 1-1.68-4.07V7.69h-2.5v7.47c0 2.2.86 4.28 2.42 5.83 4.38 4.38 6.02 10.8 4.29 16.76-1.17 4.05-4.97 6.88-9.22 6.88H22.92c-4.14 0-7.76-2.51-9-6.26-2.04-6.15-.48-12.81 4.09-17.38a8.193 8.193 0 0 0 2.42-5.83V7.31h-2.5v7.85c0 1.51-.61 3-1.68 4.07-5.24 5.24-7.04 12.88-4.7 19.94h-.02Z" fill="var(--road-icon-variant, rgb(252, 183, 49))"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="M54.49 16.24c-.91-1.11-1.41-2.44-1.41-3.77V7.69h-2.5v4.78c0 1.9.7 3.8 1.97 5.35 7.84 9.56 7.15 23.37-1.61 32.13l-.37.37v5.09c0 .96-.79 1.75-1.75 1.75h-3.68v-5.35h-2.5v5.35h-5.43v-5.35h-2.5v5.35h-5.43v-5.35h-2.5v5.35h-5.43v-5.35h-2.5v5.35h-3.68c-.96 0-1.75-.79-1.75-1.75v-5.09l-.37-.37C4.3 41.2 3.6 27.38 11.44 17.82c1.27-1.55 1.98-3.45 1.98-5.35V7.31h-2.5v5.16c0 1.32-.5 2.66-1.41 3.77-8.55 10.42-7.92 25.42 1.41 35.11v4.06a4.26 4.26 0 0 0 4.25 4.25h33.67a4.26 4.26 0 0 0 4.25-4.25v-4.06a26.375 26.375 0 0 0 1.41-35.11h-.01Z"/><path d="M33.25 15.12h-2.5v14h2.5v-14ZM33.25 33.55h-2.5v3.33h2.5v-3.33Z"/><path d="M11.53 39.17c1.58 4.77 6.16 7.97 11.38 7.97h18.16c5.36 0 10.14-3.57 11.62-8.68 1.99-6.84.1-14.21-4.92-19.23a5.701 5.701 0 0 1-1.68-4.07V7.69h-2.5v7.47c0 2.2.86 4.28 2.42 5.83 4.38 4.38 6.02 10.8 4.29 16.76-1.17 4.05-4.97 6.88-9.22 6.88H22.92c-4.14 0-7.76-2.51-9-6.26-2.04-6.15-.48-12.81 4.09-17.38a8.193 8.193 0 0 0 2.42-5.83V7.31h-2.5v7.85c0 1.51-.61 3-1.68 4.07-5.24 5.24-7.04 12.88-4.7 19.94h-.02Z"/></svg>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*
|
|
2
|
-
*
|
|
2
|
+
* Progress-indicator-horizontal
|
|
3
3
|
*
|
|
4
4
|
* Index
|
|
5
5
|
* - Item
|
|
@@ -13,10 +13,10 @@
|
|
|
13
13
|
display: block;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
/*
|
|
16
|
+
/* PROGRESS INDICATOR HORIZONTAL
|
|
17
17
|
-------------------- */
|
|
18
18
|
|
|
19
|
-
.
|
|
19
|
+
.progress-indicator-horizontal {
|
|
20
20
|
display: flex;
|
|
21
21
|
padding-left: 0;
|
|
22
22
|
margin: 0;
|
|
@@ -25,10 +25,10 @@
|
|
|
25
25
|
list-style: none;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
/*
|
|
28
|
+
/* PROGRESS INDICATOR HORIZONTAL ITEM
|
|
29
29
|
-------------------- */
|
|
30
30
|
|
|
31
|
-
.
|
|
31
|
+
.progress-indicator-horizontal-item {
|
|
32
32
|
display: flex;
|
|
33
33
|
flex: 1;
|
|
34
34
|
flex-direction: column;
|
|
@@ -40,18 +40,19 @@
|
|
|
40
40
|
*/
|
|
41
41
|
|
|
42
42
|
|
|
43
|
-
.
|
|
43
|
+
.progress-indicator-horizontal-item:not(:last-child)::after {
|
|
44
44
|
position: relative;
|
|
45
45
|
top: 1rem;
|
|
46
|
-
left: 50
|
|
46
|
+
left: calc(50% + 16px);
|
|
47
47
|
order: -1;
|
|
48
|
+
width: calc(100% - 32px);
|
|
48
49
|
height: 2px;
|
|
49
50
|
content: "";
|
|
50
51
|
background: var(--road-surface-disabled);
|
|
51
52
|
}
|
|
52
53
|
|
|
53
|
-
.
|
|
54
|
-
.
|
|
54
|
+
.progress-indicator-horizontal-outline-light .progress-indicator-horizontal-item:not(:last-child)::after,
|
|
55
|
+
.progress-indicator-horizontal-secondary-outline-light .progress-indicator-horizontal-item:not(:last-child)::after {
|
|
55
56
|
left: calc(50% + calc(2rem / 2));
|
|
56
57
|
width: calc(100% - 2rem);
|
|
57
58
|
}
|
|
@@ -61,14 +62,14 @@
|
|
|
61
62
|
*/
|
|
62
63
|
|
|
63
64
|
|
|
64
|
-
.
|
|
65
|
+
.progress-indicator-horizontal-item:not(.completed) .progress-indicator-horizontal-link {
|
|
65
66
|
cursor: not-allowed;
|
|
66
67
|
}
|
|
67
68
|
|
|
68
|
-
/*
|
|
69
|
+
/* PROGRESS INDICATOR HORIZONTAL LINK
|
|
69
70
|
-------------------- */
|
|
70
71
|
|
|
71
|
-
.
|
|
72
|
+
.progress-indicator-horizontal-link {
|
|
72
73
|
z-index: 1;
|
|
73
74
|
display: flex;
|
|
74
75
|
flex-direction: column;
|
|
@@ -76,10 +77,10 @@
|
|
|
76
77
|
text-decoration: none;
|
|
77
78
|
}
|
|
78
79
|
|
|
79
|
-
/*
|
|
80
|
+
/* PROGRESS INDICATOR HORIZONTAL ICON
|
|
80
81
|
-------------------- */
|
|
81
82
|
|
|
82
|
-
.
|
|
83
|
+
.progress-indicator-horizontal-icon {
|
|
83
84
|
display: inline-flex;
|
|
84
85
|
align-items: center;
|
|
85
86
|
justify-content: center;
|
|
@@ -88,17 +89,17 @@
|
|
|
88
89
|
font-size: var(--road-button-medium);
|
|
89
90
|
font-weight: 700;
|
|
90
91
|
color: var(--road-on-surface-disabled);
|
|
91
|
-
background: var(--road-surface-
|
|
92
|
+
background: var(--road-surface-disabled);
|
|
92
93
|
border-radius: 50%;
|
|
93
94
|
fill: currentColor;
|
|
94
95
|
}
|
|
95
96
|
|
|
96
|
-
::slotted(.
|
|
97
|
+
::slotted(.progress-indicator-horizontal-icon) road-icon{
|
|
97
98
|
color: var(--road-secondary-600);
|
|
98
99
|
}
|
|
99
100
|
|
|
100
|
-
.
|
|
101
|
-
.
|
|
101
|
+
.progress-indicator-horizontal-outline .progress-indicator-horizontal-icon,
|
|
102
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline .progress-indicator-horizontal-icon {
|
|
102
103
|
width: calc(2rem - 4px);
|
|
103
104
|
height: calc(2rem - 4px);
|
|
104
105
|
color: var(--road-on-surface-disabled);
|
|
@@ -107,26 +108,26 @@
|
|
|
107
108
|
fill: currentColor;
|
|
108
109
|
}
|
|
109
110
|
|
|
110
|
-
.
|
|
111
|
-
.
|
|
111
|
+
.progress-indicator-horizontal-outline-light .progress-indicator-horizontal-icon,
|
|
112
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline-light .progress-indicator-horizontal-icon {
|
|
112
113
|
color: var(--road-on-surface-disabled);
|
|
113
114
|
background: none;
|
|
114
115
|
border: 2px solid var(--road-surface-disabled);
|
|
115
116
|
fill: currentColor;
|
|
116
117
|
}
|
|
117
118
|
|
|
118
|
-
/*
|
|
119
|
+
/* PROGRESS INDICATOR HORIZONTAL TITLE
|
|
119
120
|
-------------------- */
|
|
120
121
|
|
|
121
|
-
.
|
|
122
|
+
.progress-indicator-horizontal-title {
|
|
122
123
|
display: block;
|
|
123
124
|
margin-top: 0.25rem;
|
|
124
125
|
font-size: var(--road-body-small);
|
|
125
126
|
font-weight: 700;
|
|
126
|
-
color: var(--road-on-surface-
|
|
127
|
+
color: var(--road-on-surface-disabled);
|
|
127
128
|
}
|
|
128
129
|
|
|
129
|
-
.
|
|
130
|
+
.progress-indicator-horizontal-title span{
|
|
130
131
|
display: block;
|
|
131
132
|
font-size: var(--road-body-small);
|
|
132
133
|
font-weight: 400;
|
|
@@ -140,14 +141,14 @@
|
|
|
140
141
|
background: var(--road-primary);
|
|
141
142
|
}
|
|
142
143
|
|
|
143
|
-
.
|
|
144
|
-
.
|
|
145
|
-
.
|
|
144
|
+
.progress-indicator-horizontal-secondary .completed:not(:last-child)::after,
|
|
145
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline .completed:not(:last-child)::after,
|
|
146
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline-light .completed:not(:last-child)::after {
|
|
146
147
|
background: var(--road-secondary);
|
|
147
148
|
}
|
|
148
149
|
|
|
149
|
-
.completed .
|
|
150
|
-
.current .
|
|
150
|
+
.completed .progress-indicator-horizontal-icon,
|
|
151
|
+
.current .progress-indicator-horizontal-icon {
|
|
151
152
|
width: 2rem;
|
|
152
153
|
height: 2rem;
|
|
153
154
|
color: var(--road-on-primary);
|
|
@@ -155,25 +156,25 @@
|
|
|
155
156
|
border: 0;
|
|
156
157
|
}
|
|
157
158
|
|
|
158
|
-
.
|
|
159
|
+
.progress-indicator-horizontal-outline .completed .progress-indicator-horizontal-icon {
|
|
159
160
|
color: var(--road-primary);
|
|
160
161
|
background: var(--road-surface);
|
|
161
162
|
border: 2px solid var(--road-primary);
|
|
162
163
|
}
|
|
163
164
|
|
|
164
|
-
.
|
|
165
|
+
.progress-indicator-horizontal-outline-light .completed .progress-indicator-horizontal-icon {
|
|
165
166
|
color: var(--road-primary);
|
|
166
167
|
background: none;
|
|
167
168
|
border: 2px solid var(--road-primary);
|
|
168
169
|
}
|
|
169
170
|
|
|
170
|
-
.
|
|
171
|
+
.progress-indicator-horizontal-secondary .completed .progress-indicator-horizontal-icon {
|
|
171
172
|
color: var(--road-on-secondary);
|
|
172
173
|
background: var(--road-secondary);
|
|
173
174
|
border: 0;
|
|
174
175
|
}
|
|
175
176
|
|
|
176
|
-
.
|
|
177
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline .completed .progress-indicator-horizontal-icon {
|
|
177
178
|
width: calc(2rem - 4px);
|
|
178
179
|
height: calc(2rem - 4px);
|
|
179
180
|
color: var(--road-secondary);
|
|
@@ -181,7 +182,7 @@
|
|
|
181
182
|
border: 2px solid var(--road-secondary);
|
|
182
183
|
}
|
|
183
184
|
|
|
184
|
-
.
|
|
185
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline-light .completed .progress-indicator-horizontal-icon {
|
|
185
186
|
width: calc(2rem - 4px);
|
|
186
187
|
height: calc(2rem - 4px);
|
|
187
188
|
color: var(--road-secondary);
|
|
@@ -189,7 +190,7 @@
|
|
|
189
190
|
border: 2px solid var(--road-secondary);
|
|
190
191
|
}
|
|
191
192
|
|
|
192
|
-
.
|
|
193
|
+
.progress-indicator-horizontal-secondary .current .progress-indicator-horizontal-icon {
|
|
193
194
|
width: calc(2rem - 4px);
|
|
194
195
|
height: calc(2rem - 4px);
|
|
195
196
|
color: var(--road-grey-900);
|
|
@@ -197,17 +198,18 @@
|
|
|
197
198
|
border: 2px solid var(--road-secondary);
|
|
198
199
|
}
|
|
199
200
|
|
|
200
|
-
.
|
|
201
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline .current .progress-indicator-horizontal-icon {
|
|
201
202
|
color: var(--road-on-secondary);
|
|
202
203
|
background: var(--road-secondary);
|
|
203
204
|
}
|
|
204
205
|
|
|
205
|
-
.
|
|
206
|
+
.progress-indicator-horizontal-secondary.progress-indicator-horizontal-outline-light .current .progress-indicator-horizontal-icon {
|
|
206
207
|
color: var(--road-on-secondary);
|
|
207
208
|
background: var(--road-secondary);
|
|
208
209
|
}
|
|
209
210
|
|
|
210
|
-
.current .
|
|
211
|
+
.current .progress-indicator-horizontal-title,
|
|
212
|
+
.completed .progress-indicator-horizontal-title {
|
|
211
213
|
font-weight: 700;
|
|
212
214
|
color: var(--road-on-surface);
|
|
213
215
|
}
|
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
import { Host, h } from '@stencil/core';
|
|
2
2
|
/**
|
|
3
|
-
* @slot
|
|
3
|
+
* @slot progress-indicator-horizontal-icon - if the state of the step 1 is completed add
|
|
4
4
|
* `<road-icon name="check-small" class="d-block" color="white"></road-icon>` by default.
|
|
5
|
-
* `<road-icon name="check-small" class="d-block" color="
|
|
6
|
-
* `<road-icon name="check-small" class="d-block" color="defaut"></road-icon>`
|
|
5
|
+
* `<road-icon name="check-small" class="d-block" color="primary"></road-icon>` if is outline.
|
|
6
|
+
* `<road-icon name="check-small" class="d-block" color="defaut"></road-icon>`
|
|
7
7
|
* `<road-icon name="check-small" class="d-block" color="warning"></road-icon>` if the color is secondary and outline.
|
|
8
|
-
* @slot
|
|
9
|
-
* @slot
|
|
8
|
+
* @slot progress-indicator-horizontal-title
|
|
9
|
+
* @slot progress-indicator-horizontal-icon2 - if the state of the step 2 is completed add
|
|
10
10
|
* `<road-icon name="check-small" class="d-block" color="white"></road-icon>` by default.
|
|
11
|
-
* `<road-icon name="check-small" class="d-block" color="
|
|
12
|
-
* `<road-icon name="check-small" class="d-block" color="defaut"></road-icon>`
|
|
11
|
+
* `<road-icon name="check-small" class="d-block" color="primary"></road-icon>` if is outline.
|
|
12
|
+
* `<road-icon name="check-small" class="d-block" color="defaut"></road-icon>`
|
|
13
13
|
* `<road-icon name="check-small" class="d-block" color="warning"></road-icon>` if the color is secondary and outline.
|
|
14
|
-
* @slot
|
|
15
|
-
* @slot
|
|
14
|
+
* @slot progress-indicator-horizontal-title2
|
|
15
|
+
* @slot progress-indicator-horizontal-icon3 - if the state of the step 3 is completed add
|
|
16
16
|
* `<road-icon name="check-small" class="d-block" color="white"></road-icon>` by default.
|
|
17
|
-
* `<road-icon name="check-small" class="d-block" color="
|
|
18
|
-
* `<road-icon name="check-small" class="d-block" color="defaut"></road-icon
|
|
17
|
+
* `<road-icon name="check-small" class="d-block" color="primary"></road-icon>` if is outline.
|
|
18
|
+
* `<road-icon name="check-small" class="d-block" color="defaut"></road-icon>`.
|
|
19
19
|
* `<road-icon name="check-small" class="d-block" color="warning"></road-icon>` if the color is secondary and outline.
|
|
20
|
-
* @slot
|
|
20
|
+
* @slot progress-indicator-horizontal-title3
|
|
21
21
|
*/
|
|
22
22
|
export class Stepper {
|
|
23
23
|
constructor() {
|
|
24
24
|
/**
|
|
25
|
-
* The color
|
|
25
|
+
* The color progress-indicator-horizontal.
|
|
26
26
|
*/
|
|
27
27
|
this.color = 'default';
|
|
28
28
|
/**
|
|
@@ -35,27 +35,27 @@ export class Stepper {
|
|
|
35
35
|
this.outline = false;
|
|
36
36
|
}
|
|
37
37
|
render() {
|
|
38
|
-
const colorClass = this.color !== undefined ? `
|
|
39
|
-
const outlineClass = this.outline == true ? `
|
|
40
|
-
const lightClass = this.light == true ? `
|
|
41
|
-
const stateClass = this.stateFirstStep !== undefined ? `
|
|
42
|
-
const stateSecondStepClass = this.stateSecondStep !== undefined ? `
|
|
43
|
-
const stateThirdStepClass = this.stateSecondStep !== undefined ? `
|
|
38
|
+
const colorClass = this.color !== undefined ? `progress-indicator-horizontal progress-indicator-horizontal-${this.color}` : 'progress-indicator-horizontal';
|
|
39
|
+
const outlineClass = this.outline == true ? `progress-indicator-horizontal progress-indicator-horizontal-outline` : 'progress-indicator-horizontal';
|
|
40
|
+
const lightClass = this.light == true ? `progress-indicator-horizontal progress-indicator-horizontal-outline-light` : 'progress-indicator-horizontal';
|
|
41
|
+
const stateClass = this.stateFirstStep !== undefined ? `progress-indicator-horizontal-item ${this.stateFirstStep}` : 'progress-indicator-horizontal-item';
|
|
42
|
+
const stateSecondStepClass = this.stateSecondStep !== undefined ? `progress-indicator-horizontal-item ${this.stateSecondStep}` : 'progress-indicator-horizontal-item';
|
|
43
|
+
const stateThirdStepClass = this.stateSecondStep !== undefined ? `progress-indicator-horizontal-item ${this.stateThirdStep}` : 'progress-indicator-horizontal-item';
|
|
44
44
|
const urlStep1 = this.urlStep1 !== undefined ? `${this.urlStep1}` : '#';
|
|
45
45
|
const urlStep2 = this.urlStep2 !== undefined ? `${this.urlStep2}` : '#';
|
|
46
46
|
const urlStep3 = this.urlStep3 !== undefined ? `${this.urlStep3}` : '#';
|
|
47
|
-
return (h(Host, null, h("nav", null, h("ul", { class: `${colorClass} ${outlineClass} ${lightClass}` }, h("li", { class: `${stateClass}` }, h("a", { class: "
|
|
47
|
+
return (h(Host, null, h("nav", null, h("ul", { class: `${colorClass} ${outlineClass} ${lightClass}` }, h("li", { class: `${stateClass}` }, h("a", { class: "progress-indicator-horizontal-link", href: `${urlStep1}` }, h("span", { class: "progress-indicator-horizontal-icon" }, h("slot", { name: "progress-indicator-horizontal-icon" })), h("span", { class: "progress-indicator-horizontal-title" }, h("slot", { name: "progress-indicator-horizontal-title" })))), h("li", { class: `${stateSecondStepClass}` }, h("a", { class: "progress-indicator-horizontal-link", href: `${urlStep2}` }, h("span", { class: "progress-indicator-horizontal-icon" }, h("slot", { name: "progress-indicator-horizontal-icon2" })), h("span", { class: "progress-indicator-horizontal-title" }, h("slot", { name: "progress-indicator-horizontal-title2" })))), h("li", { class: `${stateThirdStepClass}` }, h("a", { class: "progress-indicator-horizontal-link", href: `${urlStep3}` }, h("span", { class: "progress-indicator-horizontal-icon" }, h("slot", { name: "progress-indicator-horizontal-icon3" })), h("span", { class: "progress-indicator-horizontal-title" }, h("slot", { name: "progress-indicator-horizontal-title3" }))))))));
|
|
48
48
|
}
|
|
49
|
-
static get is() { return "road-
|
|
49
|
+
static get is() { return "road-progress-indicator-horizontal"; }
|
|
50
50
|
static get encapsulation() { return "shadow"; }
|
|
51
51
|
static get originalStyleUrls() {
|
|
52
52
|
return {
|
|
53
|
-
"$": ["
|
|
53
|
+
"$": ["progress-indicator-horizontal.css"]
|
|
54
54
|
};
|
|
55
55
|
}
|
|
56
56
|
static get styleUrls() {
|
|
57
57
|
return {
|
|
58
|
-
"$": ["
|
|
58
|
+
"$": ["progress-indicator-horizontal.css"]
|
|
59
59
|
};
|
|
60
60
|
}
|
|
61
61
|
static get properties() {
|
|
@@ -72,7 +72,7 @@ export class Stepper {
|
|
|
72
72
|
"optional": true,
|
|
73
73
|
"docs": {
|
|
74
74
|
"tags": [],
|
|
75
|
-
"text": "The color
|
|
75
|
+
"text": "The color progress-indicator-horizontal."
|
|
76
76
|
},
|
|
77
77
|
"attribute": "color",
|
|
78
78
|
"reflect": true,
|