@roadtrip/components 3.14.0 → 3.14.2
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/road-card.cjs.entry.js +7 -6
- package/dist/cjs/road-card.cjs.entry.js.map +1 -1
- package/dist/cjs/road-dropdown.cjs.entry.js +3 -2
- package/dist/cjs/road-dropdown.cjs.entry.js.map +1 -1
- package/dist/collection/components/card/card.css +0 -1
- package/dist/collection/components/card/card.js +6 -5
- package/dist/collection/components/card/card.js.map +1 -1
- package/dist/collection/components/card/card.stories.js +0 -7
- package/dist/collection/components/dropdown/dropdown.css +10 -0
- package/dist/collection/components/dropdown/dropdown.js +2 -1
- package/dist/collection/components/dropdown/dropdown.js.map +1 -1
- package/dist/esm/road-card.entry.js +7 -6
- package/dist/esm/road-card.entry.js.map +1 -1
- package/dist/esm/road-dropdown.entry.js +3 -2
- package/dist/esm/road-dropdown.entry.js.map +1 -1
- package/dist/roadtrip/p-2a866428.entry.js +2 -0
- package/dist/roadtrip/p-2a866428.entry.js.map +1 -0
- package/dist/roadtrip/p-63fd28bd.entry.js +2 -0
- package/dist/roadtrip/p-63fd28bd.entry.js.map +1 -0
- package/dist/roadtrip/roadtrip.css +1 -1
- package/dist/roadtrip/roadtrip.esm.js +1 -1
- package/hydrate/index.js +10 -8
- package/package.json +1 -1
- package/dist/roadtrip/p-91098d39.entry.js +0 -2
- package/dist/roadtrip/p-91098d39.entry.js.map +0 -1
- package/dist/roadtrip/p-9c13b3e4.entry.js +0 -2
- package/dist/roadtrip/p-9c13b3e4.entry.js.map +0 -1
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-12592729.js');
|
|
6
6
|
|
|
7
|
-
const cardCss = ":host{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}@media (min-width: 768px){:host{padding:var(--road-spacing-06)}}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;
|
|
7
|
+
const cardCss = ":host{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}@media (min-width: 768px){:host{padding:var(--road-spacing-06)}}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
|
|
8
8
|
|
|
9
9
|
const Card = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -38,13 +38,12 @@ const Card = class {
|
|
|
38
38
|
}
|
|
39
39
|
renderCard() {
|
|
40
40
|
const clickable = this.isClickable();
|
|
41
|
-
const { elevation, href } = this;
|
|
42
|
-
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
43
41
|
if (!clickable) {
|
|
44
42
|
return [
|
|
45
|
-
index.h(
|
|
43
|
+
index.h("slot", null)
|
|
46
44
|
];
|
|
47
45
|
}
|
|
46
|
+
const { href } = this;
|
|
48
47
|
const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
|
|
49
48
|
const attrs = (TagType === 'button')
|
|
50
49
|
? { type: this.type }
|
|
@@ -54,10 +53,12 @@ const Card = class {
|
|
|
54
53
|
rel: this.rel,
|
|
55
54
|
target: this.target,
|
|
56
55
|
};
|
|
57
|
-
return (index.h(
|
|
56
|
+
return (index.h(TagType, Object.assign({}, attrs, { class: "card-native", part: "native", onClick: this.onClick }), index.h("slot", null)));
|
|
58
57
|
}
|
|
59
58
|
render() {
|
|
60
|
-
|
|
59
|
+
const { elevation } = this;
|
|
60
|
+
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
61
|
+
return (index.h(index.Host, { class: `${elevationClass}` }, this.renderCard()));
|
|
61
62
|
}
|
|
62
63
|
get el() { return index.getElement(this); }
|
|
63
64
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"road-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,OAAO,GAAG,
|
|
1
|
+
{"file":"road-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,OAAO,GAAG,wiCAAwiC;;MCa3iC,IAAI;;;;;IAoEP,YAAO,GAAG;;MAChB,IAAG,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;OACJ;KACF,CAAC;qBAxEoD,MAAM;kBAKlC,KAAK;;gBAUe,QAAQ;;;;;;EA0C9C,WAAW;IACjB,QAAQ,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,EAAE;GACjD;EAeO,UAAU;IAChB,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;IAErC,IAAI,CAAC,SAAS,EAAE;MAGd,OAAO;QACLA,qBAAO;OACR,CAAC;KAEH;IACD,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IACtB,MAAM,OAAO,GAAG,SAAS,IAAI,IAAI,KAAK,SAAS,GAAG,QAAQ,GAAG,GAAG,IAAI,KAAY,CAAC;IACjF,MAAM,KAAK,GAAG,CAAC,OAAO,KAAK,QAAQ;QAC/B,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;QACnB;QACA,QAAQ,EAAE,IAAI,CAAC,QAAQ;QACvB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,GAAG,EAAE,IAAI,CAAC,GAAG;QACb,MAAM,EAAE,IAAI,CAAC,MAAM;OACpB,CAAC;IAEJ,QAEEA,QAAC,OAAO,oBACF,KAAK,IACT,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,OAAO,KAErBA,qBAAO,CACC,EACV;GACH;EAED,MAAM;IACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,GAAG,kBAAkB,SAAS,EAAE,GAAG,EAAE,CAAC;IAC3E,QACEA,QAACC,UAAI,IAAC,KAAK,EAAE,GAAG,cAAc,EAAE,IAC/B,IAAI,CAAC,UAAU,EAAE,CACX,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["src/components/card/card.css?tag=road-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["/*\n * Card\n *\n * Index\n * - Card\n * - Native\n * - Icon\n */\n\n/* CARD\n -------------------- */\n\n:host {\n position: relative;\n box-sizing: border-box;\n display: block;\n padding: var(--road-spacing-05);\n margin-bottom: var(--margin-bottom, 1rem);\n background: var(--road-surface);\n border: 1px solid var(--road-outline-weak);\n border-radius: var(--road-spacing-02);\n}\n\n:host(.card-elevation-none) {\n box-shadow: none;\n}\n\n:host(.card-elevation-lowest) {\n box-shadow: var(--road-elevation-lowest);\n}\n\n:host(.card-elevation-average) {\n box-shadow: var(--road-elevation-average);\n}\n\n@media (min-width: 768px) {\n\n :host {\n padding: var(--road-spacing-06);\n }\n}\n\n/* NATIVE\n -------------------- */\n\n.card-native {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: 100%;\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n color: inherit;\n text-align: center;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n background: var(--road-surface);\n border: 0;\n border-radius: 0.25rem;\n outline: none;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\na,\nbutton {\n cursor: pointer;\n user-select: none;\n -webkit-user-drag: none;\n}\n\n/* ICON\n -------------------- */\n\n::slotted(road-icon) {\n text-align: center;\n}\n","import { Component, h, Prop, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n/**\n * @slot - Content of the card.\n *\n * @part native - The native HTML button, anchor, or div element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-card',\n styleUrl: 'card.css',\n shadow: true,\n})\nexport class Card {\n\n @Element() el!: HTMLRoadCardElement;\n\n /**\n * The elevation.\n */\n @Prop() elevation?: 'none' | 'lowest' | 'average' = 'none';\n\n /**\n * If `true`, a button tag will be rendered and the card will be tappable.\n */\n @Prop() button: boolean = false;\n\n /**\n * value of the card\n */\n @Prop() value?: string;\n\n /**\n * The type of the button. Only used when an `onclick` or `button` property is present.\n */\n @Prop() type: 'submit' | 'reset' | 'button' = 'button';\n\n /**\n * This attribute instructs browsers to download a URL instead of navigating to\n * it, so the user will be prompted to save it as a local file. If the attribute\n * has a value, it is used as the pre-filled file name in the Save prompt\n * (the user can still change the file name if they want).\n */\n @Prop() download?: string;\n\n /**\n * Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered.\n */\n @Prop() href?: string;\n\n /**\n * Specifies the relationship of the target object to the link object.\n * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n */\n @Prop() rel?: string;\n\n /**\n * Specifies where to display the linked URL.\n * Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n */\n @Prop() target?: string;\n\n /**\n * Emitted when the card is clicked and send the `value` of the card\n */\n @Event() roadcardclick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n /** @internal */\n @Event() roadCardClick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n\n private isClickable(): boolean {\n return (this.href !== undefined || this.button);\n }\n\n private onClick = () => {\n if(this.value !== undefined) {\n this.roadcardclick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n this.roadCardClick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n }\n };\n\n private renderCard() {\n const clickable = this.isClickable();\n\n if (!clickable) {\n \n \n return [\n <slot/>\n ];\n \n }\n const { href } = this;\n const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div' as any;\n const attrs = (TagType === 'button')\n ? { type: this.type }\n : {\n download: this.download,\n href: this.href,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n \n <TagType\n {...attrs}\n class=\"card-native\"\n part=\"native\"\n onClick={this.onClick}\n >\n <slot/>\n </TagType>\n );\n }\n\n render() {\n const { elevation } = this;\n const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;\n return (\n <Host class={`${elevationClass}`}>\n {this.renderCard()}\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-12592729.js');
|
|
6
6
|
|
|
7
|
-
const dropdownCss = ":host{--margin-top:0.5rem;display:block}.dropdown{position:relative;font-family:var(--road-font)}.dropdown summary{display:block;outline:none}.dropdown summary::-webkit-details-marker{display:none}.dropdown-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}.dropdown-medium-button{width:2.5rem;height:2.5rem}.dropdown-button:hover{background:var(--road-grey-200)}.position-right{display:flex;justify-content:flex-end}.bg-white{background:var(--road-grey-000)}.dropdown-button-icon{width:2.5rem;height:2.5rem}.dropdown-medium-button .dropdown-button-icon{width:1.75rem;height:1.75rem}.dropdown[open] .dropdown-menu{transform:scaleY(1)}.dropdown[open] .dropdown-menu.direction-top{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}.dropdown-menu{position:absolute;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}.dropdown-item{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}.dropdown-item-border{border-color:var(--road-outline-weak);border-bottom:1px solid}.dropdown-item:hover,.dropdown-item.focus-visible{background:var(--road-surface-inverse)}";
|
|
7
|
+
const dropdownCss = ":host{--margin-top:0.5rem;display:block}.dropdown{position:relative;font-family:var(--road-font)}.dropdown summary{display:block;outline:none}.dropdown summary::-webkit-details-marker{display:none}.dropdown-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}.dropdown-medium-button{width:2.5rem;height:2.5rem}.dropdown-button:hover{background:var(--road-grey-200)}.position-right{display:flex;justify-content:flex-end}.bg-white{background:var(--road-grey-000)}.dropdown-button-icon{width:2.5rem;height:2.5rem}.dropdown-medium-button .dropdown-button-icon{width:1.75rem;height:1.75rem}.dropdown[open] .dropdown-menu{transform:scaleY(1)}.dropdown[open] .dropdown-menu.direction-top{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}.dropdown-menu{position:absolute;z-index:1;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}.dropdown-left{left:0}.dropdown-right{right:0}.dropdown-item{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}.dropdown-item-border{border-color:var(--road-outline-weak);border-bottom:1px solid}.dropdown-item:hover,.dropdown-item.focus-visible{background:var(--road-surface-inverse)}";
|
|
8
8
|
|
|
9
9
|
const Dropdown = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -25,8 +25,9 @@ const Dropdown = class {
|
|
|
25
25
|
const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';
|
|
26
26
|
const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';
|
|
27
27
|
const positionClass = this.position !== undefined ? `position-${this.position}` : '';
|
|
28
|
+
const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';
|
|
28
29
|
const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';
|
|
29
|
-
return (index.h("details", { class: "dropdown", open: this.isOpen }, index.h("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, index.h("div", { class: `d-flex ${positionClass}` }, index.h("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, index.h("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), index.h("div", { class: `dropdown-menu ${directionClass}` }, index.h("slot", { name: "list" }))));
|
|
30
|
+
return (index.h("details", { class: "dropdown", open: this.isOpen }, index.h("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, index.h("div", { class: `d-flex ${positionClass}` }, index.h("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, index.h("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), index.h("div", { class: `dropdown-menu ${directionClass} ${dropdownClass}` }, index.h("slot", { name: "list" }))));
|
|
30
31
|
}
|
|
31
32
|
};
|
|
32
33
|
Dropdown.style = dropdownCss;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"road-dropdown.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,WAAW,GAAG,
|
|
1
|
+
{"file":"road-dropdown.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,WAAW,GAAG,2qDAA2qD;;MCalrD,QAAQ;;;;;;IA8BX,YAAO,GAAG;MAChB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;KAC5B,CAAC;kBA3B0C,KAAK;mBAKnB,KAAK;oBAKJ,KAAK;;qBAUsB,QAAQ;;EASlE,MAAM;IAEJ,MAAM,qBAAqB,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,GAAG,iBAAiB,GAAG,0BAA0B,CAAC;IACpG,MAAM,sBAAsB,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,GAAG,wCAAwC,GAAG,0BAA0B,CAAC;IAC7H,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,GAAG,YAAY,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC;IACrF,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,GAAG,YAAY,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC;IACrF,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,KAAK,SAAS,GAAG,aAAa,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,CAAC;IAGzF,QACEA,qBAAS,KAAK,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,MAAM,IACzCA,sCAAwB,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,IACxFA,iBAAK,KAAK,EAAE,UAAU,aAAa,EAAE,IACnCA,iBAAK,KAAK,EAAE,GAAG,qBAAqB,IAAI,sBAAsB,EAAE,IAC9DA,uBAAW,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,sBAAsB,GAAa,CACvE,CACF,CACE,EACVA,iBAAK,KAAK,EAAE,iBAAiB,cAAc,IAAI,aAAa,EAAE,IAC5DA,kBAAM,IAAI,EAAC,MAAM,GAAE,CACf,CACE,EACV;GACH;;;;;;","names":["h"],"sources":["src/components/dropdown/dropdown.css?tag=road-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * Dropdown\n *\n * Index\n * - Dropdown\n * - Dropdown menu\n */\n\n/**\n * @prop --margin-top: Top margin of the menu\n */\n\n/* DROPDOWN\n -------------------- */\n\n:host {\n --margin-top: 0.5rem;\n display: block;\n}\n\n.dropdown {\n position: relative;\n font-family: var(--road-font);\n}\n\n.dropdown summary {\n display: block;\n outline: none;\n}\n\n.dropdown summary::-webkit-details-marker { /* remove native arrow */\n display: none;\n}\n\n.dropdown-button{\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 3.5rem;\n height: 3.5rem;\n cursor: pointer;\n border-radius: 0.25rem;\n}\n\n.dropdown-medium-button{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-button:hover{\n background: var(--road-grey-200);\n}\n\n.position-right{\n display: flex;\n justify-content: flex-end;\n}\n\n.bg-white{\n background: var(--road-grey-000);\n}\n\n.dropdown-button-icon{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-medium-button .dropdown-button-icon{\n width: 1.75rem;\n height: 1.75rem;\n}\n\n/**\n * Open state\n */\n\n.dropdown[open] .dropdown-menu {\n transform: scaleY(1);\n}\n\n.dropdown[open] .dropdown-menu.direction-top {\n position: absolute;\n bottom: 0;\n left: 0;\n transform: translate3d(0, -56px, 0);\n will-change: transform;\n}\n\n/* MENU\n -------------------- */\n\n.dropdown-menu {\n position: absolute;\n z-index: 1;\n display: flex;\n flex-direction: column;\n width: 100%;\n min-width: 16.875rem;\n padding: 0.5rem 0;\n color: var(--road-on-surface);\n background: var(--road-surface);\n border: 1px solid;\n border-color: var(--road-outline-weak);\n border-radius: 0.25rem;\n box-shadow: var(--road-elevation-low);\n transition: transform 0.2s ease-in-out;\n transform: scaleY(0);\n transform-origin: 0 0;\n}\n\n.dropdown-left {\n left: 0;\n}\n\n.dropdown-right {\n right: 0;\n}\n\n\n/* ITEM\n -------------------- */\n\n.dropdown-item {\n min-height: 40px;\n padding: 0 1rem;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n text-align: left;\n text-decoration: none;\n cursor: pointer;\n background: var(--road-surface);\n border: none;\n outline: none;\n}\n\n.dropdown-item-border {\n border-color: var(--road-outline-weak);\n border-bottom: 1px solid;\n}\n\n/**\n * Hover state\n */\n\n.dropdown-item:hover,\n.dropdown-item.focus-visible {\n background: var(--road-surface-inverse);\n}\n\n\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - Element how will open the dropdown when clicked\n * @slot list - List of item values (you can add border with lines=`full` but not on the last item)\n)\n */\n\n@Component({\n tag: 'road-dropdown',\n styleUrl: 'dropdown.css',\n shadow: true,\n})\nexport class Dropdown {\n\n /**\n * Set to `true` to open the dropdown menu and to `false` to close it.\n */\n @Prop({ mutable: true }) isOpen : boolean = false;\n\n /**\n * If you want to remove background of the dropdown button\n */\n @Prop() isLight : boolean = false;\n \n /**\n * If you want a medium dropdown\n */\n @Prop() isMedium : boolean = false;\n\n /**\n * The button position.\n */\n @Prop({ reflect: true }) position?: 'left' | 'right';\n\n /**\n * The opening direction.\n */\n @Prop({ reflect: true }) direction?: 'top' | 'bottom' = 'bottom';\n\n /**\n * Toggle the display when clicking element in slot\n */\n private onClick = () => {\n this.isOpen = !this.isOpen;\n };\n\n render() {\n\n const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';\n const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';\n const positionClass = this.position !== undefined ? `position-${this.position}` : '';\n const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';\n const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';\n\n\n return (\n <details class=\"dropdown\" open={this.isOpen}>\n <summary aria-expanded={`${this.isOpen}`} tabindex=\"0\" role=\"button\" onClick={this.onClick}>\n <div class={`d-flex ${positionClass}`}>\n <div class={`${isLightButtonDropDown} ${isMediumButtonDropDown}`}>\n <road-icon name=\"navigation-more\" class=\"dropdown-button-icon\"></road-icon>\n </div>\n </div>\n </summary>\n <div class={`dropdown-menu ${directionClass} ${dropdownClass}`}>\n <slot name=\"list\"/>\n </div>\n </details>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -33,13 +33,12 @@ export class Card {
|
|
|
33
33
|
}
|
|
34
34
|
renderCard() {
|
|
35
35
|
const clickable = this.isClickable();
|
|
36
|
-
const { elevation, href } = this;
|
|
37
|
-
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
38
36
|
if (!clickable) {
|
|
39
37
|
return [
|
|
40
|
-
h(
|
|
38
|
+
h("slot", null)
|
|
41
39
|
];
|
|
42
40
|
}
|
|
41
|
+
const { href } = this;
|
|
43
42
|
const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
|
|
44
43
|
const attrs = (TagType === 'button')
|
|
45
44
|
? { type: this.type }
|
|
@@ -49,10 +48,12 @@ export class Card {
|
|
|
49
48
|
rel: this.rel,
|
|
50
49
|
target: this.target,
|
|
51
50
|
};
|
|
52
|
-
return (h(
|
|
51
|
+
return (h(TagType, Object.assign({}, attrs, { class: "card-native", part: "native", onClick: this.onClick }), h("slot", null)));
|
|
53
52
|
}
|
|
54
53
|
render() {
|
|
55
|
-
|
|
54
|
+
const { elevation } = this;
|
|
55
|
+
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
56
|
+
return (h(Host, { class: `${elevationClass}` }, this.renderCard()));
|
|
56
57
|
}
|
|
57
58
|
static get is() { return "road-card"; }
|
|
58
59
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../src/components/card/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEvF;;;;GAIG;AAOH,MAAM,OAAO,IAAI;;IAoEP,YAAO,GAAG,GAAG,EAAE;;MACrB,IAAG,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;OACJ;IACH,CAAC,CAAC;qBAxEoD,MAAM;kBAKlC,KAAK;;gBAUe,QAAQ;;;;;;EA0C9C,WAAW;IACjB,OAAO,CAAC,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC;EAClD,CAAC;EAeO,UAAU;IAChB,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../src/components/card/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEvF;;;;GAIG;AAOH,MAAM,OAAO,IAAI;;IAoEP,YAAO,GAAG,GAAG,EAAE;;MACrB,IAAG,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;OACJ;IACH,CAAC,CAAC;qBAxEoD,MAAM;kBAKlC,KAAK;;gBAUe,QAAQ;;;;;;EA0C9C,WAAW;IACjB,OAAO,CAAC,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC;EAClD,CAAC;EAeO,UAAU;IAChB,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;IAErC,IAAI,CAAC,SAAS,EAAE;MAGd,OAAO;QACL,eAAO;OACR,CAAC;KAEH;IACD,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IACtB,MAAM,OAAO,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAY,CAAC;IACjF,MAAM,KAAK,GAAG,CAAC,OAAO,KAAK,QAAQ,CAAC;MAClC,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;MACrB,CAAC,CAAC;QACA,QAAQ,EAAE,IAAI,CAAC,QAAQ;QACvB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,GAAG,EAAE,IAAI,CAAC,GAAG;QACb,MAAM,EAAE,IAAI,CAAC,MAAM;OACpB,CAAC;IAEJ,OAAO,CAEL,EAAC,OAAO,oBACF,KAAK,IACT,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,OAAO;MAErB,eAAO,CACC,CACX,CAAC;EACJ,CAAC;EAED,MAAM;IACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3E,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,GAAG,cAAc,EAAE,IAC/B,IAAI,CAAC,UAAU,EAAE,CACX,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n/**\n * @slot - Content of the card.\n *\n * @part native - The native HTML button, anchor, or div element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-card',\n styleUrl: 'card.css',\n shadow: true,\n})\nexport class Card {\n\n @Element() el!: HTMLRoadCardElement;\n\n /**\n * The elevation.\n */\n @Prop() elevation?: 'none' | 'lowest' | 'average' = 'none';\n\n /**\n * If `true`, a button tag will be rendered and the card will be tappable.\n */\n @Prop() button: boolean = false;\n\n /**\n * value of the card\n */\n @Prop() value?: string;\n\n /**\n * The type of the button. Only used when an `onclick` or `button` property is present.\n */\n @Prop() type: 'submit' | 'reset' | 'button' = 'button';\n\n /**\n * This attribute instructs browsers to download a URL instead of navigating to\n * it, so the user will be prompted to save it as a local file. If the attribute\n * has a value, it is used as the pre-filled file name in the Save prompt\n * (the user can still change the file name if they want).\n */\n @Prop() download?: string;\n\n /**\n * Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered.\n */\n @Prop() href?: string;\n\n /**\n * Specifies the relationship of the target object to the link object.\n * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n */\n @Prop() rel?: string;\n\n /**\n * Specifies where to display the linked URL.\n * Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n */\n @Prop() target?: string;\n\n /**\n * Emitted when the card is clicked and send the `value` of the card\n */\n @Event() roadcardclick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n /** @internal */\n @Event() roadCardClick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n\n private isClickable(): boolean {\n return (this.href !== undefined || this.button);\n }\n\n private onClick = () => {\n if(this.value !== undefined) {\n this.roadcardclick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n this.roadCardClick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n }\n };\n\n private renderCard() {\n const clickable = this.isClickable();\n\n if (!clickable) {\n \n \n return [\n <slot/>\n ];\n \n }\n const { href } = this;\n const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div' as any;\n const attrs = (TagType === 'button')\n ? { type: this.type }\n : {\n download: this.download,\n href: this.href,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n \n <TagType\n {...attrs}\n class=\"card-native\"\n part=\"native\"\n onClick={this.onClick}\n >\n <slot/>\n </TagType>\n );\n }\n\n render() {\n const { elevation } = this;\n const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;\n return (\n <Host class={`${elevationClass}`}>\n {this.renderCard()}\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -25,13 +25,6 @@ export default {
|
|
|
25
25
|
},
|
|
26
26
|
};
|
|
27
27
|
|
|
28
|
-
const Template = (args) => html`
|
|
29
|
-
<road-card button value="125"
|
|
30
|
-
elevation="${ifDefined(args.elevation)}">
|
|
31
|
-
<road-label>125</road-label>
|
|
32
|
-
</road-card>
|
|
33
|
-
`;
|
|
34
|
-
|
|
35
28
|
export const Value = (args) => html`
|
|
36
29
|
<road-grid>
|
|
37
30
|
<road-row>
|
|
@@ -93,6 +93,7 @@
|
|
|
93
93
|
|
|
94
94
|
.dropdown-menu {
|
|
95
95
|
position: absolute;
|
|
96
|
+
z-index: 1;
|
|
96
97
|
display: flex;
|
|
97
98
|
flex-direction: column;
|
|
98
99
|
width: 100%;
|
|
@@ -109,6 +110,15 @@
|
|
|
109
110
|
transform-origin: 0 0;
|
|
110
111
|
}
|
|
111
112
|
|
|
113
|
+
.dropdown-left {
|
|
114
|
+
left: 0;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.dropdown-right {
|
|
118
|
+
right: 0;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
|
|
112
122
|
/* ITEM
|
|
113
123
|
-------------------- */
|
|
114
124
|
|
|
@@ -22,8 +22,9 @@ export class Dropdown {
|
|
|
22
22
|
const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';
|
|
23
23
|
const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';
|
|
24
24
|
const positionClass = this.position !== undefined ? `position-${this.position}` : '';
|
|
25
|
+
const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';
|
|
25
26
|
const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';
|
|
26
|
-
return (h("details", { class: "dropdown", open: this.isOpen }, h("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, h("div", { class: `d-flex ${positionClass}` }, h("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, h("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), h("div", { class: `dropdown-menu ${directionClass}` }, h("slot", { name: "list" }))));
|
|
27
|
+
return (h("details", { class: "dropdown", open: this.isOpen }, h("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, h("div", { class: `d-flex ${positionClass}` }, h("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, h("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), h("div", { class: `dropdown-menu ${directionClass} ${dropdownClass}` }, h("slot", { name: "list" }))));
|
|
27
28
|
}
|
|
28
29
|
static get is() { return "road-dropdown"; }
|
|
29
30
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;;GAIG;AAOH,MAAM,OAAO,QAAQ;;IA2BnB;;OAEG;IACK,YAAO,GAAG,GAAG,EAAE;MACrB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC7B,CAAC,CAAC;kBA3B0C,KAAK;mBAKnB,KAAK;oBAKJ,KAAK;;qBAUsB,QAAQ;;EASlE,MAAM;IAEJ,MAAM,qBAAqB,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,0BAA0B,CAAC;IACpG,MAAM,sBAAsB,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,CAAC,CAAC,wCAAwC,CAAC,CAAC,CAAC,0BAA0B,CAAC;IAC7H,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IACrF,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,aAAa,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAGzF,OAAO,CACL,eAAS,KAAK,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,MAAM;MACzC,gCAAwB,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO;QACxF,WAAK,KAAK,EAAE,UAAU,aAAa,EAAE;UACnC,WAAK,KAAK,EAAE,GAAG,qBAAqB,IAAI,sBAAsB,EAAE;YAC9D,iBAAW,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,sBAAsB,GAAa,CACvE,CACF,CACE;MACV,WAAK,KAAK,EAAE,iBAAiB,cAAc,EAAE;
|
|
1
|
+
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;;GAIG;AAOH,MAAM,OAAO,QAAQ;;IA2BnB;;OAEG;IACK,YAAO,GAAG,GAAG,EAAE;MACrB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC7B,CAAC,CAAC;kBA3B0C,KAAK;mBAKnB,KAAK;oBAKJ,KAAK;;qBAUsB,QAAQ;;EASlE,MAAM;IAEJ,MAAM,qBAAqB,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,0BAA0B,CAAC;IACpG,MAAM,sBAAsB,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,CAAC,CAAC,wCAAwC,CAAC,CAAC,CAAC,0BAA0B,CAAC;IAC7H,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IACrF,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IACrF,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,aAAa,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IAGzF,OAAO,CACL,eAAS,KAAK,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,MAAM;MACzC,gCAAwB,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO;QACxF,WAAK,KAAK,EAAE,UAAU,aAAa,EAAE;UACnC,WAAK,KAAK,EAAE,GAAG,qBAAqB,IAAI,sBAAsB,EAAE;YAC9D,iBAAW,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,sBAAsB,GAAa,CACvE,CACF,CACE;MACV,WAAK,KAAK,EAAE,iBAAiB,cAAc,IAAI,aAAa,EAAE;QAC5D,YAAM,IAAI,EAAC,MAAM,GAAE,CACf,CACE,CACX,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - Element how will open the dropdown when clicked\n * @slot list - List of item values (you can add border with lines=`full` but not on the last item)\n)\n */\n\n@Component({\n tag: 'road-dropdown',\n styleUrl: 'dropdown.css',\n shadow: true,\n})\nexport class Dropdown {\n\n /**\n * Set to `true` to open the dropdown menu and to `false` to close it.\n */\n @Prop({ mutable: true }) isOpen : boolean = false;\n\n /**\n * If you want to remove background of the dropdown button\n */\n @Prop() isLight : boolean = false;\n \n /**\n * If you want a medium dropdown\n */\n @Prop() isMedium : boolean = false;\n\n /**\n * The button position.\n */\n @Prop({ reflect: true }) position?: 'left' | 'right';\n\n /**\n * The opening direction.\n */\n @Prop({ reflect: true }) direction?: 'top' | 'bottom' = 'bottom';\n\n /**\n * Toggle the display when clicking element in slot\n */\n private onClick = () => {\n this.isOpen = !this.isOpen;\n };\n\n render() {\n\n const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';\n const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';\n const positionClass = this.position !== undefined ? `position-${this.position}` : '';\n const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';\n const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';\n\n\n return (\n <details class=\"dropdown\" open={this.isOpen}>\n <summary aria-expanded={`${this.isOpen}`} tabindex=\"0\" role=\"button\" onClick={this.onClick}>\n <div class={`d-flex ${positionClass}`}>\n <div class={`${isLightButtonDropDown} ${isMediumButtonDropDown}`}>\n <road-icon name=\"navigation-more\" class=\"dropdown-button-icon\"></road-icon>\n </div>\n </div>\n </summary>\n <div class={`dropdown-menu ${directionClass} ${dropdownClass}`}>\n <slot name=\"list\"/>\n </div>\n </details>\n );\n }\n\n}\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-52302079.js';
|
|
2
2
|
|
|
3
|
-
const cardCss = ":host{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}@media (min-width: 768px){:host{padding:var(--road-spacing-06)}}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;
|
|
3
|
+
const cardCss = ":host{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}@media (min-width: 768px){:host{padding:var(--road-spacing-06)}}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
|
|
4
4
|
|
|
5
5
|
const Card = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -34,13 +34,12 @@ const Card = class {
|
|
|
34
34
|
}
|
|
35
35
|
renderCard() {
|
|
36
36
|
const clickable = this.isClickable();
|
|
37
|
-
const { elevation, href } = this;
|
|
38
|
-
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
39
37
|
if (!clickable) {
|
|
40
38
|
return [
|
|
41
|
-
h(
|
|
39
|
+
h("slot", null)
|
|
42
40
|
];
|
|
43
41
|
}
|
|
42
|
+
const { href } = this;
|
|
44
43
|
const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
|
|
45
44
|
const attrs = (TagType === 'button')
|
|
46
45
|
? { type: this.type }
|
|
@@ -50,10 +49,12 @@ const Card = class {
|
|
|
50
49
|
rel: this.rel,
|
|
51
50
|
target: this.target,
|
|
52
51
|
};
|
|
53
|
-
return (h(
|
|
52
|
+
return (h(TagType, Object.assign({}, attrs, { class: "card-native", part: "native", onClick: this.onClick }), h("slot", null)));
|
|
54
53
|
}
|
|
55
54
|
render() {
|
|
56
|
-
|
|
55
|
+
const { elevation } = this;
|
|
56
|
+
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
57
|
+
return (h(Host, { class: `${elevationClass}` }, this.renderCard()));
|
|
57
58
|
}
|
|
58
59
|
get el() { return getElement(this); }
|
|
59
60
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"road-card.entry.js","mappings":";;AAAA,MAAM,OAAO,GAAG,
|
|
1
|
+
{"file":"road-card.entry.js","mappings":";;AAAA,MAAM,OAAO,GAAG,wiCAAwiC;;MCa3iC,IAAI;;;;;IAoEP,YAAO,GAAG;;MAChB,IAAG,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACtB,KAAK,EAAE,IAAI,CAAC,KAAK;UACjB,KAAK,EAAE,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,YAAY,CAAC,0CAAE,WAAW;SACxD,CAAC,CAAC;OACJ;KACF,CAAC;qBAxEoD,MAAM;kBAKlC,KAAK;;gBAUe,QAAQ;;;;;;EA0C9C,WAAW;IACjB,QAAQ,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,EAAE;GACjD;EAeO,UAAU;IAChB,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;IAErC,IAAI,CAAC,SAAS,EAAE;MAGd,OAAO;QACL,eAAO;OACR,CAAC;KAEH;IACD,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IACtB,MAAM,OAAO,GAAG,SAAS,IAAI,IAAI,KAAK,SAAS,GAAG,QAAQ,GAAG,GAAG,IAAI,KAAY,CAAC;IACjF,MAAM,KAAK,GAAG,CAAC,OAAO,KAAK,QAAQ;QAC/B,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;QACnB;QACA,QAAQ,EAAE,IAAI,CAAC,QAAQ;QACvB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,GAAG,EAAE,IAAI,CAAC,GAAG;QACb,MAAM,EAAE,IAAI,CAAC,MAAM;OACpB,CAAC;IAEJ,QAEE,EAAC,OAAO,oBACF,KAAK,IACT,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,OAAO,KAErB,eAAO,CACC,EACV;GACH;EAED,MAAM;IACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,GAAG,kBAAkB,SAAS,EAAE,GAAG,EAAE,CAAC;IAC3E,QACE,EAAC,IAAI,IAAC,KAAK,EAAE,GAAG,cAAc,EAAE,IAC/B,IAAI,CAAC,UAAU,EAAE,CACX,EACP;GACH;;;;;;;","names":[],"sources":["src/components/card/card.css?tag=road-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["/*\n * Card\n *\n * Index\n * - Card\n * - Native\n * - Icon\n */\n\n/* CARD\n -------------------- */\n\n:host {\n position: relative;\n box-sizing: border-box;\n display: block;\n padding: var(--road-spacing-05);\n margin-bottom: var(--margin-bottom, 1rem);\n background: var(--road-surface);\n border: 1px solid var(--road-outline-weak);\n border-radius: var(--road-spacing-02);\n}\n\n:host(.card-elevation-none) {\n box-shadow: none;\n}\n\n:host(.card-elevation-lowest) {\n box-shadow: var(--road-elevation-lowest);\n}\n\n:host(.card-elevation-average) {\n box-shadow: var(--road-elevation-average);\n}\n\n@media (min-width: 768px) {\n\n :host {\n padding: var(--road-spacing-06);\n }\n}\n\n/* NATIVE\n -------------------- */\n\n.card-native {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: 100%;\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n color: inherit;\n text-align: center;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n background: var(--road-surface);\n border: 0;\n border-radius: 0.25rem;\n outline: none;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\na,\nbutton {\n cursor: pointer;\n user-select: none;\n -webkit-user-drag: none;\n}\n\n/* ICON\n -------------------- */\n\n::slotted(road-icon) {\n text-align: center;\n}\n","import { Component, h, Prop, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n/**\n * @slot - Content of the card.\n *\n * @part native - The native HTML button, anchor, or div element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-card',\n styleUrl: 'card.css',\n shadow: true,\n})\nexport class Card {\n\n @Element() el!: HTMLRoadCardElement;\n\n /**\n * The elevation.\n */\n @Prop() elevation?: 'none' | 'lowest' | 'average' = 'none';\n\n /**\n * If `true`, a button tag will be rendered and the card will be tappable.\n */\n @Prop() button: boolean = false;\n\n /**\n * value of the card\n */\n @Prop() value?: string;\n\n /**\n * The type of the button. Only used when an `onclick` or `button` property is present.\n */\n @Prop() type: 'submit' | 'reset' | 'button' = 'button';\n\n /**\n * This attribute instructs browsers to download a URL instead of navigating to\n * it, so the user will be prompted to save it as a local file. If the attribute\n * has a value, it is used as the pre-filled file name in the Save prompt\n * (the user can still change the file name if they want).\n */\n @Prop() download?: string;\n\n /**\n * Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered.\n */\n @Prop() href?: string;\n\n /**\n * Specifies the relationship of the target object to the link object.\n * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n */\n @Prop() rel?: string;\n\n /**\n * Specifies where to display the linked URL.\n * Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n */\n @Prop() target?: string;\n\n /**\n * Emitted when the card is clicked and send the `value` of the card\n */\n @Event() roadcardclick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n /** @internal */\n @Event() roadCardClick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n\n private isClickable(): boolean {\n return (this.href !== undefined || this.button);\n }\n\n private onClick = () => {\n if(this.value !== undefined) {\n this.roadcardclick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n this.roadCardClick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n }\n };\n\n private renderCard() {\n const clickable = this.isClickable();\n\n if (!clickable) {\n \n \n return [\n <slot/>\n ];\n \n }\n const { href } = this;\n const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div' as any;\n const attrs = (TagType === 'button')\n ? { type: this.type }\n : {\n download: this.download,\n href: this.href,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n \n <TagType\n {...attrs}\n class=\"card-native\"\n part=\"native\"\n onClick={this.onClick}\n >\n <slot/>\n </TagType>\n );\n }\n\n render() {\n const { elevation } = this;\n const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;\n return (\n <Host class={`${elevationClass}`}>\n {this.renderCard()}\n </Host>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h } from './index-52302079.js';
|
|
2
2
|
|
|
3
|
-
const dropdownCss = ":host{--margin-top:0.5rem;display:block}.dropdown{position:relative;font-family:var(--road-font)}.dropdown summary{display:block;outline:none}.dropdown summary::-webkit-details-marker{display:none}.dropdown-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}.dropdown-medium-button{width:2.5rem;height:2.5rem}.dropdown-button:hover{background:var(--road-grey-200)}.position-right{display:flex;justify-content:flex-end}.bg-white{background:var(--road-grey-000)}.dropdown-button-icon{width:2.5rem;height:2.5rem}.dropdown-medium-button .dropdown-button-icon{width:1.75rem;height:1.75rem}.dropdown[open] .dropdown-menu{transform:scaleY(1)}.dropdown[open] .dropdown-menu.direction-top{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}.dropdown-menu{position:absolute;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}.dropdown-item{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}.dropdown-item-border{border-color:var(--road-outline-weak);border-bottom:1px solid}.dropdown-item:hover,.dropdown-item.focus-visible{background:var(--road-surface-inverse)}";
|
|
3
|
+
const dropdownCss = ":host{--margin-top:0.5rem;display:block}.dropdown{position:relative;font-family:var(--road-font)}.dropdown summary{display:block;outline:none}.dropdown summary::-webkit-details-marker{display:none}.dropdown-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}.dropdown-medium-button{width:2.5rem;height:2.5rem}.dropdown-button:hover{background:var(--road-grey-200)}.position-right{display:flex;justify-content:flex-end}.bg-white{background:var(--road-grey-000)}.dropdown-button-icon{width:2.5rem;height:2.5rem}.dropdown-medium-button .dropdown-button-icon{width:1.75rem;height:1.75rem}.dropdown[open] .dropdown-menu{transform:scaleY(1)}.dropdown[open] .dropdown-menu.direction-top{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}.dropdown-menu{position:absolute;z-index:1;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}.dropdown-left{left:0}.dropdown-right{right:0}.dropdown-item{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}.dropdown-item-border{border-color:var(--road-outline-weak);border-bottom:1px solid}.dropdown-item:hover,.dropdown-item.focus-visible{background:var(--road-surface-inverse)}";
|
|
4
4
|
|
|
5
5
|
const Dropdown = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -21,8 +21,9 @@ const Dropdown = class {
|
|
|
21
21
|
const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';
|
|
22
22
|
const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';
|
|
23
23
|
const positionClass = this.position !== undefined ? `position-${this.position}` : '';
|
|
24
|
+
const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';
|
|
24
25
|
const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';
|
|
25
|
-
return (h("details", { class: "dropdown", open: this.isOpen }, h("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, h("div", { class: `d-flex ${positionClass}` }, h("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, h("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), h("div", { class: `dropdown-menu ${directionClass}` }, h("slot", { name: "list" }))));
|
|
26
|
+
return (h("details", { class: "dropdown", open: this.isOpen }, h("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, h("div", { class: `d-flex ${positionClass}` }, h("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, h("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), h("div", { class: `dropdown-menu ${directionClass} ${dropdownClass}` }, h("slot", { name: "list" }))));
|
|
26
27
|
}
|
|
27
28
|
};
|
|
28
29
|
Dropdown.style = dropdownCss;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"road-dropdown.entry.js","mappings":";;AAAA,MAAM,WAAW,GAAG,
|
|
1
|
+
{"file":"road-dropdown.entry.js","mappings":";;AAAA,MAAM,WAAW,GAAG,2qDAA2qD;;MCalrD,QAAQ;;;;;;IA8BX,YAAO,GAAG;MAChB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;KAC5B,CAAC;kBA3B0C,KAAK;mBAKnB,KAAK;oBAKJ,KAAK;;qBAUsB,QAAQ;;EASlE,MAAM;IAEJ,MAAM,qBAAqB,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,GAAG,iBAAiB,GAAG,0BAA0B,CAAC;IACpG,MAAM,sBAAsB,GAAG,IAAI,CAAC,QAAQ,IAAI,IAAI,GAAG,wCAAwC,GAAG,0BAA0B,CAAC;IAC7H,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,GAAG,YAAY,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC;IACrF,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,GAAG,YAAY,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC;IACrF,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,KAAK,SAAS,GAAG,aAAa,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,CAAC;IAGzF,QACE,eAAS,KAAK,EAAC,UAAU,EAAC,IAAI,EAAE,IAAI,CAAC,MAAM,IACzC,gCAAwB,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,IACxF,WAAK,KAAK,EAAE,UAAU,aAAa,EAAE,IACnC,WAAK,KAAK,EAAE,GAAG,qBAAqB,IAAI,sBAAsB,EAAE,IAC9D,iBAAW,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,sBAAsB,GAAa,CACvE,CACF,CACE,EACV,WAAK,KAAK,EAAE,iBAAiB,cAAc,IAAI,aAAa,EAAE,IAC5D,YAAM,IAAI,EAAC,MAAM,GAAE,CACf,CACE,EACV;GACH;;;;;;","names":[],"sources":["src/components/dropdown/dropdown.css?tag=road-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * Dropdown\n *\n * Index\n * - Dropdown\n * - Dropdown menu\n */\n\n/**\n * @prop --margin-top: Top margin of the menu\n */\n\n/* DROPDOWN\n -------------------- */\n\n:host {\n --margin-top: 0.5rem;\n display: block;\n}\n\n.dropdown {\n position: relative;\n font-family: var(--road-font);\n}\n\n.dropdown summary {\n display: block;\n outline: none;\n}\n\n.dropdown summary::-webkit-details-marker { /* remove native arrow */\n display: none;\n}\n\n.dropdown-button{\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 3.5rem;\n height: 3.5rem;\n cursor: pointer;\n border-radius: 0.25rem;\n}\n\n.dropdown-medium-button{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-button:hover{\n background: var(--road-grey-200);\n}\n\n.position-right{\n display: flex;\n justify-content: flex-end;\n}\n\n.bg-white{\n background: var(--road-grey-000);\n}\n\n.dropdown-button-icon{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-medium-button .dropdown-button-icon{\n width: 1.75rem;\n height: 1.75rem;\n}\n\n/**\n * Open state\n */\n\n.dropdown[open] .dropdown-menu {\n transform: scaleY(1);\n}\n\n.dropdown[open] .dropdown-menu.direction-top {\n position: absolute;\n bottom: 0;\n left: 0;\n transform: translate3d(0, -56px, 0);\n will-change: transform;\n}\n\n/* MENU\n -------------------- */\n\n.dropdown-menu {\n position: absolute;\n z-index: 1;\n display: flex;\n flex-direction: column;\n width: 100%;\n min-width: 16.875rem;\n padding: 0.5rem 0;\n color: var(--road-on-surface);\n background: var(--road-surface);\n border: 1px solid;\n border-color: var(--road-outline-weak);\n border-radius: 0.25rem;\n box-shadow: var(--road-elevation-low);\n transition: transform 0.2s ease-in-out;\n transform: scaleY(0);\n transform-origin: 0 0;\n}\n\n.dropdown-left {\n left: 0;\n}\n\n.dropdown-right {\n right: 0;\n}\n\n\n/* ITEM\n -------------------- */\n\n.dropdown-item {\n min-height: 40px;\n padding: 0 1rem;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n text-align: left;\n text-decoration: none;\n cursor: pointer;\n background: var(--road-surface);\n border: none;\n outline: none;\n}\n\n.dropdown-item-border {\n border-color: var(--road-outline-weak);\n border-bottom: 1px solid;\n}\n\n/**\n * Hover state\n */\n\n.dropdown-item:hover,\n.dropdown-item.focus-visible {\n background: var(--road-surface-inverse);\n}\n\n\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - Element how will open the dropdown when clicked\n * @slot list - List of item values (you can add border with lines=`full` but not on the last item)\n)\n */\n\n@Component({\n tag: 'road-dropdown',\n styleUrl: 'dropdown.css',\n shadow: true,\n})\nexport class Dropdown {\n\n /**\n * Set to `true` to open the dropdown menu and to `false` to close it.\n */\n @Prop({ mutable: true }) isOpen : boolean = false;\n\n /**\n * If you want to remove background of the dropdown button\n */\n @Prop() isLight : boolean = false;\n \n /**\n * If you want a medium dropdown\n */\n @Prop() isMedium : boolean = false;\n\n /**\n * The button position.\n */\n @Prop({ reflect: true }) position?: 'left' | 'right';\n\n /**\n * The opening direction.\n */\n @Prop({ reflect: true }) direction?: 'top' | 'bottom' = 'bottom';\n\n /**\n * Toggle the display when clicking element in slot\n */\n private onClick = () => {\n this.isOpen = !this.isOpen;\n };\n\n render() {\n\n const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';\n const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';\n const positionClass = this.position !== undefined ? `position-${this.position}` : '';\n const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';\n const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';\n\n\n return (\n <details class=\"dropdown\" open={this.isOpen}>\n <summary aria-expanded={`${this.isOpen}`} tabindex=\"0\" role=\"button\" onClick={this.onClick}>\n <div class={`d-flex ${positionClass}`}>\n <div class={`${isLightButtonDropDown} ${isMediumButtonDropDown}`}>\n <road-icon name=\"navigation-more\" class=\"dropdown-button-icon\"></road-icon>\n </div>\n </div>\n </summary>\n <div class={`dropdown-menu ${directionClass} ${dropdownClass}`}>\n <slot name=\"list\"/>\n </div>\n </details>\n );\n }\n\n}\n"],"version":3}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as o,h as r}from"./p-f3d586b3.js";const t=":host{--margin-top:0.5rem;display:block}.dropdown{position:relative;font-family:var(--road-font)}.dropdown summary{display:block;outline:none}.dropdown summary::-webkit-details-marker{display:none}.dropdown-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}.dropdown-medium-button{width:2.5rem;height:2.5rem}.dropdown-button:hover{background:var(--road-grey-200)}.position-right{display:flex;justify-content:flex-end}.bg-white{background:var(--road-grey-000)}.dropdown-button-icon{width:2.5rem;height:2.5rem}.dropdown-medium-button .dropdown-button-icon{width:1.75rem;height:1.75rem}.dropdown[open] .dropdown-menu{transform:scaleY(1)}.dropdown[open] .dropdown-menu.direction-top{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}.dropdown-menu{position:absolute;z-index:1;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}.dropdown-left{left:0}.dropdown-right{right:0}.dropdown-item{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}.dropdown-item-border{border-color:var(--road-outline-weak);border-bottom:1px solid}.dropdown-item:hover,.dropdown-item.focus-visible{background:var(--road-surface-inverse)}";const n=class{constructor(r){o(this,r);this.onClick=()=>{this.isOpen=!this.isOpen};this.isOpen=false;this.isLight=false;this.isMedium=false;this.position=undefined;this.direction="bottom"}render(){const o=this.isLight==true?`dropdown-button`:"dropdown-button bg-white";const t=this.isMedium==true?`dropdown-medium-button dropdown-button`:"dropdown-button bg-white";const n=this.position!==undefined?`position-${this.position}`:"";const e=this.position!==undefined?`dropdown-${this.position}`:"";const d=this.direction!==undefined?`direction-${this.direction}`:"";return r("details",{class:"dropdown",open:this.isOpen},r("summary",{"aria-expanded":`${this.isOpen}`,tabindex:"0",role:"button",onClick:this.onClick},r("div",{class:`d-flex ${n}`},r("div",{class:`${o} ${t}`},r("road-icon",{name:"navigation-more",class:"dropdown-button-icon"})))),r("div",{class:`dropdown-menu ${d} ${e}`},r("slot",{name:"list"})))}};n.style=t;export{n as road_dropdown};
|
|
2
|
+
//# sourceMappingURL=p-2a866428.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["dropdownCss","Dropdown","this","onClick","isOpen","render","isLightButtonDropDown","isLight","isMediumButtonDropDown","isMedium","positionClass","position","undefined","dropdownClass","directionClass","direction","h","class","open","tabindex","role","name"],"sources":["src/components/dropdown/dropdown.css?tag=road-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * Dropdown\n *\n * Index\n * - Dropdown\n * - Dropdown menu\n */\n\n/**\n * @prop --margin-top: Top margin of the menu\n */\n\n/* DROPDOWN\n -------------------- */\n\n:host {\n --margin-top: 0.5rem;\n display: block;\n}\n\n.dropdown {\n position: relative;\n font-family: var(--road-font);\n}\n\n.dropdown summary {\n display: block;\n outline: none;\n}\n\n.dropdown summary::-webkit-details-marker { /* remove native arrow */\n display: none;\n}\n\n.dropdown-button{\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 3.5rem;\n height: 3.5rem;\n cursor: pointer;\n border-radius: 0.25rem;\n}\n\n.dropdown-medium-button{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-button:hover{\n background: var(--road-grey-200);\n}\n\n.position-right{\n display: flex;\n justify-content: flex-end;\n}\n\n.bg-white{\n background: var(--road-grey-000);\n}\n\n.dropdown-button-icon{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-medium-button .dropdown-button-icon{\n width: 1.75rem;\n height: 1.75rem;\n}\n\n/**\n * Open state\n */\n\n.dropdown[open] .dropdown-menu {\n transform: scaleY(1);\n}\n\n.dropdown[open] .dropdown-menu.direction-top {\n position: absolute;\n bottom: 0;\n left: 0;\n transform: translate3d(0, -56px, 0);\n will-change: transform;\n}\n\n/* MENU\n -------------------- */\n\n.dropdown-menu {\n position: absolute;\n z-index: 1;\n display: flex;\n flex-direction: column;\n width: 100%;\n min-width: 16.875rem;\n padding: 0.5rem 0;\n color: var(--road-on-surface);\n background: var(--road-surface);\n border: 1px solid;\n border-color: var(--road-outline-weak);\n border-radius: 0.25rem;\n box-shadow: var(--road-elevation-low);\n transition: transform 0.2s ease-in-out;\n transform: scaleY(0);\n transform-origin: 0 0;\n}\n\n.dropdown-left {\n left: 0;\n}\n\n.dropdown-right {\n right: 0;\n}\n\n\n/* ITEM\n -------------------- */\n\n.dropdown-item {\n min-height: 40px;\n padding: 0 1rem;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n text-align: left;\n text-decoration: none;\n cursor: pointer;\n background: var(--road-surface);\n border: none;\n outline: none;\n}\n\n.dropdown-item-border {\n border-color: var(--road-outline-weak);\n border-bottom: 1px solid;\n}\n\n/**\n * Hover state\n */\n\n.dropdown-item:hover,\n.dropdown-item.focus-visible {\n background: var(--road-surface-inverse);\n}\n\n\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - Element how will open the dropdown when clicked\n * @slot list - List of item values (you can add border with lines=`full` but not on the last item)\n)\n */\n\n@Component({\n tag: 'road-dropdown',\n styleUrl: 'dropdown.css',\n shadow: true,\n})\nexport class Dropdown {\n\n /**\n * Set to `true` to open the dropdown menu and to `false` to close it.\n */\n @Prop({ mutable: true }) isOpen : boolean = false;\n\n /**\n * If you want to remove background of the dropdown button\n */\n @Prop() isLight : boolean = false;\n \n /**\n * If you want a medium dropdown\n */\n @Prop() isMedium : boolean = false;\n\n /**\n * The button position.\n */\n @Prop({ reflect: true }) position?: 'left' | 'right';\n\n /**\n * The opening direction.\n */\n @Prop({ reflect: true }) direction?: 'top' | 'bottom' = 'bottom';\n\n /**\n * Toggle the display when clicking element in slot\n */\n private onClick = () => {\n this.isOpen = !this.isOpen;\n };\n\n render() {\n\n const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';\n const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';\n const positionClass = this.position !== undefined ? `position-${this.position}` : '';\n const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';\n const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';\n\n\n return (\n <details class=\"dropdown\" open={this.isOpen}>\n <summary aria-expanded={`${this.isOpen}`} tabindex=\"0\" role=\"button\" onClick={this.onClick}>\n <div class={`d-flex ${positionClass}`}>\n <div class={`${isLightButtonDropDown} ${isMediumButtonDropDown}`}>\n <road-icon name=\"navigation-more\" class=\"dropdown-button-icon\"></road-icon>\n </div>\n </div>\n </summary>\n <div class={`dropdown-menu ${directionClass} ${dropdownClass}`}>\n <slot name=\"list\"/>\n </div>\n </details>\n );\n }\n\n}\n"],"mappings":"2CAAA,MAAMA,EAAc,4qD,MCaPC,EAAQ,M,yBA8BXC,KAAAC,QAAU,KAChBD,KAAKE,QAAUF,KAAKE,MAAM,E,YA1BgB,M,aAKd,M,cAKC,M,uCAU2B,Q,CAS1D,MAAAC,GAEE,MAAMC,EAAwBJ,KAAKK,SAAW,KAAO,kBAAoB,2BACzE,MAAMC,EAAyBN,KAAKO,UAAY,KAAO,yCAA2C,2BAClG,MAAMC,EAAgBR,KAAKS,WAAaC,UAAY,YAAYV,KAAKS,WAAa,GAClF,MAAME,EAAgBX,KAAKS,WAAaC,UAAY,YAAYV,KAAKS,WAAa,GAClF,MAAMG,EAAiBZ,KAAKa,YAAcH,UAAY,aAAaV,KAAKa,YAAc,GAGtF,OACEC,EAAA,WAASC,MAAM,WAAWC,KAAMhB,KAAKE,QACnCY,EAAA,2BAAwB,GAAGd,KAAKE,SAAUe,SAAS,IAAIC,KAAK,SAASjB,QAASD,KAAKC,SACjFa,EAAA,OAAKC,MAAO,UAAUP,KACpBM,EAAA,OAAKC,MAAO,GAAGX,KAAyBE,KACtCQ,EAAA,aAAWK,KAAK,kBAAkBJ,MAAM,4BAI9CD,EAAA,OAAKC,MAAO,iBAAiBH,KAAkBD,KAC7CG,EAAA,QAAMK,KAAK,U"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as i,H as r,a as n}from"./p-f3d586b3.js";const o=":host{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}@media (min-width: 768px){:host{padding:var(--road-spacing-06)}}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";const a=class{constructor(i){t(this,i);this.roadcardclick=e(this,"roadcardclick",7);this.roadCardClick=e(this,"roadCardClick",7);this.onClick=()=>{var t,e;if(this.value!==undefined){this.roadcardclick.emit({value:this.value,label:(t=this.el.querySelector("road-label"))===null||t===void 0?void 0:t.textContent});this.roadCardClick.emit({value:this.value,label:(e=this.el.querySelector("road-label"))===null||e===void 0?void 0:e.textContent})}};this.elevation="none";this.button=false;this.value=undefined;this.type="button";this.download=undefined;this.href=undefined;this.rel=undefined;this.target=undefined}isClickable(){return this.href!==undefined||this.button}renderCard(){const t=this.isClickable();if(!t){return[i("slot",null)]}const{href:e}=this;const r=t?e===undefined?"button":"a":"div";const n=r==="button"?{type:this.type}:{download:this.download,href:this.href,rel:this.rel,target:this.target};return i(r,Object.assign({},n,{class:"card-native",part:"native",onClick:this.onClick}),i("slot",null))}render(){const{elevation:t}=this;const e=this.elevation?`card-elevation-${t}`:``;return i(r,{class:`${e}`},this.renderCard())}get el(){return n(this)}};a.style=o;export{a as road_card};
|
|
2
|
+
//# sourceMappingURL=p-63fd28bd.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["cardCss","Card","this","onClick","value","undefined","roadcardclick","emit","label","_a","el","querySelector","textContent","roadCardClick","_b","isClickable","href","button","renderCard","clickable","h","TagType","attrs","type","download","rel","target","Object","assign","class","part","render","elevation","elevationClass","Host"],"sources":["src/components/card/card.css?tag=road-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["/*\n * Card\n *\n * Index\n * - Card\n * - Native\n * - Icon\n */\n\n/* CARD\n -------------------- */\n\n:host {\n position: relative;\n box-sizing: border-box;\n display: block;\n padding: var(--road-spacing-05);\n margin-bottom: var(--margin-bottom, 1rem);\n background: var(--road-surface);\n border: 1px solid var(--road-outline-weak);\n border-radius: var(--road-spacing-02);\n}\n\n:host(.card-elevation-none) {\n box-shadow: none;\n}\n\n:host(.card-elevation-lowest) {\n box-shadow: var(--road-elevation-lowest);\n}\n\n:host(.card-elevation-average) {\n box-shadow: var(--road-elevation-average);\n}\n\n@media (min-width: 768px) {\n\n :host {\n padding: var(--road-spacing-06);\n }\n}\n\n/* NATIVE\n -------------------- */\n\n.card-native {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: 100%;\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n color: inherit;\n text-align: center;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n background: var(--road-surface);\n border: 0;\n border-radius: 0.25rem;\n outline: none;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\na,\nbutton {\n cursor: pointer;\n user-select: none;\n -webkit-user-drag: none;\n}\n\n/* ICON\n -------------------- */\n\n::slotted(road-icon) {\n text-align: center;\n}\n","import { Component, h, Prop, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n/**\n * @slot - Content of the card.\n *\n * @part native - The native HTML button, anchor, or div element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-card',\n styleUrl: 'card.css',\n shadow: true,\n})\nexport class Card {\n\n @Element() el!: HTMLRoadCardElement;\n\n /**\n * The elevation.\n */\n @Prop() elevation?: 'none' | 'lowest' | 'average' = 'none';\n\n /**\n * If `true`, a button tag will be rendered and the card will be tappable.\n */\n @Prop() button: boolean = false;\n\n /**\n * value of the card\n */\n @Prop() value?: string;\n\n /**\n * The type of the button. Only used when an `onclick` or `button` property is present.\n */\n @Prop() type: 'submit' | 'reset' | 'button' = 'button';\n\n /**\n * This attribute instructs browsers to download a URL instead of navigating to\n * it, so the user will be prompted to save it as a local file. If the attribute\n * has a value, it is used as the pre-filled file name in the Save prompt\n * (the user can still change the file name if they want).\n */\n @Prop() download?: string;\n\n /**\n * Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered.\n */\n @Prop() href?: string;\n\n /**\n * Specifies the relationship of the target object to the link object.\n * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n */\n @Prop() rel?: string;\n\n /**\n * Specifies where to display the linked URL.\n * Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n */\n @Prop() target?: string;\n\n /**\n * Emitted when the card is clicked and send the `value` of the card\n */\n @Event() roadcardclick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n /** @internal */\n @Event() roadCardClick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n\n private isClickable(): boolean {\n return (this.href !== undefined || this.button);\n }\n\n private onClick = () => {\n if(this.value !== undefined) {\n this.roadcardclick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n this.roadCardClick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n }\n };\n\n private renderCard() {\n const clickable = this.isClickable();\n\n if (!clickable) {\n \n \n return [\n <slot/>\n ];\n \n }\n const { href } = this;\n const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div' as any;\n const attrs = (TagType === 'button')\n ? { type: this.type }\n : {\n download: this.download,\n href: this.href,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n \n <TagType\n {...attrs}\n class=\"card-native\"\n part=\"native\"\n onClick={this.onClick}\n >\n <slot/>\n </TagType>\n );\n }\n\n render() {\n const { elevation } = this;\n const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;\n return (\n <Host class={`${elevationClass}`}>\n {this.renderCard()}\n </Host>\n );\n }\n\n}\n"],"mappings":"gEAAA,MAAMA,EAAU,yiC,MCaHC,EAAI,M,mHAoEPC,KAAAC,QAAU,K,QAChB,GAAGD,KAAKE,QAAUC,UAAW,CAC3BH,KAAKI,cAAcC,KAAK,CACtBH,MAAOF,KAAKE,MACZI,OAAOC,EAAAP,KAAKQ,GAAGC,cAAc,iBAAa,MAAAF,SAAA,SAAAA,EAAEG,cAE9CV,KAAKW,cAAcN,KAAK,CACtBH,MAAOF,KAAKE,MACZI,OAAOM,EAAAZ,KAAKQ,GAAGC,cAAc,iBAAa,MAAAG,SAAA,SAAAA,EAAEF,a,kBArEI,O,YAK5B,M,+BAUoB,S,qFA0CtC,WAAAG,GACN,OAAQb,KAAKc,OAASX,WAAaH,KAAKe,M,CAgBlC,UAAAC,GACN,MAAMC,EAAYjB,KAAKa,cAEvB,IAAKI,EAAW,CAGd,MAAO,CACLC,EAAA,a,CAIJ,MAAMJ,KAAEA,GAASd,KACjB,MAAMmB,EAAUF,EAAaH,IAASX,UAAY,SAAW,IAAO,MACpE,MAAMiB,EAASD,IAAY,SACvB,CAAEE,KAAMrB,KAAKqB,MACb,CACAC,SAAUtB,KAAKsB,SACfR,KAAMd,KAAKc,KACXS,IAAKvB,KAAKuB,IACVC,OAAQxB,KAAKwB,QAGjB,OAEEN,EAACC,EAAOM,OAAAC,OAAA,GACFN,EAAK,CACTO,MAAM,cACNC,KAAK,SACL3B,QAASD,KAAKC,UAEdiB,EAAA,a,CAKN,MAAAW,GACE,MAAMC,UAAEA,GAAc9B,KACtB,MAAM+B,EAAiB/B,KAAK8B,UAAY,kBAAkBA,IAAc,GACxE,OACEZ,EAACc,EAAI,CAACL,MAAO,GAAGI,KACf/B,KAAKgB,a"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
body{--road-brand-primary:#002b6f;--road-primary-10:#001638;--road-primary-20:#002b6f;--road-primary-30:#004293;--road-primary-40:#005ab8;--road-primary-50:#0071dc;--road-primary-60:#338de3;--road-primary-70:#66aaea;--road-primary-80:#99c6f1;--road-primary-90:#cce3f8;--road-brand-secondary:#fcb731;--road-secondary-10:#9c3305;--road-secondary-20:#b14512;--road-secondary-30:#c4621a;--road-secondary-40:#d67e21;--road-secondary-50:#e99b29;--road-secondary-60:#fcb731;--road-secondary-70:#fdca68;--road-secondary-80:#fdde9f;--road-secondary-90:#fef1d6;--road-grey-0:#000000;--road-grey-5:#11151d;--road-grey-10:#22293a;--road-grey-15:#2c3345;--road-grey-20:#353c50;--road-grey-30:#51586c;--road-grey-40:#6d7488;--road-grey-50:#898fa0;--road-grey-60:#a4a9b6;--road-grey-70:#c1c4cd;--road-grey-80:#dddfe4;--road-grey-85:#e9eaed;--road-grey-90:#f4f4f6;--road-grey-95:#fafafb;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-primary-20);--road-on-header-surface:var(--road-grey-100-new);--road-header-surface-disabled:rgba(255, 255, 255, 0.32);--road-on-header-surface-disabled:rgba(255, 255, 255, 0.4);--road-header-outline:var(--road-primary-20);--road-header-icon:var(--road-grey-100-new);--road-header-icon-variant:var(--road-secondary-60);--road-header-badge:var(--road-secondary-60);--road-on-header-badge:var(--road-primary-10);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-20);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-60);--road-secondary-variant:var(--road-secondary-40);--road-on-secondary:var(--road-grey-10);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-30);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-secondary-50);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-secondary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-blur-light:filter: blur(0.25rem);--road-blur-medium:filter: blur(0.5rem);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-60);--road-button-secondary-variant:var(--road-secondary-40);--road-on-button-secondary:var(--road-grey-10);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-primary-50);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-10);--road-button-fab:var(--road-secondary-60);--road-on-button-fab:var(--road-grey-10);--road-button-fab-variant:var(--road-secondary-40);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-10);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-primary-50);--road-input-surface-variant:var(--road-primary-30);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-primary-30);--road-decorative-surface:var(--road-secondary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-elevation-lowest:0 1px 2px rgba(0, 0, 0, 0.24), 0 1px 3px 1px rgba(0, 0, 0, 0.08);--road-elevation-low:0 1px 2px rgba(41, 44, 51, 0.16), 0 3px 5px 1px rgba(41, 44, 51, 0.12);--road-elevation-average:0 3px 3px rgba(0, 0, 0, 0.16), 0 6px 8px 1px rgba(41, 44, 51, 0.12);--road-elevation-hight:0 3px 3px rgba(0, 0, 0, 0.2), 0 10px 13px 2px rgba(41, 44, 51, 0.12);--road-elevation-highest:0 4px 4px rgba(0, 0, 0, 0.24), 0 12px 16px 6px rgba(41, 44, 51, 0.16);--road-blue-klein-5:#000411;--road-blue-klein-10:#000923;--road-blue-klein-15:#000d34;--road-blue-klein-20:#001146;--road-blue-klein-30:#001a68;--road-blue-klein-40:#00228b;--road-blue-klein-50:#002bae;--road-blue-klein-60:#3355be;--road-blue-klein-70:#6680ce;--road-blue-klein-80:#99aadf;--road-blue-klein-85:#b3bfe7;--road-blue-klein-90:#ccd5ef;--road-blue-klein-95:#e6eaf7;--road-violet-electric-5:#0e0019;--road-violet-electric-10:#1c0032;--road-violet-electric-15:#2a004a;--road-violet-electric-20:#380063;--road-violet-electric-30:#550095;--road-violet-electric-40:#7100c6;--road-violet-electric-50:#8d00f8;--road-violet-electric-60:#a433f9;--road-violet-electric-70:#bb66fb;--road-violet-electric-80:#d199fc;--road-violet-electric-85:#ddb2fd;--road-violet-electric-90:#e8ccfe;--road-violet-electric-95:#f4e5fe;--road-green-monstera-5:#000c01;--road-green-monstera-10:#001901;--road-green-monstera-15:#002502;--road-green-monstera-20:#003203;--road-green-monstera-30:#005705;--road-green-monstera-40:#007006;--road-green-monstera-50:#007c07;--road-green-monstera-60:#339639;--road-green-monstera-70:#66b06a;--road-green-monstera-80:#99cb9c;--road-green-monstera-85:#b3d8b5;--road-green-monstera-90:#cce5cd;--road-green-monstera-95:#e6f2e6;--road-red-pepper-5:#150000;--road-red-pepper-10:#2a0000;--road-red-pepper-15:#3f0000;--road-red-pepper-20:#540000;--road-red-pepper-30:#7f0000;--road-red-pepper-40:#a90000;--road-red-pepper-50:#d30000;--road-red-pepper-60:#dc3333;--road-red-pepper-70:#e56666;--road-red-pepper-80:#ed9999;--road-red-pepper-85:#f2b3b3;--road-red-pepper-90:#f6cccc;--road-red-pepper-95:#fbe6e6;--road-yellow-gold-5:#130e00;--road-yellow-gold-10:#261c00;--road-yellow-gold-15:#3a2a00;--road-yellow-gold-20:#4d3800;--road-yellow-gold-30:#735400;--road-yellow-gold-40:#9a7000;--road-yellow-gold-50:#c08c00;--road-yellow-gold-60:#cda333;--road-yellow-gold-70:#d9ba66;--road-yellow-gold-80:#e6d199;--road-yellow-gold-85:#ecdcb2;--road-yellow-gold-90:#f2e8cc;--road-yellow-gold-95:#f9f4e6;--road-yellow-mikado-5:#191401;--road-yellow-mikado-10:#332702;--road-yellow-mikado-15:#4c3b04;--road-yellow-mikado-20:#664e05;--road-yellow-mikado-30:#997607;--road-yellow-mikado-40:#cc9d0a;--road-yellow-mikado-50:#ffc40c;--road-yellow-mikado-60:#ffd03d;--road-yellow-mikado-70:#ffdc6d;--road-yellow-mikado-80:#ffe79e;--road-yellow-mikado-85:#ffedb6;--road-yellow-mikado-90:#fff3ce;--road-yellow-mikado-95:#fff9e7;--road-tag-default:var(--road-blue-klein-50);--road-tag-ecology:var(--road-green-monstera-50);--road-tag-exclusivity:var(--road-yellow-gold-50);--road-tag-offer:var(--road-red-pepper-50);--road-tag-black-friday:var(--road-grey-0);--road-leading-banner:var(--road-secondary-60);--road-on-leading-banner:var(--road-grey-10);--road-rating:var(--road-yellow-mikado-50);--road-info-10:#0a1628;--road-info-20:#142c51;--road-info-30:#1d4379;--road-info-40:#2759a2;--road-info-50:#316fca;--road-info-60:#5a8cd5;--road-info-70:#83a9df;--road-info-80:#adc5ea;--road-info-90:#d6e2f4;--road-info-95:#ebf1fa;--road-success-10:#0d1b0e;--road-success-20:#1a351b;--road-success-30:#285029;--road-success-40:#356a36;--road-success-50:#428544;--road-success-60:#689d69;--road-success-70:#8eb68f;--road-success-80:#b3ceb4;--road-success-90:#d9e7da;--road-success-95:#ecf3ec;--road-warning-10:#4e3406;--road-warning-20:#9c690d;--road-warning-30:#ea9d13;--road-warning-40:#fab815;--road-warning-50:#fdc93e;--road-warning-60:#ffd966;--road-warning-70:#ffe38c;--road-warning-80:#ffecb3;--road-warning-90:#fff6d9;--road-warning-95:#fffaec;--road-danger-10:#240b09;--road-danger-20:#471711;--road-danger-30:#6b221a;--road-danger-40:#8e2e22;--road-danger-50:#b2392b;--road-danger-60:#c16155;--road-danger-70:#d18880;--road-danger-80:#e0b0aa;--road-danger-90:#f0d7d5;--road-danger-95:#f7ebea;--road-info-surface:var(--road-info-95);--road-info-surface-inverse:var(--road-info-50);--road-on-info-surface:var(--road-info-30);--road-on-info-surface-inverse:var(--road-grey-100-new);--road-info-outline:var(--road-info-50);--road-info-icon:var(--road-info-50);--road-info-icon-inverse:var(--road-grey-100-new);--road-info-background:var(--road-info-surface);--road-info-default:var(--road-info-surface-inverse);--road-info-text:var(--road-on-info-surface);--road-info-contrast:var(--road-on-info-surface-inverse);--road-success-surface:var(--road-success-95);--road-success-surface-inverse:var(--road-success-50);--road-on-success-surface:var(--road-success-30);--road-on-success-surface-inverse:var(--road-grey-100-new);--road-success-outline:var(--road-success-50);--road-success-icon:var(--road-success-50);--road-success-icon-inverse:var(--road-grey-100-new);--road-success-background:var(--road-success-surface);--road-success-default:var(--road-success-surface-inverse);--road-success-text:var(--road-on-success-surface);--road-success-contrast:var(--road-on-success-surface-inverse);--road-warning-surface:var(--road-warning-95);--road-warning-surface-inverse:var(--road-warning-50);--road-on-warning-surface:var(--road-warning-20);--road-on-warning-surface-inverse:var(--road-warning-10);--road-warning-outline:var(--road-warning-30);--road-warning-icon:var(--road-warning-30);--road-warning-icon-inverse:var(--road-warning-10);--road-warning-background:var(--road-warning-surface);--road-warning-default:var(--road-warning-surface-inverse);--road-warning-text:var(--road-on-warning-surface);--road-warning-contrast:var(--road-on-warning-surface-inverse);--road-danger-surface:var(--road-danger-95);--road-danger-surface-inverse:var(--road-danger-50);--road-on-danger-surface:var(--road-danger-30);--road-on-danger-surface-inverse:var(--road-grey-100-new);--road-danger-outline:var(--road-danger-50);--road-danger-icon:var(--road-danger-50);--road-danger-icon-inverse:var(--road-grey-100-new);--road-danger-background:var(--road-danger-surface);--road-danger-default:var(--road-danger-surface-inverse);--road-danger-text:var(--road-on-danger-surface);--road-danger-contrast:var(--road-danger-surface-inverse);--road-font:muli, arial, sans-serif;--road-font-size-75:4.6875rem;--road-font-size-65:4.0625rem;--road-font-size-57:3.5625rem;--road-font-size-49:3.0625rem;--road-font-size-43:2.6875rem;--road-font-size-37:2.3125rem;--road-font-size-32:2rem;--road-font-size-28:1.75rem;--road-font-size-24:1.5rem;--road-font-size-21:1.325rem;--road-font-size-18:1.125rem;--road-font-size-16:1rem;--road-font-size-14:0.875rem;--road-font-size-12:0.75rem;--road-font-size-10:0.625rem;--road-overline:var(--road-font-size-12);--road-legal-medium:var(--road-font-size-12);--road-label-medium:var(--road-font-size-16);--road-label-small:var(--road-font-size-12);--road-label-extra-small:var(--road-font-size-10);--road-caption-medium:var(--road-font-size-12);--road-helper-medium:var(--road-font-size-14);--road-link-large:var(--road-font-size-18);--road-link-medium:var(--road-font-size-16);--road-link-small:var(--road-font-size-14);--road-link-extra-small:var(--road-font-size-12);--road-button-medium:var(--road-font-size-16);--road-button-small:var(--road-font-size-14);--road-display-large:var(--road-font-size-57);--road-display-medium:var(--road-font-size-49);--road-display-small:var(--road-font-size-43);--road-heading-01:var(--road-font-size-32);--road-heading-02:var(--road-font-size-28);--road-heading-03:var(--road-font-size-24);--road-heading-04:var(--road-font-size-21);--road-sub-heading-large:var(--road-font-size-24);--road-sub-heading-medium:var(--road-font-size-21);--road-sub-heading-small:var(--road-font-size-18);--road-body-large:var(--road-font-size-18);--road-body-medium:var(--road-font-size-16);--road-body-small:var(--road-font-size-14);--road-spacing-01:0.125rem;--road-spacing-02:0.25rem;--road-spacing-03:0.5rem;--road-spacing-04:0.75rem;--road-spacing-05:1rem;--road-spacing-06:1.5rem;--road-spacing-07:2rem;--road-spacing-08:2.5rem;--road-spacing-09:3rem;--road-spacing-10:4rem;--road-spacing-11:5rem;--road-spacing-12:6rem;--road-spacing-13:10rem;--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-primary-500);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--road-grey-000:var(--road-grey-100-new);--road-grey-100:var(--road-grey-90);--road-grey-200:var(--road-grey-80);--road-grey-300:var(--road-grey-70);--road-grey-400:var(--road-grey-60);--road-grey-500:var(--road-grey-50);--road-grey-600:var(--road-grey-40);--road-grey-700:var(--road-grey-30);--road-grey-800:var(--road-grey-20);--road-grey-900:var(--road-grey-10);--road-grey-999:var(--road-grey-0);--road-disabled:var(--road-surface-disabled);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900);--info:var(--road-info-default);--info-hover:var(--road-info-text);--info-text:var(--road-info-text);--info-background:var(--road-info-background);--info-contrast:var(--road-grey-000);--success:var(--road-success-default);--success-hover:var(--road-success-text);--success-text:var(--road-success-text);--success-background:var(--road-success-background);--success-contrast:var(--road-grey-000);--warning:var(--road-warning-default);--warning-hover:var(--road-warning-text);--warning-text:var(--road-warning-text);--warning-background:var(--road-warning-background);--warning-contrast:var(--road-grey-900);--danger:var(--road-danger-default);--danger-hover:var(--road-danger-text);--danger-text:var(--road-danger-text);--danger-background:var(--road-danger-background);--danger-contrast:var(--road-grey-000);--icon:var(--road-grey-900);--text:var(--road-grey-900);--text-second:var(--road-grey-600);--text-disabled:var(--road-grey-400);--border-form:var(--road-grey-400);--border:var(--road-grey-300);--background:var(--road-grey-100);--background-second:var(--road-grey-100);--white:var(--road-grey-000);--font:var(--road-font)}@media (min-width: 768px){body{--road-display-large:var(--road-font-size-75);--road-display-medium:var(--road-font-size-65);--road-display-small:var(--road-font-size-57);--road-heading-01:var(--road-font-size-49);--road-heading-02:var(--road-font-size-37);--road-heading-03:var(--road-font-size-32);--road-heading-04:var(--road-font-size-28);--road-sub-heading-large:var(--road-font-size-32);--road-sub-heading-medium:var(--road-font-size-28);--road-sub-heading-small:var(--road-font-size-24)}}.auto5-theme{--road-brand-primary:#002b6f;--road-primary-10:#001638;--road-primary-20:#002b6f;--road-primary-30:#004293;--road-primary-40:#005ab8;--road-primary-50:#0071dc;--road-primary-60:#338de3;--road-primary-70:#66aaea;--road-primary-80:#99c6f1;--road-primary-90:#cce3f8;--road-brand-secondary:#e00008;--road-secondary-10:#2d0002;--road-secondary-20:#5a0003;--road-secondary-30:#860005;--road-secondary-40:#b30006;--road-secondary-50:#e00008;--road-secondary-60:#e63339;--road-secondary-70:#ec666b;--road-secondary-80:#f3999c;--road-secondary-90:#f9ccce;--road-grey-0:#000000;--road-grey-5:#11151d;--road-grey-10:#22293a;--road-grey-15:#2c3345;--road-grey-20:#353c50;--road-grey-30:#51586c;--road-grey-40:#6d7488;--road-grey-50:#898fa0;--road-grey-60:#a4a9b6;--road-grey-70:#c1c4cd;--road-grey-80:#dddfe4;--road-grey-85:#e9eaed;--road-grey-90:#f4f4f6;--road-grey-95:#fafafb;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-primary-20);--road-on-header-surface:var(--road-grey-100-new);--road-header-surface-disabled:rgba(255, 255, 255, 0.32);--road-on-header-surface-disabled:rgba(255, 255, 255, 0.4);--road-header-outline:var(--road-primary-20);--road-header-icon:var(--road-grey-100-new);--road-icon-header-variant:var(--road-secondary-60);--road-header-badge:var(--road-secondary-60);--road-on-header-badge:var(--road-grey-100-new);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-30);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-50);--road-secondary-variant:var(--road-secondary-30);--road-on-secondary:var(--road-grey-100-new);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-30);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-secondary-50);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-grey-70);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-60);--road-button-secondary-variant:var(--road-secondary-30);--road-on-button-secondary:var(--road-grey-100-new);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-primary-50);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-10);--road-button-fab:var(--road-secondary-60);--road-on-button-fab:var(--road-grey-100-new);--road-button-fab-variant:var(--road-secondary-30);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-10);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-primary-50);--road-input-surface-variant:var(--road-primary-30);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-primary-30);--road-decorative-surface:var(--road-secondary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-leading-banner:var(--road-yellow-mikado-50);--road-on-leading-banner:var(--road-grey-10);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}.atu-theme{--road-brand-primary:#bb1e10;--road-primary-10:#250603;--road-primary-20:#4b0b06;--road-primary-30:#70120a;--road-primary-40:#96180d;--road-primary-50:#bb1e10;--road-primary-60:#c94b40;--road-primary-70:#d67870;--road-primary-80:#e4a59f;--road-primary-90:#f1d2cf;--road-brand-secondary:#bb1e10;--road-secondary-10:#0c0a0a;--road-secondary-20:#292727;--road-secondary-30:#474545;--road-secondary-40:#646262;--road-secondary-50:#827f7f;--road-secondary-60:#9f9c9c;--road-secondary-70:#bcbaba;--road-secondary-80:#dad7d7;--road-secondary-90:#f7f4f4;--road-grey-0:#000000;--road-grey-5:#060505;--road-grey-10:#0c0a0a;--road-grey-15:#1b1919;--road-grey-20:#292727;--road-grey-30:#474545;--road-grey-40:#646262;--road-grey-50:#827f7f;--road-grey-60:#9f9c9c;--road-grey-70:#bcbaba;--road-grey-80:#dad7d7;--road-grey-85:#e9e6e6;--road-grey-90:#f7f4f4;--road-grey-95:#fbfafa;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-grey-90);--road-on-header-surface:var(--road-grey-20);--road-header-surface-disabled:rgba(130, 127, 127, 0.24);--road-on-header-surface-disabled:rgba(41, 39, 39, 0.32);--road-header-outline:rgba(71, 69, 69, 0.24);--road-header-icon:var(--road-grey-20);--road-icon-header-variant:var(--road-primary-50);--road-header-badge:var(--road-primary-50);--road-on-header-badge:var(--road-grey-100-new);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-20);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-30);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-20);--road-secondary-variant:var(--road-secondary-10);--road-on-secondary:var(--road-grey-100-new);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-secondary-10);--road-icon:var(--road-grey-20);--road-icon-variant:var(--road-primary-50);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-secondary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-20);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-10);--road-button-secondary-variant:var(--road-secondary-40);--road-on-button-secondary:var(--road-grey-100-new);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-primary-50);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-20);--road-button-fab:var(--road-primary-50);--road-on-button-fab:var(--road-grey-100-new);--road-button-fab-variant:var(--road-primary-30);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-20);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-secondary-10);--road-input-surface-variant:var(--road-secondary-40);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-secondary-10);--road-decorative-surface:var(--road-primary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-leading-banner:var(--road-secondary-10);--road-on-leading-banner:var(--road-grey-100-new);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--road-secondary-100:#f5cccc;--road-secondary-200:#e99d9a;--road-secondary-300:#db706b;--road-secondary-400:#cc463c;--road-secondary-500:#bb1e10;--road-secondary-600:#9e2013;--road-secondary-700:#832114;--road-secondary-800:#681f14;--road-secondary-900:#501b12;--road-secondary-contrast:var(--road-on-secondary);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}.atu-theme road-banner{color:var(--road-grey-100-new)}.midas-theme{--road-brand-primary:#ffd300;--road-primary-10:#280f06;--road-primary-20:#6e450d;--road-primary-30:#b37a15;--road-primary-40:#f9b01c;--road-primary-50:#fcc20e;--road-primary-60:#ffd300;--road-primary-70:#ffde40;--road-primary-80:#ffe980;--road-primary-90:#fff4bf;--road-brand-secondary:#000000;--road-secondary-10:#1a1a1a;--road-secondary-20:#353535;--road-secondary-30:#515151;--road-secondary-40:#6c6c6c;--road-secondary-50:#878787;--road-secondary-60:#a2a2a2;--road-secondary-70:#bebebe;--road-secondary-80:#d9d9d9;--road-secondary-90:#f4f4f4;--road-grey-0:#000000;--road-grey-5:#0d0d0d;--road-grey-10:#1a1a1a;--road-grey-15:#282828;--road-grey-20:#353535;--road-grey-30:#515151;--road-grey-40:#6c6c6c;--road-grey-50:#878787;--road-grey-60:#a2a2a2;--road-grey-70:#bebebe;--road-grey-80:#d9d9d9;--road-grey-85:#e7e7e7;--road-grey-90:#f4f4f4;--road-grey-95:#fafafa;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-secondary-20);--road-on-header-surface:var(--road-grey-10);--road-header-surface-disabled:rgba(135, 135, 135, 0.24);--road-on-header-surface-disabled:rgba(26, 26, 26, 0.32);--road-header-outline:rgba(162, 162, 162, 0.24);--road-header-icon:var(--road-grey-10);--road-icon-header-variant:var(--road-primary-40);--road-header-badge:var(--road-primary-60);--road-on-header-badge:var(--road-grey-10);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-60);--road-primary-variant:var(--road-primary-40);--road-on-primary:var(--road-grey-10);--road-secondary:var(--road-secondary-20);--road-secondary-variant:var(--road-secondary-10);--road-on-secondary:var(--road-grey-100-new);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-40);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-primary-40);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-primary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-button-primary:var(--road-primary-60);--road-button-primary-variant:var(--road-primary-40);--road-on-button-primary:var(--road-grey-10);--road-button-secondary:var(--road-secondary-20);--road-button-secondary-variant:var(--road-secondary-10);--road-on-button-secondary:var(--road-grey-100-new);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-80);--road-button-tertiary-outline:var(--road-primary-60);--road-on-button-tertiary:var(--road-grey-10);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-80);--road-on-button-ghost:var(--road-grey-10);--road-link-primary:var(--road-grey-10);--road-link-secondary:var(--road-primary-30);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-secondary-10);--road-input-surface-variant:var(--road-secondary-20);--road-input-outline:rgba(81, 81, 81, 0.52);--road-input-outline-variant:var(--road-secondary-10);--road-decorative-surface:var(--road-primary-40);--road-decorative-surface-variant:var(--road-secondary-20);--road-leading-banner:var(--road-secondary-10);--road-on-leading-banner:var(--road-grey-100-new);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}.midas-theme road-button[outline][color="primary"],.midas-theme road-button[outline][color="secondary"],.midas-theme .link{color:var(--road-grey-900)}.midas-theme .link:focus,.midas-theme .link:hover{color:var(--road-grey-600)}.mobivia-theme{--road-brand-primary:#b40063;--road-primary-10:#2e0011;--road-primary-20:#5c0026;--road-primary-30:#7f003b;--road-primary-40:#9b004f;--road-primary-50:#b40063;--road-primary-60:#c42674;--road-primary-70:#d24d87;--road-primary-80:#e282a6;--road-primary-90:#f1bbcd;--road-brand-secondary:#f8ab00;--road-secondary-10:#4c2800;--road-secondary-20:#754300;--road-secondary-30:#995e00;--road-secondary-40:#bd7b00;--road-secondary-50:#f8ab00;--road-secondary-60:#ffbb21;--road-secondary-70:#ffca42;--road-secondary-80:#ffda70;--road-secondary-90:#ffeaa8;--road-grey-0:#000000;--road-grey-5:#141413;--road-grey-10:#282826;--road-grey-15:#333331;--road-grey-20:#3d3d3c;--road-grey-30:#565656;--road-grey-40:#757574;--road-grey-50:#8e8e8e;--road-grey-60:#a9a8a7;--road-grey-70:#c3c3c1;--road-grey-80:#deddda;--road-grey-85:#ebeae6;--road-grey-90:#f8f7f3;--road-grey-95:#fcfbf9;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-primary-50);--road-on-header-surface:var(--road-grey-100-new);--road-header-surface-disabled:rgba(255, 255, 255, 0.32);--road-on-header-surface-disabled:rgba(255, 255, 255, 0.4);--road-header-outline:var(--road-primary-50);--road-header-icon:var(--road-grey-10-new);--road-variant-icon-header:var(--road-secondary-60);--road-header-badge:var(--road-secondary-60);--road-on-header-badge:var(--road-grey-10);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-30);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-50);--road-secondary-variant:var(--road-secondary-40);--road-on-secondary:var(--road-grey-10);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-30);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-secondary-40);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-secondary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-50);--road-button-secondary-variant:var(--road-secondary-40);--road-on-button-secondary:var(--road-grey-10);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-grey-10);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-10);--road-button-fab:var(--road-secondary-50);--road-on-button-fab:var(--road-grey-10);--road-button-fab-variant:var(--road-secondary-40);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-10);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-primary-50);--road-input-surface-variant:var(--road-primary-30);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-grey-0);--road-decorative-surface:var(--road-secondary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-leading-banner:var(--road-secondary-50);--road-on-leading-banner:var(--road-grey-10);--road-grey-000:var(--road-grey-100);--road-grey-200:var(--road-grey-80);--road-grey-300:var(--road-grey-70);--road-grey-400:var(--road-grey-60);--road-grey-500:var(--road-grey-50);--road-grey-600:var(--road-grey-40);--road-grey-700:var(--road-grey-30);--road-grey-800:var(--road-grey-20);--road-grey-900:var(--road-grey-10);--road-grey-999:var(--road-grey-0);--road-disabled:var(--road-surface-disabled);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}html{-webkit-text-size-adjust:100%}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible;}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{padding:0;border-style:none}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;display:table;max-width:100%;padding:0;color:inherit;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none}[type="search"]{outline-offset:-2px;-webkit-appearance:textfield;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}*,*::before,*::after{box-sizing:border-box}input[type="number"]{-webkit-appearance:textfield;appearance:textfield}body{font-family:var(--road-font, sans-serif);font-size:var(--road-font-size-14);line-height:1.5;color:var(--road-grey-10)}img,embed,iframe,object,audio,video{max-width:100%;height:auto}iframe{border:0}input,textarea,button,select,a{-webkit-tap-highlight-color:rgba(0,0,0,0)}a{text-decoration:none;cursor:pointer}@font-face{font-family:Muli;font-style:normal;font-weight:400;font-display:swap;src:local("Muli Regular"), local("Muli-Regular"), url("fonts/Muli-Regular.woff2") format("woff2"), url("fonts/Muli-Regular.woff") format("woff");unicode-range:U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF}@font-face{font-family:Muli;font-style:normal;font-weight:400;font-display:swap;src:local("Muli Regular"), local("Muli-Regular"), url("fonts/Muli-Regular.woff2") format("woff2"), url("fonts/Muli-Regular.woff") format("woff");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}@font-face{font-family:Muli;font-style:normal;font-weight:700;font-display:swap;src:local("Muli Bold"), local("Muli-Bold"), url("fonts/Muli-Bold.woff2") format("woff2"), url("fonts/Muli-Bold.woff") format("woff");unicode-range:U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF}@font-face{font-family:Muli;font-style:normal;font-weight:700;font-display:swap;src:local("Muli Bold"), local("Muli-Bold"), url("fonts/Muli-Bold.woff2") format("woff2"), url("fonts/Muli-Bold.woff") format("woff");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}.display-large{font-size:var(--road-display-large);font-weight:700;line-height:1.5}.display-medium{font-size:var(--road-display-medium);font-weight:700;line-height:1.5}.display-small{font-size:var(--road-display-small);font-weight:700;line-height:1.5}.h1,.h2,.h3,.h4,.h5,.h6,.h7,.h8,.h9{padding:0;font-weight:700;line-height:1.5;color:var(--road-on-surface)}.title-primary{color:var(--road-brand-primary)}.h1,.h2,.h3,.h4,.h5,.h6,.h7,.h8,.h9,.text-content,.text-small,.text-legal,.text-large,.text-medium{margin:0 0 1rem;font-family:var(--road-font, sans-serif)}.h1{font-size:var(--road-heading-01)}.h2{font-size:var(--road-heading-02)}.h3{font-size:var(--road-heading-03)}.h4{font-size:var(--road-heading-04)}.h5{font-size:var(--road-font-size-24)}.h6{font-size:var(--road-font-size-21)}.h7{font-size:var(--road-font-size-18)}.h8{font-size:var(--road-font-size-16)}.h9{font-size:var(--road-font-size-12);text-transform:uppercase}.sub-heading-large{font-size:var(--road-sub-heading-large);font-weight:700;line-height:1.5}.sub-heading-medium{font-size:var(--road-sub-heading-medium);font-weight:700;line-height:1.5}.sub-heading-small{font-size:var(--road-sub-heading-small);font-weight:700;line-height:1.5}.overline{font-size:var(--road-overline);font-weight:700;text-transform:uppercase}.text-content,.text-small,.text-legal,.text-large,.text-medium{line-height:1.5}.text-large{font-size:var(--road-body-large);color:var(--road-grey-10)}.text-content{font-size:var(--road-body-medium);color:var(--road-grey-10)}.text-medium{font-size:var(--road-body-small);color:var(--road-grey-10)}.text-small{font-size:var(--road-legal-medium)}.text-legal{font-size:var(--road-legal-medium);color:var(--road-grey-60)}.title-underline::after{display:block;width:50px;height:3px;margin-top:8px;content:"";background-color:var(--road-decorative-surface)}.text-center.title-underline::after{margin:8px auto 0}.text-right.title-underline::after{position:absolute;right:2rem}.link{color:var(--road-link-primary);text-decoration:underline;outline:0;transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}.link:hover,.link:focus{text-decoration:none}.link-default{color:var(--road-link-secondary)}.link-white{color:var(--road-link-inverse)}.link-md{font-size:var(--road-link-medium)}.link-sm{font-size:var(--road-link-small)}.link road-icon{color:currentColor}.d-none{display:none}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-block{display:block}.d-flex{display:flex}.d-inline-flex{display:inline-flex}@media (min-width: 576px){.d-sm-none{display:none}.d-sm-inline{display:inline}.d-sm-inline-block{display:inline-block}.d-sm-block{display:block}.d-sm-flex{display:flex}.d-sm-inline-flex{display:inline-flex}}@media (min-width: 768px){.d-md-none{display:none}.d-md-inline{display:inline}.d-md-inline-block{display:inline-block}.d-md-block{display:block}.d-md-flex{display:flex}.d-md-inline-flex{display:inline-flex}}@media (min-width: 992px){.d-lg-none{display:none}.d-lg-inline{display:inline}.d-lg-inline-block{display:inline-block}.d-lg-block{display:block}.d-lg-flex{display:flex}.d-lg-inline-flex{display:inline-flex}}@media (min-width: 1200px){.d-xl-none{display:none}.d-xl-inline{display:inline}.d-xl-inline-block{display:inline-block}.d-xl-block{display:block}.d-xl-flex{display:flex}.d-xl-inline-flex{display:inline-flex}}.flex-row{flex-direction:row}.flex-column{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.flex-grow-0{flex-grow:0}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}.flex-shrink-1{flex-shrink:1}.justify-content-start{justify-content:flex-start}.justify-content-end{justify-content:flex-end}.justify-content-center{justify-content:center}.justify-content-between{justify-content:space-between}.justify-content-around{justify-content:space-around}.align-items-start{align-items:flex-start}.align-items-end{align-items:flex-end}.align-items-center{align-items:center}.align-items-baseline{align-items:baseline}.align-items-stretch{align-items:stretch}@media (min-width: 576px){.flex-sm-wrap{flex-wrap:wrap}.flex-sm-nowrap{flex-wrap:nowrap}.justify-content-sm-start{justify-content:flex-start}.justify-content-sm-end{justify-content:flex-end}.justify-content-sm-center{justify-content:center}.justify-content-sm-between{justify-content:space-between}.justify-content-sm-around{justify-content:space-around}.align-items-sm-start{align-items:flex-start}.align-items-sm-end{align-items:flex-end}.align-items-sm-center{align-items:center}.align-items-sm-baseline{align-items:baseline}.align-items-sm-stretch{align-items:stretch}}@media (min-width: 768px){.flex-md-wrap{flex-wrap:wrap}.flex-md-nowrap{flex-wrap:nowrap}.justify-content-md-start{justify-content:flex-start}.justify-content-md-end{justify-content:flex-end}.justify-content-md-center{justify-content:center}.justify-content-md-between{justify-content:space-between}.justify-content-md-around{justify-content:space-around}.align-items-md-start{align-items:flex-start}.align-items-md-end{align-items:flex-end}.align-items-md-center{align-items:center}.align-items-md-baseline{align-items:baseline}.align-items-md-stretch{align-items:stretch}}@media (min-width: 992px){.flex-lg-wrap{flex-wrap:wrap}.flex-lg-nowrap{flex-wrap:nowrap}.justify-content-lg-start{justify-content:flex-start}.justify-content-lg-end{justify-content:flex-end}.justify-content-lg-center{justify-content:center}.justify-content-lg-between{justify-content:space-between}.justify-content-lg-around{justify-content:space-around}.align-items-lg-start{align-items:flex-start}.align-items-lg-end{align-items:flex-end}.align-items-lg-center{align-items:center}.align-items-lg-baseline{align-items:baseline}.align-items-lg-stretch{align-items:stretch}}@media (min-width: 1200px){.flex-xl-wrap{flex-wrap:wrap}.flex-xl-nowrap{flex-wrap:nowrap}.justify-content-xl-start{justify-content:flex-start}.justify-content-xl-end{justify-content:flex-end}.justify-content-xl-center{justify-content:center}.justify-content-xl-between{justify-content:space-between}.justify-content-xl-around{justify-content:space-around}.align-items-xl-start{align-items:flex-start}.align-items-xl-end{align-items:flex-end}.align-items-xl-center{align-items:center}.align-items-xl-baseline{align-items:baseline}.align-items-xl-stretch{align-items:stretch}}.align-content-start{align-content:flex-start}.align-content-end{align-content:flex-end}.align-content-center{align-content:center}.align-content-between{align-content:space-between}.align-content-around{align-content:space-around}.align-content-stretch{align-content:stretch}.align-self-auto{align-self:auto}.align-self-start{align-self:flex-start}.align-self-end{align-self:flex-end}.align-self-center{align-self:center}.align-self-baseline{align-self:baseline}.align-self-stretch{align-self:stretch}.m-0{margin:0}.m-4{margin:var(--road-spacing-02)}.m-8{margin:var(--road-spacing-03)}.m-12{margin:var(--road-spacing-04)}.m-16{margin:var(--road-spacing-05)}.m-24{margin:var(--road-spacing-06)}.m-auto{margin:auto}.mx-0{margin-right:0;margin-left:0}.mx-4{margin-right:var(--road-spacing-02);margin-left:var(--road-spacing-02)}.mx-8{margin-right:var(--road-spacing-03);margin-left:var(--road-spacing-03)}.mx-12{margin-right:var(--road-spacing-04);margin-left:var(--road-spacing-04)}.mx-16{margin-right:var(--road-spacing-05);margin-left:var(--road-spacing-05)}.mx-24{margin-right:var(--road-spacing-06);margin-left:var(--road-spacing-06)}.mx-auto{margin-right:auto;margin-left:auto}.my-0{margin-top:0;margin-bottom:0}.my-4{margin-top:var(--road-spacing-02);margin-bottom:var(--road-spacing-02)}.my-8{margin-top:var(--road-spacing-03);margin-bottom:var(--road-spacing-03)}.my-12{margin-top:var(--road-spacing-04);margin-bottom:var(--road-spacing-04)}.my-16{margin-top:var(--road-spacing-05);margin-bottom:var(--road-spacing-05)}.my-24{margin-top:var(--road-spacing-06);margin-bottom:var(--road-spacing-06)}.my-auto{margin-top:auto;margin-bottom:auto}.mt-0{margin-top:0}.mt-4{margin-top:var(--road-spacing-02)}.mt-8{margin-top:var(--road-spacing-03)}.mt-12{margin-top:var(--road-spacing-04)}.mt-16{margin-top:var(--road-spacing-05)}.mt-24{margin-top:var(--road-spacing-06)}.mr-0{margin-right:0}.mr-4{margin-right:var(--road-spacing-02)}.mr-8{margin-right:var(--road-spacing-03)}.mr-12{margin-right:var(--road-spacing-04)}.mr-16{margin-right:var(--road-spacing-05)}.mr-24{margin-right:var(--road-spacing-06)}.mb-0{margin-bottom:0}.mb-4{margin-bottom:var(--road-spacing-02)}.mb-8{margin-bottom:var(--road-spacing-03)}.mb-12{margin-bottom:var(--road-spacing-04)}.mb-16{margin-bottom:var(--road-spacing-05)}.mb-24{margin-bottom:var(--road-spacing-06)}.ml-0{margin-left:0}.ml-4{margin-left:var(--road-spacing-02)}.ml-8{margin-left:var(--road-spacing-03)}.ml-12{margin-left:var(--road-spacing-04)}.ml-16{margin-left:var(--road-spacing-05)}.ml-24{margin-left:var(--road-spacing-06)}.p-0{padding:0}.p-4{padding:var(--road-spacing-02)}.p-8{padding:var(--road-spacing-03)}.p-12{padding:var(--road-spacing-04)}.p-16{padding:var(--road-spacing-05)}.p-24{padding:var(--road-spacing-06)}.px-0{padding-right:0;padding-left:0}.px-4{padding-right:var(--road-spacing-02);padding-left:var(--road-spacing-02)}.px-8{padding-right:var(--road-spacing-03);padding-left:var(--road-spacing-03)}.px-12{padding-right:var(--road-spacing-04);padding-left:var(--road-spacing-04)}.px-16{padding-right:var(--road-spacing-05);padding-left:var(--road-spacing-05)}.px-24{padding-right:var(--road-spacing-06);padding-left:var(--road-spacing-06)}.py-0{padding-top:0;padding-bottom:0}.py-4{padding-top:var(--road-spacing-02);padding-bottom:var(--road-spacing-02)}.py-8{padding-top:var(--road-spacing-03);padding-bottom:var(--road-spacing-03)}.py-12{padding-top:var(--road-spacing-04);padding-bottom:var(--road-spacing-04)}.py-16{padding-top:var(--road-spacing-05);padding-bottom:var(--road-spacing-05)}.py-24{padding-top:var(--road-spacing-06);padding-bottom:var(--road-spacing-06)}.pt-0{padding-top:0}.pt-4{padding-top:var(--road-spacing-02)}.pt-8{padding-top:var(--road-spacing-03)}.pt-12{padding-top:var(--road-spacing-04)}.pt-16{padding-top:var(--road-spacing-05)}.pt-24{padding-top:var(--road-spacing-06)}.pr-0{padding-right:0}.pr-4{padding-right:var(--road-spacing-02)}.pr-8{padding-right:var(--road-spacing-03)}.pr-12{padding-right:var(--road-spacing-04)}.pr-16{padding-right:var(--road-spacing-05)}.pr-24{padding-right:var(--road-spacing-06)}.pb-0{padding-bottom:0}.pb-4{padding-bottom:var(--road-spacing-02)}.pb-8{padding-bottom:var(--road-spacing-03)}.pb-12{padding-bottom:var(--road-spacing-04)}.pb-16{padding-bottom:var(--road-spacing-05)}.pb-24{padding-bottom:var(--road-spacing-06)}.pl-0{padding-left:0}.pl-4{padding-left:var(--road-spacing-02)}.pl-8{padding-left:var(--road-spacing-03)}.pl-12{padding-left:var(--road-spacing-04)}.pl-16{padding-left:var(--road-spacing-05)}.pl-24{padding-left:var(--road-spacing-06)}.gap-0{gap:0}.gap-4{gap:var(--road-spacing-02)}.gap-8{gap:var(--road-spacing-03)}.gap-12{gap:var(--road-spacing-04)}.gap-16{gap:var(--road-spacing-05)}.gap-24{gap:var(--road-spacing-06)}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.font-weight-normal{font-weight:400}.font-weight-bold{font-weight:700}.font-italic{font-style:italic}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-primary{color:var(--road-primary-10)}.text-secondary{color:var(--road-primary-50)}.text-accent{color:var(--road-secondary-50)}.text-info{color:var(--road-on-info-surface)}.text-success{color:var(--road-on-success-surface)}.text-warning{color:var(--road-on-warning-surface)}.text-danger{color:var(--road-on-danger-surface)}.text-gray{color:var(--road-on-surface-weak)}.text-gray-second{color:var(--road-on-surface-extra-weak)}.text-disabled{color:var(--road-on-surface-disabled)}.text-white{--text:var(--road-on-primary);color:var(--road-on-primary)}.bg-primary{background-color:var(--road-primary-variant)}.bg-secondary{background-color:var(--road-secondary)}.bg-accent{background-color:var(--road-secondary-50)}.bg-info{background-color:var(--road-info-surface-inverse)}.bg-success{background-color:var(--road-success-surface-inverse)}.bg-warning{background-color:var(--road-warning-surface-inverse)}.bg-danger{background-color:var(--road-danger-surface-inverse)}.bg-rating{background-color:var(--road-rating)}.bg-light{background-color:var(--road-surface-inverse)}.bg-white{background-color:var(--road-surface)}.border{border:1px solid var(--road-outline)}.border-left{border-left:1px solid var(--road-outline)}.border-top{border-top:1px solid var(--road-outline)}.border-right{border-right:1px solid var(--road-outline)}.border-bottom{border-bottom:1px solid var(--road-outline)}.border-0{border:0 !important}.border-left-0{border-left:0 !important}.border-top-0{border-top:0 !important}.border-right-0{border-right:0 !important}.border-bottom-0{border-bottom:0 !important}.position-relative{position:relative}.position-absolute{position:absolute}.position-fixed{position:fixed}.position-static{position:static}.position-sticky{position:sticky}.w-full{width:100%}.w-screen{width:100vh}.w-auto{width:auto}.h-full{height:100%}.h-screen{height:100vh}.h-auto{height:auto}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.visible{visibility:visible}.invisible{visibility:hidden}
|
|
1
|
+
body{--road-brand-primary:#002b6f;--road-primary-10:#001638;--road-primary-20:#002b6f;--road-primary-30:#004293;--road-primary-40:#005ab8;--road-primary-50:#0071dc;--road-primary-60:#338de3;--road-primary-70:#66aaea;--road-primary-80:#99c6f1;--road-primary-90:#cce3f8;--road-brand-secondary:#fcb731;--road-secondary-10:#9c3305;--road-secondary-20:#b14512;--road-secondary-30:#c4621a;--road-secondary-40:#d67e21;--road-secondary-50:#e99b29;--road-secondary-60:#fcb731;--road-secondary-70:#fdca68;--road-secondary-80:#fdde9f;--road-secondary-90:#fef1d6;--road-grey-0:#000000;--road-grey-5:#11151d;--road-grey-10:#22293a;--road-grey-15:#2c3345;--road-grey-20:#353c50;--road-grey-30:#51586c;--road-grey-40:#6d7488;--road-grey-50:#898fa0;--road-grey-60:#a4a9b6;--road-grey-70:#c1c4cd;--road-grey-80:#dddfe4;--road-grey-85:#e9eaed;--road-grey-90:#f4f4f6;--road-grey-95:#fafafb;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-primary-20);--road-on-header-surface:var(--road-grey-100-new);--road-header-surface-disabled:rgba(255, 255, 255, 0.32);--road-on-header-surface-disabled:rgba(255, 255, 255, 0.4);--road-header-outline:var(--road-primary-20);--road-header-icon:var(--road-grey-100-new);--road-header-icon-variant:var(--road-secondary-60);--road-header-badge:var(--road-secondary-60);--road-on-header-badge:var(--road-primary-10);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-20);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-60);--road-secondary-variant:var(--road-secondary-40);--road-on-secondary:var(--road-grey-10);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-30);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-secondary-50);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-secondary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-blur-light:blur(0.25rem);--road-blur-medium:blur(0.5rem);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-60);--road-button-secondary-variant:var(--road-secondary-40);--road-on-button-secondary:var(--road-grey-10);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-primary-50);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-10);--road-button-fab:var(--road-secondary-60);--road-on-button-fab:var(--road-grey-10);--road-button-fab-variant:var(--road-secondary-40);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-10);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-primary-50);--road-input-surface-variant:var(--road-primary-30);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-primary-30);--road-decorative-surface:var(--road-secondary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-elevation-lowest:0 1px 2px rgba(0, 0, 0, 0.24), 0 1px 3px 1px rgba(0, 0, 0, 0.08);--road-elevation-low:0 1px 2px rgba(41, 44, 51, 0.16), 0 3px 5px 1px rgba(41, 44, 51, 0.12);--road-elevation-average:0 3px 3px rgba(0, 0, 0, 0.16), 0 6px 8px 1px rgba(41, 44, 51, 0.12);--road-elevation-hight:0 3px 3px rgba(0, 0, 0, 0.2), 0 10px 13px 2px rgba(41, 44, 51, 0.12);--road-elevation-highest:0 4px 4px rgba(0, 0, 0, 0.24), 0 12px 16px 6px rgba(41, 44, 51, 0.16);--road-blue-klein-5:#000411;--road-blue-klein-10:#000923;--road-blue-klein-15:#000d34;--road-blue-klein-20:#001146;--road-blue-klein-30:#001a68;--road-blue-klein-40:#00228b;--road-blue-klein-50:#002bae;--road-blue-klein-60:#3355be;--road-blue-klein-70:#6680ce;--road-blue-klein-80:#99aadf;--road-blue-klein-85:#b3bfe7;--road-blue-klein-90:#ccd5ef;--road-blue-klein-95:#e6eaf7;--road-violet-electric-5:#0e0019;--road-violet-electric-10:#1c0032;--road-violet-electric-15:#2a004a;--road-violet-electric-20:#380063;--road-violet-electric-30:#550095;--road-violet-electric-40:#7100c6;--road-violet-electric-50:#8d00f8;--road-violet-electric-60:#a433f9;--road-violet-electric-70:#bb66fb;--road-violet-electric-80:#d199fc;--road-violet-electric-85:#ddb2fd;--road-violet-electric-90:#e8ccfe;--road-violet-electric-95:#f4e5fe;--road-green-monstera-5:#000c01;--road-green-monstera-10:#001901;--road-green-monstera-15:#002502;--road-green-monstera-20:#003203;--road-green-monstera-30:#005705;--road-green-monstera-40:#007006;--road-green-monstera-50:#007c07;--road-green-monstera-60:#339639;--road-green-monstera-70:#66b06a;--road-green-monstera-80:#99cb9c;--road-green-monstera-85:#b3d8b5;--road-green-monstera-90:#cce5cd;--road-green-monstera-95:#e6f2e6;--road-red-pepper-5:#150000;--road-red-pepper-10:#2a0000;--road-red-pepper-15:#3f0000;--road-red-pepper-20:#540000;--road-red-pepper-30:#7f0000;--road-red-pepper-40:#a90000;--road-red-pepper-50:#d30000;--road-red-pepper-60:#dc3333;--road-red-pepper-70:#e56666;--road-red-pepper-80:#ed9999;--road-red-pepper-85:#f2b3b3;--road-red-pepper-90:#f6cccc;--road-red-pepper-95:#fbe6e6;--road-yellow-gold-5:#130e00;--road-yellow-gold-10:#261c00;--road-yellow-gold-15:#3a2a00;--road-yellow-gold-20:#4d3800;--road-yellow-gold-30:#735400;--road-yellow-gold-40:#9a7000;--road-yellow-gold-50:#c08c00;--road-yellow-gold-60:#cda333;--road-yellow-gold-70:#d9ba66;--road-yellow-gold-80:#e6d199;--road-yellow-gold-85:#ecdcb2;--road-yellow-gold-90:#f2e8cc;--road-yellow-gold-95:#f9f4e6;--road-yellow-mikado-5:#191401;--road-yellow-mikado-10:#332702;--road-yellow-mikado-15:#4c3b04;--road-yellow-mikado-20:#664e05;--road-yellow-mikado-30:#997607;--road-yellow-mikado-40:#cc9d0a;--road-yellow-mikado-50:#ffc40c;--road-yellow-mikado-60:#ffd03d;--road-yellow-mikado-70:#ffdc6d;--road-yellow-mikado-80:#ffe79e;--road-yellow-mikado-85:#ffedb6;--road-yellow-mikado-90:#fff3ce;--road-yellow-mikado-95:#fff9e7;--road-tag-default:var(--road-blue-klein-50);--road-tag-ecology:var(--road-green-monstera-50);--road-tag-exclusivity:var(--road-yellow-gold-50);--road-tag-offer:var(--road-red-pepper-50);--road-tag-black-friday:var(--road-grey-0);--road-leading-banner:var(--road-secondary-60);--road-on-leading-banner:var(--road-grey-10);--road-rating:var(--road-yellow-mikado-50);--road-info-10:#0a1628;--road-info-20:#142c51;--road-info-30:#1d4379;--road-info-40:#2759a2;--road-info-50:#316fca;--road-info-60:#5a8cd5;--road-info-70:#83a9df;--road-info-80:#adc5ea;--road-info-90:#d6e2f4;--road-info-95:#ebf1fa;--road-success-10:#0d1b0e;--road-success-20:#1a351b;--road-success-30:#285029;--road-success-40:#356a36;--road-success-50:#428544;--road-success-60:#689d69;--road-success-70:#8eb68f;--road-success-80:#b3ceb4;--road-success-90:#d9e7da;--road-success-95:#ecf3ec;--road-warning-10:#4e3406;--road-warning-20:#9c690d;--road-warning-30:#ea9d13;--road-warning-40:#fab815;--road-warning-50:#fdc93e;--road-warning-60:#ffd966;--road-warning-70:#ffe38c;--road-warning-80:#ffecb3;--road-warning-90:#fff6d9;--road-warning-95:#fffaec;--road-danger-10:#240b09;--road-danger-20:#471711;--road-danger-30:#6b221a;--road-danger-40:#8e2e22;--road-danger-50:#b2392b;--road-danger-60:#c16155;--road-danger-70:#d18880;--road-danger-80:#e0b0aa;--road-danger-90:#f0d7d5;--road-danger-95:#f7ebea;--road-info-surface:var(--road-info-95);--road-info-surface-inverse:var(--road-info-50);--road-on-info-surface:var(--road-info-30);--road-on-info-surface-inverse:var(--road-grey-100-new);--road-info-outline:var(--road-info-50);--road-info-icon:var(--road-info-50);--road-info-icon-inverse:var(--road-grey-100-new);--road-info-background:var(--road-info-surface);--road-info-default:var(--road-info-surface-inverse);--road-info-text:var(--road-on-info-surface);--road-info-contrast:var(--road-on-info-surface-inverse);--road-success-surface:var(--road-success-95);--road-success-surface-inverse:var(--road-success-50);--road-on-success-surface:var(--road-success-30);--road-on-success-surface-inverse:var(--road-grey-100-new);--road-success-outline:var(--road-success-50);--road-success-icon:var(--road-success-50);--road-success-icon-inverse:var(--road-grey-100-new);--road-success-background:var(--road-success-surface);--road-success-default:var(--road-success-surface-inverse);--road-success-text:var(--road-on-success-surface);--road-success-contrast:var(--road-on-success-surface-inverse);--road-warning-surface:var(--road-warning-95);--road-warning-surface-inverse:var(--road-warning-50);--road-on-warning-surface:var(--road-warning-20);--road-on-warning-surface-inverse:var(--road-warning-10);--road-warning-outline:var(--road-warning-30);--road-warning-icon:var(--road-warning-30);--road-warning-icon-inverse:var(--road-warning-10);--road-warning-background:var(--road-warning-surface);--road-warning-default:var(--road-warning-surface-inverse);--road-warning-text:var(--road-on-warning-surface);--road-warning-contrast:var(--road-on-warning-surface-inverse);--road-danger-surface:var(--road-danger-95);--road-danger-surface-inverse:var(--road-danger-50);--road-on-danger-surface:var(--road-danger-30);--road-on-danger-surface-inverse:var(--road-grey-100-new);--road-danger-outline:var(--road-danger-50);--road-danger-icon:var(--road-danger-50);--road-danger-icon-inverse:var(--road-grey-100-new);--road-danger-background:var(--road-danger-surface);--road-danger-default:var(--road-danger-surface-inverse);--road-danger-text:var(--road-on-danger-surface);--road-danger-contrast:var(--road-danger-surface-inverse);--road-font:muli, arial, sans-serif;--road-font-size-75:4.6875rem;--road-font-size-65:4.0625rem;--road-font-size-57:3.5625rem;--road-font-size-49:3.0625rem;--road-font-size-43:2.6875rem;--road-font-size-37:2.3125rem;--road-font-size-32:2rem;--road-font-size-28:1.75rem;--road-font-size-24:1.5rem;--road-font-size-21:1.325rem;--road-font-size-18:1.125rem;--road-font-size-16:1rem;--road-font-size-14:0.875rem;--road-font-size-12:0.75rem;--road-font-size-10:0.625rem;--road-overline:var(--road-font-size-12);--road-legal-medium:var(--road-font-size-12);--road-label-medium:var(--road-font-size-16);--road-label-small:var(--road-font-size-12);--road-label-extra-small:var(--road-font-size-10);--road-caption-medium:var(--road-font-size-12);--road-helper-medium:var(--road-font-size-14);--road-link-large:var(--road-font-size-18);--road-link-medium:var(--road-font-size-16);--road-link-small:var(--road-font-size-14);--road-link-extra-small:var(--road-font-size-12);--road-button-medium:var(--road-font-size-16);--road-button-small:var(--road-font-size-14);--road-display-large:var(--road-font-size-57);--road-display-medium:var(--road-font-size-49);--road-display-small:var(--road-font-size-43);--road-heading-01:var(--road-font-size-32);--road-heading-02:var(--road-font-size-28);--road-heading-03:var(--road-font-size-24);--road-heading-04:var(--road-font-size-21);--road-sub-heading-large:var(--road-font-size-24);--road-sub-heading-medium:var(--road-font-size-21);--road-sub-heading-small:var(--road-font-size-18);--road-body-large:var(--road-font-size-18);--road-body-medium:var(--road-font-size-16);--road-body-small:var(--road-font-size-14);--road-spacing-01:0.125rem;--road-spacing-02:0.25rem;--road-spacing-03:0.5rem;--road-spacing-04:0.75rem;--road-spacing-05:1rem;--road-spacing-06:1.5rem;--road-spacing-07:2rem;--road-spacing-08:2.5rem;--road-spacing-09:3rem;--road-spacing-10:4rem;--road-spacing-11:5rem;--road-spacing-12:6rem;--road-spacing-13:10rem;--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-primary-500);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--road-grey-000:var(--road-grey-100-new);--road-grey-100:var(--road-grey-90);--road-grey-200:var(--road-grey-80);--road-grey-300:var(--road-grey-70);--road-grey-400:var(--road-grey-60);--road-grey-500:var(--road-grey-50);--road-grey-600:var(--road-grey-40);--road-grey-700:var(--road-grey-30);--road-grey-800:var(--road-grey-20);--road-grey-900:var(--road-grey-10);--road-grey-999:var(--road-grey-0);--road-disabled:var(--road-surface-disabled);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900);--info:var(--road-info-default);--info-hover:var(--road-info-text);--info-text:var(--road-info-text);--info-background:var(--road-info-background);--info-contrast:var(--road-grey-000);--success:var(--road-success-default);--success-hover:var(--road-success-text);--success-text:var(--road-success-text);--success-background:var(--road-success-background);--success-contrast:var(--road-grey-000);--warning:var(--road-warning-default);--warning-hover:var(--road-warning-text);--warning-text:var(--road-warning-text);--warning-background:var(--road-warning-background);--warning-contrast:var(--road-grey-900);--danger:var(--road-danger-default);--danger-hover:var(--road-danger-text);--danger-text:var(--road-danger-text);--danger-background:var(--road-danger-background);--danger-contrast:var(--road-grey-000);--icon:var(--road-grey-900);--text:var(--road-grey-900);--text-second:var(--road-grey-600);--text-disabled:var(--road-grey-400);--border-form:var(--road-grey-400);--border:var(--road-grey-300);--background:var(--road-grey-100);--background-second:var(--road-grey-100);--white:var(--road-grey-000);--font:var(--road-font)}@media (min-width: 768px){body{--road-display-large:var(--road-font-size-75);--road-display-medium:var(--road-font-size-65);--road-display-small:var(--road-font-size-57);--road-heading-01:var(--road-font-size-49);--road-heading-02:var(--road-font-size-37);--road-heading-03:var(--road-font-size-32);--road-heading-04:var(--road-font-size-28);--road-sub-heading-large:var(--road-font-size-32);--road-sub-heading-medium:var(--road-font-size-28);--road-sub-heading-small:var(--road-font-size-24)}}.auto5-theme{--road-brand-primary:#002b6f;--road-primary-10:#001638;--road-primary-20:#002b6f;--road-primary-30:#004293;--road-primary-40:#005ab8;--road-primary-50:#0071dc;--road-primary-60:#338de3;--road-primary-70:#66aaea;--road-primary-80:#99c6f1;--road-primary-90:#cce3f8;--road-brand-secondary:#e00008;--road-secondary-10:#2d0002;--road-secondary-20:#5a0003;--road-secondary-30:#860005;--road-secondary-40:#b30006;--road-secondary-50:#e00008;--road-secondary-60:#e63339;--road-secondary-70:#ec666b;--road-secondary-80:#f3999c;--road-secondary-90:#f9ccce;--road-grey-0:#000000;--road-grey-5:#11151d;--road-grey-10:#22293a;--road-grey-15:#2c3345;--road-grey-20:#353c50;--road-grey-30:#51586c;--road-grey-40:#6d7488;--road-grey-50:#898fa0;--road-grey-60:#a4a9b6;--road-grey-70:#c1c4cd;--road-grey-80:#dddfe4;--road-grey-85:#e9eaed;--road-grey-90:#f4f4f6;--road-grey-95:#fafafb;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-primary-20);--road-on-header-surface:var(--road-grey-100-new);--road-header-surface-disabled:rgba(255, 255, 255, 0.32);--road-on-header-surface-disabled:rgba(255, 255, 255, 0.4);--road-header-outline:var(--road-primary-20);--road-header-icon:var(--road-grey-100-new);--road-icon-header-variant:var(--road-secondary-60);--road-header-badge:var(--road-secondary-60);--road-on-header-badge:var(--road-grey-100-new);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-30);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-50);--road-secondary-variant:var(--road-secondary-30);--road-on-secondary:var(--road-grey-100-new);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-30);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-secondary-50);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-grey-70);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-60);--road-button-secondary-variant:var(--road-secondary-30);--road-on-button-secondary:var(--road-grey-100-new);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-primary-50);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-10);--road-button-fab:var(--road-secondary-60);--road-on-button-fab:var(--road-grey-100-new);--road-button-fab-variant:var(--road-secondary-30);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-10);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-primary-50);--road-input-surface-variant:var(--road-primary-30);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-primary-30);--road-decorative-surface:var(--road-secondary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-leading-banner:var(--road-yellow-mikado-50);--road-on-leading-banner:var(--road-grey-10);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}.atu-theme{--road-brand-primary:#bb1e10;--road-primary-10:#250603;--road-primary-20:#4b0b06;--road-primary-30:#70120a;--road-primary-40:#96180d;--road-primary-50:#bb1e10;--road-primary-60:#c94b40;--road-primary-70:#d67870;--road-primary-80:#e4a59f;--road-primary-90:#f1d2cf;--road-brand-secondary:#bb1e10;--road-secondary-10:#0c0a0a;--road-secondary-20:#292727;--road-secondary-30:#474545;--road-secondary-40:#646262;--road-secondary-50:#827f7f;--road-secondary-60:#9f9c9c;--road-secondary-70:#bcbaba;--road-secondary-80:#dad7d7;--road-secondary-90:#f7f4f4;--road-grey-0:#000000;--road-grey-5:#060505;--road-grey-10:#0c0a0a;--road-grey-15:#1b1919;--road-grey-20:#292727;--road-grey-30:#474545;--road-grey-40:#646262;--road-grey-50:#827f7f;--road-grey-60:#9f9c9c;--road-grey-70:#bcbaba;--road-grey-80:#dad7d7;--road-grey-85:#e9e6e6;--road-grey-90:#f7f4f4;--road-grey-95:#fbfafa;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-grey-90);--road-on-header-surface:var(--road-grey-20);--road-header-surface-disabled:rgba(130, 127, 127, 0.24);--road-on-header-surface-disabled:rgba(41, 39, 39, 0.32);--road-header-outline:rgba(71, 69, 69, 0.24);--road-header-icon:var(--road-grey-20);--road-icon-header-variant:var(--road-primary-50);--road-header-badge:var(--road-primary-50);--road-on-header-badge:var(--road-grey-100-new);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-20);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-30);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-20);--road-secondary-variant:var(--road-secondary-10);--road-on-secondary:var(--road-grey-100-new);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-secondary-10);--road-icon:var(--road-grey-20);--road-icon-variant:var(--road-primary-50);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-secondary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-20);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-10);--road-button-secondary-variant:var(--road-secondary-40);--road-on-button-secondary:var(--road-grey-100-new);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-primary-50);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-20);--road-button-fab:var(--road-primary-50);--road-on-button-fab:var(--road-grey-100-new);--road-button-fab-variant:var(--road-primary-30);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-20);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-secondary-10);--road-input-surface-variant:var(--road-secondary-40);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-secondary-10);--road-decorative-surface:var(--road-primary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-leading-banner:var(--road-secondary-10);--road-on-leading-banner:var(--road-grey-100-new);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--road-secondary-100:#f5cccc;--road-secondary-200:#e99d9a;--road-secondary-300:#db706b;--road-secondary-400:#cc463c;--road-secondary-500:#bb1e10;--road-secondary-600:#9e2013;--road-secondary-700:#832114;--road-secondary-800:#681f14;--road-secondary-900:#501b12;--road-secondary-contrast:var(--road-on-secondary);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}.atu-theme road-banner{color:var(--road-grey-100-new)}.midas-theme{--road-brand-primary:#ffd300;--road-primary-10:#280f06;--road-primary-20:#6e450d;--road-primary-30:#b37a15;--road-primary-40:#f9b01c;--road-primary-50:#fcc20e;--road-primary-60:#ffd300;--road-primary-70:#ffde40;--road-primary-80:#ffe980;--road-primary-90:#fff4bf;--road-brand-secondary:#000000;--road-secondary-10:#1a1a1a;--road-secondary-20:#353535;--road-secondary-30:#515151;--road-secondary-40:#6c6c6c;--road-secondary-50:#878787;--road-secondary-60:#a2a2a2;--road-secondary-70:#bebebe;--road-secondary-80:#d9d9d9;--road-secondary-90:#f4f4f4;--road-grey-0:#000000;--road-grey-5:#0d0d0d;--road-grey-10:#1a1a1a;--road-grey-15:#282828;--road-grey-20:#353535;--road-grey-30:#515151;--road-grey-40:#6c6c6c;--road-grey-50:#878787;--road-grey-60:#a2a2a2;--road-grey-70:#bebebe;--road-grey-80:#d9d9d9;--road-grey-85:#e7e7e7;--road-grey-90:#f4f4f4;--road-grey-95:#fafafa;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-secondary-20);--road-on-header-surface:var(--road-grey-10);--road-header-surface-disabled:rgba(135, 135, 135, 0.24);--road-on-header-surface-disabled:rgba(26, 26, 26, 0.32);--road-header-outline:rgba(162, 162, 162, 0.24);--road-header-icon:var(--road-grey-10);--road-icon-header-variant:var(--road-primary-40);--road-header-badge:var(--road-primary-60);--road-on-header-badge:var(--road-grey-10);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-60);--road-primary-variant:var(--road-primary-40);--road-on-primary:var(--road-grey-10);--road-secondary:var(--road-secondary-20);--road-secondary-variant:var(--road-secondary-10);--road-on-secondary:var(--road-grey-100-new);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-40);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-primary-40);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-primary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-button-primary:var(--road-primary-60);--road-button-primary-variant:var(--road-primary-40);--road-on-button-primary:var(--road-grey-10);--road-button-secondary:var(--road-secondary-20);--road-button-secondary-variant:var(--road-secondary-10);--road-on-button-secondary:var(--road-grey-100-new);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-80);--road-button-tertiary-outline:var(--road-primary-60);--road-on-button-tertiary:var(--road-grey-10);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-80);--road-on-button-ghost:var(--road-grey-10);--road-link-primary:var(--road-grey-10);--road-link-secondary:var(--road-primary-30);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-secondary-10);--road-input-surface-variant:var(--road-secondary-20);--road-input-outline:rgba(81, 81, 81, 0.52);--road-input-outline-variant:var(--road-secondary-10);--road-decorative-surface:var(--road-primary-40);--road-decorative-surface-variant:var(--road-secondary-20);--road-leading-banner:var(--road-secondary-10);--road-on-leading-banner:var(--road-grey-100-new);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}.midas-theme road-button[outline][color="primary"],.midas-theme road-button[outline][color="secondary"],.midas-theme .link{color:var(--road-grey-900)}.midas-theme .link:focus,.midas-theme .link:hover{color:var(--road-grey-600)}.mobivia-theme{--road-brand-primary:#b40063;--road-primary-10:#2e0011;--road-primary-20:#5c0026;--road-primary-30:#7f003b;--road-primary-40:#9b004f;--road-primary-50:#b40063;--road-primary-60:#c42674;--road-primary-70:#d24d87;--road-primary-80:#e282a6;--road-primary-90:#f1bbcd;--road-brand-secondary:#f8ab00;--road-secondary-10:#4c2800;--road-secondary-20:#754300;--road-secondary-30:#995e00;--road-secondary-40:#bd7b00;--road-secondary-50:#f8ab00;--road-secondary-60:#ffbb21;--road-secondary-70:#ffca42;--road-secondary-80:#ffda70;--road-secondary-90:#ffeaa8;--road-grey-0:#000000;--road-grey-5:#141413;--road-grey-10:#282826;--road-grey-15:#333331;--road-grey-20:#3d3d3c;--road-grey-30:#565656;--road-grey-40:#757574;--road-grey-50:#8e8e8e;--road-grey-60:#a9a8a7;--road-grey-70:#c3c3c1;--road-grey-80:#deddda;--road-grey-85:#ebeae6;--road-grey-90:#f8f7f3;--road-grey-95:#fcfbf9;--road-grey-100-new:#ffffff;--road-header-surface:var(--road-primary-50);--road-on-header-surface:var(--road-grey-100-new);--road-header-surface-disabled:rgba(255, 255, 255, 0.32);--road-on-header-surface-disabled:rgba(255, 255, 255, 0.4);--road-header-outline:var(--road-primary-50);--road-header-icon:var(--road-grey-10-new);--road-variant-icon-header:var(--road-secondary-60);--road-header-badge:var(--road-secondary-60);--road-on-header-badge:var(--road-grey-10);--road-surface:var(--road-grey-100-new);--road-surface-inverse:var(--road-grey-90);--road-surface-disabled:rgba(137, 143, 160, 0.24);--road-on-surface:var(--road-grey-10);--road-on-surface-weak:rgba(34, 41, 58, 0.64);--road-on-surface-extra-weak:rgba(34, 41, 58, 0.52);--road-on-surface-disabled:rgba(34, 41, 58, 0.32);--road-primary:var(--road-primary-50);--road-primary-variant:var(--road-primary-30);--road-on-primary:var(--road-grey-100-new);--road-secondary:var(--road-secondary-50);--road-secondary-variant:var(--road-secondary-40);--road-on-secondary:var(--road-grey-10);--road-outline:rgba(81, 88, 108, 0.52);--road-outline-weak:rgba(81, 88, 108, 0.24);--road-outline-variant:var(--road-primary-30);--road-icon:var(--road-grey-10);--road-icon-variant:var(--road-secondary-40);--road-icon-inverse:var(--road-grey-100-new);--road-icon-inverse-variant:var(--road-secondary-60);--road-overlay:rgba(0, 0, 0, 0.64);--road-overlay-inverse:rgba(255, 255, 255, 0.64);--road-on-overlay:var(--road-grey-100-new);--road-on-overlay-inverse:var(--road-grey-10);--road-button-primary:var(--road-primary-50);--road-button-primary-variant:var(--road-primary-30);--road-on-button-primary:var(--road-grey-100-new);--road-button-secondary:var(--road-secondary-50);--road-button-secondary-variant:var(--road-secondary-40);--road-on-button-secondary:var(--road-grey-10);--road-button-tertiary:rgba(241, 187, 205, 0);--road-button-tertiary-variant:var(--road-primary-90);--road-button-tertiary-outline:var(--road-primary-50);--road-on-button-tertiary:var(--road-grey-10);--road-button-ghost:rgba(241, 187, 205, 0);--road-button-ghost-variant:var(--road-primary-90);--road-on-button-ghost:var(--road-grey-10);--road-button-fab:var(--road-secondary-50);--road-on-button-fab:var(--road-grey-10);--road-button-fab-variant:var(--road-secondary-40);--road-link-primary:var(--road-primary-50);--road-link-secondary:var(--road-grey-10);--road-link-inverse:var(--road-grey-100-new);--road-input-surface:var(--road-primary-50);--road-input-surface-variant:var(--road-primary-30);--road-input-outline:rgba(81, 88, 108, 0.52);--road-input-outline-variant:var(--road-grey-0);--road-decorative-surface:var(--road-secondary-50);--road-decorative-surface-variant:var(--road-primary-50);--road-leading-banner:var(--road-secondary-50);--road-on-leading-banner:var(--road-grey-10);--road-grey-000:var(--road-grey-100);--road-grey-200:var(--road-grey-80);--road-grey-300:var(--road-grey-70);--road-grey-400:var(--road-grey-60);--road-grey-500:var(--road-grey-50);--road-grey-600:var(--road-grey-40);--road-grey-700:var(--road-grey-30);--road-grey-800:var(--road-grey-20);--road-grey-900:var(--road-grey-10);--road-grey-999:var(--road-grey-0);--road-disabled:var(--road-surface-disabled);--road-primary-100:var(--road-primary-90);--road-primary-200:var(--road-primary-80);--road-primary-300:var(--road-primary-70);--road-primary-400:var(--road-primary-60);--road-primary-500:var(--road-primary-50);--road-primary-600:var(--road-primary-40);--road-primary-700:var(--road-primary-30);--road-primary-800:var(--road-primary-20);--road-primary-900:var(--road-primary-10);--road-primary-contrast:var(--road-on-primary);--road-secondary-100:var(--road-secondary-90);--road-secondary-200:var(--road-secondary-80);--road-secondary-300:var(--road-secondary-70);--road-secondary-400:var(--road-secondary-60);--road-secondary-500:var(--road-secondary-50);--road-secondary-600:var(--road-secondary-40);--road-secondary-700:var(--road-secondary-30);--road-secondary-800:var(--road-secondary-20);--road-secondary-900:var(--road-secondary-10);--road-secondary-contrast:var(--road-on-secondary);--primary:var(--road-brand-primary);--primary-hover:var(--road-grey-999);--primary-darken:var(--road-grey-999);--primary-lighten:var(--road-primary-100);--primary-contrast:var(--road-grey-000);--secondary:var(--road-brand-secondary);--secondary-hover:var(--road-primary-700);--secondary-darken:var(--road-primary-700);--secondary-lighten:var(--road-primary-100);--secondary-contrast:var(--road-grey-000);--accent:var(--road-secondary-500);--accent-hover:var(--road-secondary-700);--accent-darken:var(--road-secondary-700);--accent-lighten:var(--road-secondary-100);--accent-contrast:var(--road-grey-900)}html{-webkit-text-size-adjust:100%}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible;}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{padding:0;border-style:none}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;display:table;max-width:100%;padding:0;color:inherit;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none}[type="search"]{outline-offset:-2px;-webkit-appearance:textfield;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}*,*::before,*::after{box-sizing:border-box}input[type="number"]{-webkit-appearance:textfield;appearance:textfield}body{font-family:var(--road-font, sans-serif);font-size:var(--road-font-size-14);line-height:1.5;color:var(--road-grey-10)}img,embed,iframe,object,audio,video{max-width:100%;height:auto}iframe{border:0}input,textarea,button,select,a{-webkit-tap-highlight-color:rgba(0,0,0,0)}a{text-decoration:none;cursor:pointer}@font-face{font-family:Muli;font-style:normal;font-weight:400;font-display:swap;src:local("Muli Regular"), local("Muli-Regular"), url("fonts/Muli-Regular.woff2") format("woff2"), url("fonts/Muli-Regular.woff") format("woff");unicode-range:U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF}@font-face{font-family:Muli;font-style:normal;font-weight:400;font-display:swap;src:local("Muli Regular"), local("Muli-Regular"), url("fonts/Muli-Regular.woff2") format("woff2"), url("fonts/Muli-Regular.woff") format("woff");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}@font-face{font-family:Muli;font-style:normal;font-weight:700;font-display:swap;src:local("Muli Bold"), local("Muli-Bold"), url("fonts/Muli-Bold.woff2") format("woff2"), url("fonts/Muli-Bold.woff") format("woff");unicode-range:U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF}@font-face{font-family:Muli;font-style:normal;font-weight:700;font-display:swap;src:local("Muli Bold"), local("Muli-Bold"), url("fonts/Muli-Bold.woff2") format("woff2"), url("fonts/Muli-Bold.woff") format("woff");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}.display-large{font-size:var(--road-display-large);font-weight:700;line-height:1.5}.display-medium{font-size:var(--road-display-medium);font-weight:700;line-height:1.5}.display-small{font-size:var(--road-display-small);font-weight:700;line-height:1.5}.h1,.h2,.h3,.h4,.h5,.h6,.h7,.h8,.h9{padding:0;font-weight:700;line-height:1.5;color:var(--road-on-surface)}.title-primary{color:var(--road-brand-primary)}.h1,.h2,.h3,.h4,.h5,.h6,.h7,.h8,.h9,.text-content,.text-small,.text-legal,.text-large,.text-medium{margin:0 0 1rem;font-family:var(--road-font, sans-serif)}.h1{font-size:var(--road-heading-01)}.h2{font-size:var(--road-heading-02)}.h3{font-size:var(--road-heading-03)}.h4{font-size:var(--road-heading-04)}.h5{font-size:var(--road-font-size-24)}.h6{font-size:var(--road-font-size-21)}.h7{font-size:var(--road-font-size-18)}.h8{font-size:var(--road-font-size-16)}.h9{font-size:var(--road-font-size-12);text-transform:uppercase}.sub-heading-large{font-size:var(--road-sub-heading-large);font-weight:700;line-height:1.5}.sub-heading-medium{font-size:var(--road-sub-heading-medium);font-weight:700;line-height:1.5}.sub-heading-small{font-size:var(--road-sub-heading-small);font-weight:700;line-height:1.5}.overline{font-size:var(--road-overline);font-weight:700;text-transform:uppercase}.text-content,.text-small,.text-legal,.text-large,.text-medium{line-height:1.5}.text-large{font-size:var(--road-body-large);color:var(--road-grey-10)}.text-content{font-size:var(--road-body-medium);color:var(--road-grey-10)}.text-medium{font-size:var(--road-body-small);color:var(--road-grey-10)}.text-small{font-size:var(--road-legal-medium)}.text-legal{font-size:var(--road-legal-medium);color:var(--road-grey-60)}.title-underline::after{display:block;width:50px;height:3px;margin-top:8px;content:"";background-color:var(--road-decorative-surface)}.text-center.title-underline::after{margin:8px auto 0}.text-right.title-underline::after{position:absolute;right:2rem}.link{color:var(--road-link-primary);text-decoration:underline;outline:0;transition:color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}.link:hover,.link:focus{text-decoration:none}.link-default{color:var(--road-link-secondary)}.link-white{color:var(--road-link-inverse)}.link-md{font-size:var(--road-link-medium)}.link-sm{font-size:var(--road-link-small)}.link road-icon{color:currentColor}.d-none{display:none}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-block{display:block}.d-flex{display:flex}.d-inline-flex{display:inline-flex}@media (min-width: 576px){.d-sm-none{display:none}.d-sm-inline{display:inline}.d-sm-inline-block{display:inline-block}.d-sm-block{display:block}.d-sm-flex{display:flex}.d-sm-inline-flex{display:inline-flex}}@media (min-width: 768px){.d-md-none{display:none}.d-md-inline{display:inline}.d-md-inline-block{display:inline-block}.d-md-block{display:block}.d-md-flex{display:flex}.d-md-inline-flex{display:inline-flex}}@media (min-width: 992px){.d-lg-none{display:none}.d-lg-inline{display:inline}.d-lg-inline-block{display:inline-block}.d-lg-block{display:block}.d-lg-flex{display:flex}.d-lg-inline-flex{display:inline-flex}}@media (min-width: 1200px){.d-xl-none{display:none}.d-xl-inline{display:inline}.d-xl-inline-block{display:inline-block}.d-xl-block{display:block}.d-xl-flex{display:flex}.d-xl-inline-flex{display:inline-flex}}.flex-row{flex-direction:row}.flex-column{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.flex-grow-0{flex-grow:0}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}.flex-shrink-1{flex-shrink:1}.justify-content-start{justify-content:flex-start}.justify-content-end{justify-content:flex-end}.justify-content-center{justify-content:center}.justify-content-between{justify-content:space-between}.justify-content-around{justify-content:space-around}.align-items-start{align-items:flex-start}.align-items-end{align-items:flex-end}.align-items-center{align-items:center}.align-items-baseline{align-items:baseline}.align-items-stretch{align-items:stretch}@media (min-width: 576px){.flex-sm-wrap{flex-wrap:wrap}.flex-sm-nowrap{flex-wrap:nowrap}.justify-content-sm-start{justify-content:flex-start}.justify-content-sm-end{justify-content:flex-end}.justify-content-sm-center{justify-content:center}.justify-content-sm-between{justify-content:space-between}.justify-content-sm-around{justify-content:space-around}.align-items-sm-start{align-items:flex-start}.align-items-sm-end{align-items:flex-end}.align-items-sm-center{align-items:center}.align-items-sm-baseline{align-items:baseline}.align-items-sm-stretch{align-items:stretch}}@media (min-width: 768px){.flex-md-wrap{flex-wrap:wrap}.flex-md-nowrap{flex-wrap:nowrap}.justify-content-md-start{justify-content:flex-start}.justify-content-md-end{justify-content:flex-end}.justify-content-md-center{justify-content:center}.justify-content-md-between{justify-content:space-between}.justify-content-md-around{justify-content:space-around}.align-items-md-start{align-items:flex-start}.align-items-md-end{align-items:flex-end}.align-items-md-center{align-items:center}.align-items-md-baseline{align-items:baseline}.align-items-md-stretch{align-items:stretch}}@media (min-width: 992px){.flex-lg-wrap{flex-wrap:wrap}.flex-lg-nowrap{flex-wrap:nowrap}.justify-content-lg-start{justify-content:flex-start}.justify-content-lg-end{justify-content:flex-end}.justify-content-lg-center{justify-content:center}.justify-content-lg-between{justify-content:space-between}.justify-content-lg-around{justify-content:space-around}.align-items-lg-start{align-items:flex-start}.align-items-lg-end{align-items:flex-end}.align-items-lg-center{align-items:center}.align-items-lg-baseline{align-items:baseline}.align-items-lg-stretch{align-items:stretch}}@media (min-width: 1200px){.flex-xl-wrap{flex-wrap:wrap}.flex-xl-nowrap{flex-wrap:nowrap}.justify-content-xl-start{justify-content:flex-start}.justify-content-xl-end{justify-content:flex-end}.justify-content-xl-center{justify-content:center}.justify-content-xl-between{justify-content:space-between}.justify-content-xl-around{justify-content:space-around}.align-items-xl-start{align-items:flex-start}.align-items-xl-end{align-items:flex-end}.align-items-xl-center{align-items:center}.align-items-xl-baseline{align-items:baseline}.align-items-xl-stretch{align-items:stretch}}.align-content-start{align-content:flex-start}.align-content-end{align-content:flex-end}.align-content-center{align-content:center}.align-content-between{align-content:space-between}.align-content-around{align-content:space-around}.align-content-stretch{align-content:stretch}.align-self-auto{align-self:auto}.align-self-start{align-self:flex-start}.align-self-end{align-self:flex-end}.align-self-center{align-self:center}.align-self-baseline{align-self:baseline}.align-self-stretch{align-self:stretch}.m-0{margin:0}.m-4{margin:var(--road-spacing-02)}.m-8{margin:var(--road-spacing-03)}.m-12{margin:var(--road-spacing-04)}.m-16{margin:var(--road-spacing-05)}.m-24{margin:var(--road-spacing-06)}.m-auto{margin:auto}.mx-0{margin-right:0;margin-left:0}.mx-4{margin-right:var(--road-spacing-02);margin-left:var(--road-spacing-02)}.mx-8{margin-right:var(--road-spacing-03);margin-left:var(--road-spacing-03)}.mx-12{margin-right:var(--road-spacing-04);margin-left:var(--road-spacing-04)}.mx-16{margin-right:var(--road-spacing-05);margin-left:var(--road-spacing-05)}.mx-24{margin-right:var(--road-spacing-06);margin-left:var(--road-spacing-06)}.mx-auto{margin-right:auto;margin-left:auto}.my-0{margin-top:0;margin-bottom:0}.my-4{margin-top:var(--road-spacing-02);margin-bottom:var(--road-spacing-02)}.my-8{margin-top:var(--road-spacing-03);margin-bottom:var(--road-spacing-03)}.my-12{margin-top:var(--road-spacing-04);margin-bottom:var(--road-spacing-04)}.my-16{margin-top:var(--road-spacing-05);margin-bottom:var(--road-spacing-05)}.my-24{margin-top:var(--road-spacing-06);margin-bottom:var(--road-spacing-06)}.my-auto{margin-top:auto;margin-bottom:auto}.mt-0{margin-top:0}.mt-4{margin-top:var(--road-spacing-02)}.mt-8{margin-top:var(--road-spacing-03)}.mt-12{margin-top:var(--road-spacing-04)}.mt-16{margin-top:var(--road-spacing-05)}.mt-24{margin-top:var(--road-spacing-06)}.mr-0{margin-right:0}.mr-4{margin-right:var(--road-spacing-02)}.mr-8{margin-right:var(--road-spacing-03)}.mr-12{margin-right:var(--road-spacing-04)}.mr-16{margin-right:var(--road-spacing-05)}.mr-24{margin-right:var(--road-spacing-06)}.mb-0{margin-bottom:0}.mb-4{margin-bottom:var(--road-spacing-02)}.mb-8{margin-bottom:var(--road-spacing-03)}.mb-12{margin-bottom:var(--road-spacing-04)}.mb-16{margin-bottom:var(--road-spacing-05)}.mb-24{margin-bottom:var(--road-spacing-06)}.ml-0{margin-left:0}.ml-4{margin-left:var(--road-spacing-02)}.ml-8{margin-left:var(--road-spacing-03)}.ml-12{margin-left:var(--road-spacing-04)}.ml-16{margin-left:var(--road-spacing-05)}.ml-24{margin-left:var(--road-spacing-06)}.p-0{padding:0}.p-4{padding:var(--road-spacing-02)}.p-8{padding:var(--road-spacing-03)}.p-12{padding:var(--road-spacing-04)}.p-16{padding:var(--road-spacing-05)}.p-24{padding:var(--road-spacing-06)}.px-0{padding-right:0;padding-left:0}.px-4{padding-right:var(--road-spacing-02);padding-left:var(--road-spacing-02)}.px-8{padding-right:var(--road-spacing-03);padding-left:var(--road-spacing-03)}.px-12{padding-right:var(--road-spacing-04);padding-left:var(--road-spacing-04)}.px-16{padding-right:var(--road-spacing-05);padding-left:var(--road-spacing-05)}.px-24{padding-right:var(--road-spacing-06);padding-left:var(--road-spacing-06)}.py-0{padding-top:0;padding-bottom:0}.py-4{padding-top:var(--road-spacing-02);padding-bottom:var(--road-spacing-02)}.py-8{padding-top:var(--road-spacing-03);padding-bottom:var(--road-spacing-03)}.py-12{padding-top:var(--road-spacing-04);padding-bottom:var(--road-spacing-04)}.py-16{padding-top:var(--road-spacing-05);padding-bottom:var(--road-spacing-05)}.py-24{padding-top:var(--road-spacing-06);padding-bottom:var(--road-spacing-06)}.pt-0{padding-top:0}.pt-4{padding-top:var(--road-spacing-02)}.pt-8{padding-top:var(--road-spacing-03)}.pt-12{padding-top:var(--road-spacing-04)}.pt-16{padding-top:var(--road-spacing-05)}.pt-24{padding-top:var(--road-spacing-06)}.pr-0{padding-right:0}.pr-4{padding-right:var(--road-spacing-02)}.pr-8{padding-right:var(--road-spacing-03)}.pr-12{padding-right:var(--road-spacing-04)}.pr-16{padding-right:var(--road-spacing-05)}.pr-24{padding-right:var(--road-spacing-06)}.pb-0{padding-bottom:0}.pb-4{padding-bottom:var(--road-spacing-02)}.pb-8{padding-bottom:var(--road-spacing-03)}.pb-12{padding-bottom:var(--road-spacing-04)}.pb-16{padding-bottom:var(--road-spacing-05)}.pb-24{padding-bottom:var(--road-spacing-06)}.pl-0{padding-left:0}.pl-4{padding-left:var(--road-spacing-02)}.pl-8{padding-left:var(--road-spacing-03)}.pl-12{padding-left:var(--road-spacing-04)}.pl-16{padding-left:var(--road-spacing-05)}.pl-24{padding-left:var(--road-spacing-06)}.gap-0{gap:0}.gap-4{gap:var(--road-spacing-02)}.gap-8{gap:var(--road-spacing-03)}.gap-12{gap:var(--road-spacing-04)}.gap-16{gap:var(--road-spacing-05)}.gap-24{gap:var(--road-spacing-06)}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.font-weight-normal{font-weight:400}.font-weight-bold{font-weight:700}.font-italic{font-style:italic}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-primary{color:var(--road-primary-10)}.text-secondary{color:var(--road-primary-50)}.text-accent{color:var(--road-secondary-50)}.text-info{color:var(--road-on-info-surface)}.text-success{color:var(--road-on-success-surface)}.text-warning{color:var(--road-on-warning-surface)}.text-danger{color:var(--road-on-danger-surface)}.text-gray{color:var(--road-on-surface-weak)}.text-gray-second{color:var(--road-on-surface-extra-weak)}.text-disabled{color:var(--road-on-surface-disabled)}.text-white{--text:var(--road-on-primary);color:var(--road-on-primary)}.bg-primary{background-color:var(--road-primary-variant)}.bg-secondary{background-color:var(--road-secondary)}.bg-accent{background-color:var(--road-secondary-50)}.bg-info{background-color:var(--road-info-surface-inverse)}.bg-success{background-color:var(--road-success-surface-inverse)}.bg-warning{background-color:var(--road-warning-surface-inverse)}.bg-danger{background-color:var(--road-danger-surface-inverse)}.bg-rating{background-color:var(--road-rating)}.bg-light{background-color:var(--road-surface-inverse)}.bg-white{background-color:var(--road-surface)}.border{border:1px solid var(--road-outline)}.border-left{border-left:1px solid var(--road-outline)}.border-top{border-top:1px solid var(--road-outline)}.border-right{border-right:1px solid var(--road-outline)}.border-bottom{border-bottom:1px solid var(--road-outline)}.border-0{border:0 !important}.border-left-0{border-left:0 !important}.border-top-0{border-top:0 !important}.border-right-0{border-right:0 !important}.border-bottom-0{border-bottom:0 !important}.position-relative{position:relative}.position-absolute{position:absolute}.position-fixed{position:fixed}.position-static{position:static}.position-sticky{position:sticky}.w-full{width:100%}.w-screen{width:100vh}.w-auto{width:auto}.h-full{height:100%}.h-screen{height:100vh}.h-auto{height:auto}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.visible{visibility:visible}.invisible{visibility:hidden}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,b as a}from"./p-f3d586b3.js";export{s as setNonce}from"./p-f3d586b3.js";const o=()=>{const a=import.meta.url;const o={};if(a!==""){o.resourcesUrl=new URL(".",a).href}return e(o)};o().then((e=>a(JSON.parse('[["p-336f7def",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[2],"max":[2],"step":[1],"value":[2],"size":[1],"dustbin":[4],"readonly":[4],"leftIconClasses":[32],"rightIconClasses":[32],"isDustbinVisible":[32]},null,{"value":["onValueChange"]}],[1,"road-item",{"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-badge",{"color":[1],"bubble":[4]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[1,"road-drawer",{"isOpen":[1028,"is-open"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64],"back":[64]},[[4,"keyup","onEscape"]],{"isOpen":["handleOpen"]}],[1,"road-col"],[1,"road-grid"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"iconOnly":[516,"icon-only"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[6,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"sizes":[1],"type":[1],"value":[1032],"label":[1],"error":[1],"helper":[1],"debounce":[2]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}],[1,"road-input-group"],[1,"road-label"],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]},null,{"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["p-1c5ac353",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["p-09bfd80b",[[1,"road-content-card",{"insetImage":[4,"inset-image"]}]]],["p-c3c92152",[[2,"road-phone-number-input",{"disabled":[4],"countryData":[16],"language":[1],"codeLabel":[1,"code-label"],"phoneLabel":[1,"phone-label"],"phoneValue":[1,"phone-value"],"countryCode":[1,"country-code"],"errorMessage":[1,"error-message"],"required":[4],"selectedCountry":[32],"selectedCountryCode":[32],"phoneNumber":[32],"countryOptions":[32],"returnObject":[32]},null,{"errorMessage":["updateMessagePosition"]}]]],["p-33002e9d",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]},null,{"value":["valueChanged"]}]]],["p-2c8a6854",[[1,"road-profil-dropdown",{"isOpen":[1028,"is-open"]}]]],["p-cbc00bfb",[[1,"road-rating",{"size":[513],"rate":[2],"showreviews":[4],"readonly":[4],"reviews":[2],"reviewsText":[1,"reviews-text"],"url":[1]}]]],["p-2b5974fc",[[1,"road-accordion",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isLightSeparator":[4,"is-light-separator"],"isSmall":[4,"is-small"]}]]],["p-6177bb46",[[1,"road-banner",{"isOpen":[1028,"is-open"],"label":[1],"link":[1],"url":[1],"close":[64]}]]],["p-2c132382",[[1,"road-carousel",{"options":[8],"pager":[4],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]},null,{"options":["optionsChanged"]}]]],["p-414a2791",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"indeterminate":[4],"disabled":[4],"value":[1],"label":[1],"inverse":[4],"error":[1],"helper":[1]},null,{"checked":["checkedChanged"]}]]],["p-4f47f4f7",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["p-e2149bdf",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["p-6e3e0b40",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-9c13b3e4",[[1,"road-dropdown",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isMedium":[4,"is-medium"],"position":[513],"direction":[513]}]]],["p-a73ef7de",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-ee7aaee5",[[6,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"],"showTick":[4,"show-tick"],"showLabels":[4,"show-labels"]},null,{"value":["valueChanged"]}]]],["p-82919e58",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"open":[64],"close":[64]},null,{"isOpen":["isOpenChanged"]}]]],["p-6f170c25",[[1,"road-alert",{"color":[1],"label":[1],"button":[1],"link":[1],"url":[1]}]]],["p-efe6e22f",[[2,"road-area-code",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1025],"triggerRender":[1026,"trigger-render"],"selectedValue":[32]},null,{"value":["valueChanged"]}]]],["p-7048f786",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["p-5053b01a",[[1,"road-button-floating",{"position":[513],"href":[1],"rel":[1],"target":[1]},[[9,"scroll","onScroll"]]]]],["p-0fca389a",[[4,"road-carousel-item"]]],["p-25ade729",[[1,"road-flap",{"color":[1],"filled":[4],"size":[513]}]]],["p-40daa53b",[[1,"road-global-navigation",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-dcb280e3",[[1,"road-illustration",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"illustration":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"illustrationSvgContent":[32],"isVisible":[32]},null,{"name":["loadIllustration"],"src":["loadIllustration"],"illustration":["loadIllustration"]}]]],["p-60e25858",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-336aa5f6",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]]]]],["p-f5cce766",[[1,"road-progress",{"value":[2],"numbersteps":[1],"label":[1],"showstep":[4],"animation":[4],"light":[4],"fullwidth":[4],"color":[1]}]]],["p-254ba3c4",[[1,"road-progress-indicator-horizontal",{"color":[513],"numberStep":[2,"number-step"],"stateFirstStep":[1,"state-first-step"],"stateSecondStep":[1,"state-second-step"],"stateThirdStep":[1,"state-third-step"],"urlStep1":[1,"url-step-1"],"urlStep2":[1,"url-step-2"],"urlStep3":[1,"url-step-3"]}]]],["p-9bef58e1",[[1,"road-progress-indicator-vertical"]]],["p-68599145",[[4,"road-progress-indicator-vertical-item"]]],["p-b2e7bfcb",[[1,"road-progress-tracker"]]],["p-e42a9ec4",[[4,"road-progress-tracker-item"]]],["p-76ccfc61",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"inverse":[4],"error":[4],"helper":[1],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["p-96abbe85",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025],"helper":[1]},null,{"value":["valueChanged"],"error":["errorChanged"]}]]],["p-ea28a425",[[1,"road-segmented-button",{"size":[1],"selected":[1028],"tab":[1]},[[8,"roadSegmentedButtonBarChanged","onButtonBarChanged"],[8,"roadSegmentedButtonbarchanged","onButtonBarChanged"]]]]],["p-20b115ed",[[1,"road-segmented-button-bar",{"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-4ba769a9",[[1,"road-segmented-buttons",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-a44a569a",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1032]},null,{"value":["valueChanged"]}]]],["p-1a761fc0",[[6,"road-select-filter",{"options":[16],"parameters":[8],"isActive":[4,"is-active"],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadBlur","handleBlur"],[0,"roadblur","handleBlur"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[4,"click","onClickOutside"]]]]],["p-b614a9fb",[[1,"road-skeleton"]]],["p-f6d47cda",[[1,"road-spinner",{"size":[513],"color":[513]}]]],["p-30fa62f4",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-6a27b5fc",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["p-b65f0a62",[[1,"road-tab-bar",{"secondary":[4],"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-b09c076d",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["p-d651deea",[[6,"road-table"]]],["p-db7cb1c8",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-cbe0c628",[[1,"road-tag",{"color":[1],"contrast":[4]}]]],["p-5483109e",[[1,"road-text",{"color":[1]}]]],["p-acbc0a14",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"sizes":[1],"readonly":[4],"required":[4],"spellcheck":[4],"resize":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1],"helper":[1]},null,{"value":["valueChanged"]}]]],["p-64aa6fd0",[[2,"road-toggle",{"toggleId":[1,"toggle-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-e2c6d81f",[[1,"road-toolbar-title"]]],["p-25683dc7",[[1,"road-toolbar-title-page"]]],["p-46cccafc",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"contentAlign":[1,"content-align"],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["p-78e9bbd5",[[1,"road-avatar",{"size":[513]}]]],["p-91098d39",[[1,"road-card",{"elevation":[1],"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["p-bfcedcfb",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]},null,{"src":["srcChanged"]}]]]]'),e)));
|
|
1
|
+
import{p as e,b as a}from"./p-f3d586b3.js";export{s as setNonce}from"./p-f3d586b3.js";const o=()=>{const a=import.meta.url;const o={};if(a!==""){o.resourcesUrl=new URL(".",a).href}return e(o)};o().then((e=>a(JSON.parse('[["p-336f7def",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[2],"max":[2],"step":[1],"value":[2],"size":[1],"dustbin":[4],"readonly":[4],"leftIconClasses":[32],"rightIconClasses":[32],"isDustbinVisible":[32]},null,{"value":["onValueChange"]}],[1,"road-item",{"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-badge",{"color":[1],"bubble":[4]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[1,"road-drawer",{"isOpen":[1028,"is-open"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64],"back":[64]},[[4,"keyup","onEscape"]],{"isOpen":["handleOpen"]}],[1,"road-col"],[1,"road-grid"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"iconOnly":[516,"icon-only"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[6,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"sizes":[1],"type":[1],"value":[1032],"label":[1],"error":[1],"helper":[1],"debounce":[2]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}],[1,"road-input-group"],[1,"road-label"],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]},null,{"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["p-1c5ac353",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["p-09bfd80b",[[1,"road-content-card",{"insetImage":[4,"inset-image"]}]]],["p-c3c92152",[[2,"road-phone-number-input",{"disabled":[4],"countryData":[16],"language":[1],"codeLabel":[1,"code-label"],"phoneLabel":[1,"phone-label"],"phoneValue":[1,"phone-value"],"countryCode":[1,"country-code"],"errorMessage":[1,"error-message"],"required":[4],"selectedCountry":[32],"selectedCountryCode":[32],"phoneNumber":[32],"countryOptions":[32],"returnObject":[32]},null,{"errorMessage":["updateMessagePosition"]}]]],["p-33002e9d",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]},null,{"value":["valueChanged"]}]]],["p-2c8a6854",[[1,"road-profil-dropdown",{"isOpen":[1028,"is-open"]}]]],["p-cbc00bfb",[[1,"road-rating",{"size":[513],"rate":[2],"showreviews":[4],"readonly":[4],"reviews":[2],"reviewsText":[1,"reviews-text"],"url":[1]}]]],["p-2b5974fc",[[1,"road-accordion",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isLightSeparator":[4,"is-light-separator"],"isSmall":[4,"is-small"]}]]],["p-6177bb46",[[1,"road-banner",{"isOpen":[1028,"is-open"],"label":[1],"link":[1],"url":[1],"close":[64]}]]],["p-2c132382",[[1,"road-carousel",{"options":[8],"pager":[4],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]},null,{"options":["optionsChanged"]}]]],["p-414a2791",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"indeterminate":[4],"disabled":[4],"value":[1],"label":[1],"inverse":[4],"error":[1],"helper":[1]},null,{"checked":["checkedChanged"]}]]],["p-4f47f4f7",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["p-e2149bdf",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["p-6e3e0b40",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-2a866428",[[1,"road-dropdown",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isMedium":[4,"is-medium"],"position":[513],"direction":[513]}]]],["p-a73ef7de",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-ee7aaee5",[[6,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"],"showTick":[4,"show-tick"],"showLabels":[4,"show-labels"]},null,{"value":["valueChanged"]}]]],["p-82919e58",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"open":[64],"close":[64]},null,{"isOpen":["isOpenChanged"]}]]],["p-6f170c25",[[1,"road-alert",{"color":[1],"label":[1],"button":[1],"link":[1],"url":[1]}]]],["p-efe6e22f",[[2,"road-area-code",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1025],"triggerRender":[1026,"trigger-render"],"selectedValue":[32]},null,{"value":["valueChanged"]}]]],["p-7048f786",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["p-5053b01a",[[1,"road-button-floating",{"position":[513],"href":[1],"rel":[1],"target":[1]},[[9,"scroll","onScroll"]]]]],["p-0fca389a",[[4,"road-carousel-item"]]],["p-25ade729",[[1,"road-flap",{"color":[1],"filled":[4],"size":[513]}]]],["p-40daa53b",[[1,"road-global-navigation",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-dcb280e3",[[1,"road-illustration",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"illustration":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"illustrationSvgContent":[32],"isVisible":[32]},null,{"name":["loadIllustration"],"src":["loadIllustration"],"illustration":["loadIllustration"]}]]],["p-60e25858",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-336aa5f6",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]]]]],["p-f5cce766",[[1,"road-progress",{"value":[2],"numbersteps":[1],"label":[1],"showstep":[4],"animation":[4],"light":[4],"fullwidth":[4],"color":[1]}]]],["p-254ba3c4",[[1,"road-progress-indicator-horizontal",{"color":[513],"numberStep":[2,"number-step"],"stateFirstStep":[1,"state-first-step"],"stateSecondStep":[1,"state-second-step"],"stateThirdStep":[1,"state-third-step"],"urlStep1":[1,"url-step-1"],"urlStep2":[1,"url-step-2"],"urlStep3":[1,"url-step-3"]}]]],["p-9bef58e1",[[1,"road-progress-indicator-vertical"]]],["p-68599145",[[4,"road-progress-indicator-vertical-item"]]],["p-b2e7bfcb",[[1,"road-progress-tracker"]]],["p-e42a9ec4",[[4,"road-progress-tracker-item"]]],["p-76ccfc61",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"inverse":[4],"error":[4],"helper":[1],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["p-96abbe85",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025],"helper":[1]},null,{"value":["valueChanged"],"error":["errorChanged"]}]]],["p-ea28a425",[[1,"road-segmented-button",{"size":[1],"selected":[1028],"tab":[1]},[[8,"roadSegmentedButtonBarChanged","onButtonBarChanged"],[8,"roadSegmentedButtonbarchanged","onButtonBarChanged"]]]]],["p-20b115ed",[[1,"road-segmented-button-bar",{"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-4ba769a9",[[1,"road-segmented-buttons",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-a44a569a",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1032]},null,{"value":["valueChanged"]}]]],["p-1a761fc0",[[6,"road-select-filter",{"options":[16],"parameters":[8],"isActive":[4,"is-active"],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadBlur","handleBlur"],[0,"roadblur","handleBlur"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[4,"click","onClickOutside"]]]]],["p-b614a9fb",[[1,"road-skeleton"]]],["p-f6d47cda",[[1,"road-spinner",{"size":[513],"color":[513]}]]],["p-30fa62f4",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-6a27b5fc",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["p-b65f0a62",[[1,"road-tab-bar",{"secondary":[4],"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-b09c076d",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["p-d651deea",[[6,"road-table"]]],["p-db7cb1c8",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-cbe0c628",[[1,"road-tag",{"color":[1],"contrast":[4]}]]],["p-5483109e",[[1,"road-text",{"color":[1]}]]],["p-acbc0a14",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"sizes":[1],"readonly":[4],"required":[4],"spellcheck":[4],"resize":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1],"helper":[1]},null,{"value":["valueChanged"]}]]],["p-64aa6fd0",[[2,"road-toggle",{"toggleId":[1,"toggle-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-e2c6d81f",[[1,"road-toolbar-title"]]],["p-25683dc7",[[1,"road-toolbar-title-page"]]],["p-46cccafc",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"contentAlign":[1,"content-align"],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["p-78e9bbd5",[[1,"road-avatar",{"size":[513]}]]],["p-63fd28bd",[[1,"road-card",{"elevation":[1],"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["p-bfcedcfb",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]},null,{"src":["srcChanged"]}]]]]'),e)));
|
|
2
2
|
//# sourceMappingURL=roadtrip.esm.js.map
|
package/hydrate/index.js
CHANGED
|
@@ -6295,7 +6295,7 @@ class ButtonBar {
|
|
|
6295
6295
|
}; }
|
|
6296
6296
|
}
|
|
6297
6297
|
|
|
6298
|
-
const cardCss = "/*!@:host*/.sc-road-card-h{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}/*!@:host(.card-elevation-none)*/.card-elevation-none.sc-road-card-h{box-shadow:none}/*!@:host(.card-elevation-lowest)*/.card-elevation-lowest.sc-road-card-h{box-shadow:var(--road-elevation-lowest)}/*!@:host(.card-elevation-average)*/.card-elevation-average.sc-road-card-h{box-shadow:var(--road-elevation-average)}@media (min-width: 768px){/*!@:host*/.sc-road-card-h{padding:var(--road-spacing-06)}}/*!@.card-native*/.card-native.sc-road-card{box-sizing:border-box;display:block;width:100%;height:100%;
|
|
6298
|
+
const cardCss = "/*!@:host*/.sc-road-card-h{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}/*!@:host(.card-elevation-none)*/.card-elevation-none.sc-road-card-h{box-shadow:none}/*!@:host(.card-elevation-lowest)*/.card-elevation-lowest.sc-road-card-h{box-shadow:var(--road-elevation-lowest)}/*!@:host(.card-elevation-average)*/.card-elevation-average.sc-road-card-h{box-shadow:var(--road-elevation-average)}@media (min-width: 768px){/*!@:host*/.sc-road-card-h{padding:var(--road-spacing-06)}}/*!@.card-native*/.card-native.sc-road-card{box-sizing:border-box;display:block;width:100%;height:100%;margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@a,\nbutton*/a.sc-road-card,button.sc-road-card{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}/*!@::slotted(road-icon)*/.sc-road-card-s>road-icon{text-align:center}";
|
|
6299
6299
|
|
|
6300
6300
|
/**
|
|
6301
6301
|
* @slot - Content of the card.
|
|
@@ -6334,13 +6334,12 @@ class Card {
|
|
|
6334
6334
|
}
|
|
6335
6335
|
renderCard() {
|
|
6336
6336
|
const clickable = this.isClickable();
|
|
6337
|
-
const { elevation, href } = this;
|
|
6338
|
-
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
6339
6337
|
if (!clickable) {
|
|
6340
6338
|
return [
|
|
6341
|
-
hAsync(
|
|
6339
|
+
hAsync("slot", null)
|
|
6342
6340
|
];
|
|
6343
6341
|
}
|
|
6342
|
+
const { href } = this;
|
|
6344
6343
|
const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
|
|
6345
6344
|
const attrs = (TagType === 'button')
|
|
6346
6345
|
? { type: this.type }
|
|
@@ -6350,10 +6349,12 @@ class Card {
|
|
|
6350
6349
|
rel: this.rel,
|
|
6351
6350
|
target: this.target,
|
|
6352
6351
|
};
|
|
6353
|
-
return (hAsync(
|
|
6352
|
+
return (hAsync(TagType, Object.assign({}, attrs, { class: "card-native", part: "native", onClick: this.onClick }), hAsync("slot", null)));
|
|
6354
6353
|
}
|
|
6355
6354
|
render() {
|
|
6356
|
-
|
|
6355
|
+
const { elevation } = this;
|
|
6356
|
+
const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;
|
|
6357
|
+
return (hAsync(Host, { class: `${elevationClass}` }, this.renderCard()));
|
|
6357
6358
|
}
|
|
6358
6359
|
get el() { return getElement(this); }
|
|
6359
6360
|
static get style() { return cardCss; }
|
|
@@ -13820,7 +13821,7 @@ class Drawer {
|
|
|
13820
13821
|
}; }
|
|
13821
13822
|
}
|
|
13822
13823
|
|
|
13823
|
-
const dropdownCss = "/*!@:host*/.sc-road-dropdown-h{--margin-top:0.5rem;display:block}/*!@.dropdown*/.dropdown.sc-road-dropdown{position:relative;font-family:var(--road-font)}/*!@.dropdown summary*/.dropdown.sc-road-dropdown summary.sc-road-dropdown{display:block;outline:none}/*!@.dropdown summary::-webkit-details-marker*/.dropdown.sc-road-dropdown summary.sc-road-dropdown::-webkit-details-marker{display:none}/*!@.dropdown-button*/.dropdown-button.sc-road-dropdown{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}/*!@.dropdown-medium-button*/.dropdown-medium-button.sc-road-dropdown{width:2.5rem;height:2.5rem}/*!@.dropdown-button:hover*/.dropdown-button.sc-road-dropdown:hover{background:var(--road-grey-200)}/*!@.position-right*/.position-right.sc-road-dropdown{display:flex;justify-content:flex-end}/*!@.bg-white*/.bg-white.sc-road-dropdown{background:var(--road-grey-000)}/*!@.dropdown-button-icon*/.dropdown-button-icon.sc-road-dropdown{width:2.5rem;height:2.5rem}/*!@.dropdown-medium-button .dropdown-button-icon*/.dropdown-medium-button.sc-road-dropdown .dropdown-button-icon.sc-road-dropdown{width:1.75rem;height:1.75rem}/*!@.dropdown[open] .dropdown-menu*/.dropdown[open].sc-road-dropdown .dropdown-menu.sc-road-dropdown{transform:scaleY(1)}/*!@.dropdown[open] .dropdown-menu.direction-top*/.dropdown[open].sc-road-dropdown .dropdown-menu.direction-top.sc-road-dropdown{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}/*!@.dropdown-menu*/.dropdown-menu.sc-road-dropdown{position:absolute;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}/*!@.dropdown-item*/.dropdown-item.sc-road-dropdown{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}/*!@.dropdown-item-border*/.dropdown-item-border.sc-road-dropdown{border-color:var(--road-outline-weak);border-bottom:1px solid}/*!@.dropdown-item:hover,\n.dropdown-item.focus-visible*/.dropdown-item.sc-road-dropdown:hover,.dropdown-item.focus-visible.sc-road-dropdown{background:var(--road-surface-inverse)}";
|
|
13824
|
+
const dropdownCss = "/*!@:host*/.sc-road-dropdown-h{--margin-top:0.5rem;display:block}/*!@.dropdown*/.dropdown.sc-road-dropdown{position:relative;font-family:var(--road-font)}/*!@.dropdown summary*/.dropdown.sc-road-dropdown summary.sc-road-dropdown{display:block;outline:none}/*!@.dropdown summary::-webkit-details-marker*/.dropdown.sc-road-dropdown summary.sc-road-dropdown::-webkit-details-marker{display:none}/*!@.dropdown-button*/.dropdown-button.sc-road-dropdown{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}/*!@.dropdown-medium-button*/.dropdown-medium-button.sc-road-dropdown{width:2.5rem;height:2.5rem}/*!@.dropdown-button:hover*/.dropdown-button.sc-road-dropdown:hover{background:var(--road-grey-200)}/*!@.position-right*/.position-right.sc-road-dropdown{display:flex;justify-content:flex-end}/*!@.bg-white*/.bg-white.sc-road-dropdown{background:var(--road-grey-000)}/*!@.dropdown-button-icon*/.dropdown-button-icon.sc-road-dropdown{width:2.5rem;height:2.5rem}/*!@.dropdown-medium-button .dropdown-button-icon*/.dropdown-medium-button.sc-road-dropdown .dropdown-button-icon.sc-road-dropdown{width:1.75rem;height:1.75rem}/*!@.dropdown[open] .dropdown-menu*/.dropdown[open].sc-road-dropdown .dropdown-menu.sc-road-dropdown{transform:scaleY(1)}/*!@.dropdown[open] .dropdown-menu.direction-top*/.dropdown[open].sc-road-dropdown .dropdown-menu.direction-top.sc-road-dropdown{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}/*!@.dropdown-menu*/.dropdown-menu.sc-road-dropdown{position:absolute;z-index:1;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}/*!@.dropdown-left*/.dropdown-left.sc-road-dropdown{left:0}/*!@.dropdown-right*/.dropdown-right.sc-road-dropdown{right:0}/*!@.dropdown-item*/.dropdown-item.sc-road-dropdown{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}/*!@.dropdown-item-border*/.dropdown-item-border.sc-road-dropdown{border-color:var(--road-outline-weak);border-bottom:1px solid}/*!@.dropdown-item:hover,\n.dropdown-item.focus-visible*/.dropdown-item.sc-road-dropdown:hover,.dropdown-item.focus-visible.sc-road-dropdown{background:var(--road-surface-inverse)}";
|
|
13824
13825
|
|
|
13825
13826
|
/**
|
|
13826
13827
|
* @slot - Element how will open the dropdown when clicked
|
|
@@ -13846,8 +13847,9 @@ class Dropdown$1 {
|
|
|
13846
13847
|
const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';
|
|
13847
13848
|
const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';
|
|
13848
13849
|
const positionClass = this.position !== undefined ? `position-${this.position}` : '';
|
|
13850
|
+
const dropdownClass = this.position !== undefined ? `dropdown-${this.position}` : '';
|
|
13849
13851
|
const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';
|
|
13850
|
-
return (hAsync("details", { class: "dropdown", open: this.isOpen }, hAsync("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, hAsync("div", { class: `d-flex ${positionClass}` }, hAsync("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, hAsync("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), hAsync("div", { class: `dropdown-menu ${directionClass}` }, hAsync("slot", { name: "list" }))));
|
|
13852
|
+
return (hAsync("details", { class: "dropdown", open: this.isOpen }, hAsync("summary", { "aria-expanded": `${this.isOpen}`, tabindex: "0", role: "button", onClick: this.onClick }, hAsync("div", { class: `d-flex ${positionClass}` }, hAsync("div", { class: `${isLightButtonDropDown} ${isMediumButtonDropDown}` }, hAsync("road-icon", { name: "navigation-more", class: "dropdown-button-icon" })))), hAsync("div", { class: `dropdown-menu ${directionClass} ${dropdownClass}` }, hAsync("slot", { name: "list" }))));
|
|
13851
13853
|
}
|
|
13852
13854
|
static get style() { return dropdownCss; }
|
|
13853
13855
|
static get cmpMeta() { return {
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as i,H as r,a as n}from"./p-f3d586b3.js";const o=":host{position:relative;box-sizing:border-box;display:block;padding:var(--road-spacing-05);margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}@media (min-width: 768px){:host{padding:var(--road-spacing-06)}}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;padding:1.5rem;margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";const a=class{constructor(i){t(this,i);this.roadcardclick=e(this,"roadcardclick",7);this.roadCardClick=e(this,"roadCardClick",7);this.onClick=()=>{var t,e;if(this.value!==undefined){this.roadcardclick.emit({value:this.value,label:(t=this.el.querySelector("road-label"))===null||t===void 0?void 0:t.textContent});this.roadCardClick.emit({value:this.value,label:(e=this.el.querySelector("road-label"))===null||e===void 0?void 0:e.textContent})}};this.elevation="none";this.button=false;this.value=undefined;this.type="button";this.download=undefined;this.href=undefined;this.rel=undefined;this.target=undefined}isClickable(){return this.href!==undefined||this.button}renderCard(){const t=this.isClickable();const{elevation:e,href:n}=this;const o=this.elevation?`card-elevation-${e}`:``;if(!t){return[i(r,{class:`${o}`},i("slot",null))]}const a=t?n===undefined?"button":"a":"div";const s=a==="button"?{type:this.type}:{download:this.download,href:this.href,rel:this.rel,target:this.target};return i(r,{class:`${o}`},i(a,Object.assign({},s,{class:"card-native",part:"native",onClick:this.onClick}),i("slot",null)))}render(){return this.renderCard()}get el(){return n(this)}};a.style=o;export{a as road_card};
|
|
2
|
-
//# sourceMappingURL=p-91098d39.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["cardCss","Card","this","onClick","value","undefined","roadcardclick","emit","label","_a","el","querySelector","textContent","roadCardClick","_b","isClickable","href","button","renderCard","clickable","elevation","elevationClass","h","Host","class","TagType","attrs","type","download","rel","target","Object","assign","part","render"],"sources":["src/components/card/card.css?tag=road-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["/*\n * Card\n *\n * Index\n * - Card\n * - Native\n * - Icon\n */\n\n/* CARD\n -------------------- */\n\n:host {\n position: relative;\n box-sizing: border-box;\n display: block;\n padding: var(--road-spacing-05);\n margin-bottom: var(--margin-bottom, 1rem);\n background: var(--road-surface);\n border: 1px solid var(--road-outline-weak);\n border-radius: var(--road-spacing-02);\n}\n\n:host(.card-elevation-none) {\n box-shadow: none;\n}\n\n:host(.card-elevation-lowest) {\n box-shadow: var(--road-elevation-lowest);\n}\n\n:host(.card-elevation-average) {\n box-shadow: var(--road-elevation-average);\n}\n\n@media (min-width: 768px) {\n\n :host {\n padding: var(--road-spacing-06);\n }\n}\n\n/* NATIVE\n -------------------- */\n\n.card-native {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: 100%;\n padding: 1.5rem;\n margin: 0;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n color: inherit;\n text-align: center;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n letter-spacing: inherit;\n white-space: inherit;\n background: var(--road-surface);\n border: 0;\n border-radius: 0.25rem;\n outline: none;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\na,\nbutton {\n cursor: pointer;\n user-select: none;\n -webkit-user-drag: none;\n}\n\n/* ICON\n -------------------- */\n\n::slotted(road-icon) {\n text-align: center;\n}\n","import { Component, h, Prop, Event, EventEmitter, Element, Host } from '@stencil/core';\n\n/**\n * @slot - Content of the card.\n *\n * @part native - The native HTML button, anchor, or div element that wraps all child elements.\n */\n\n@Component({\n tag: 'road-card',\n styleUrl: 'card.css',\n shadow: true,\n})\nexport class Card {\n\n @Element() el!: HTMLRoadCardElement;\n\n /**\n * The elevation.\n */\n @Prop() elevation?: 'none' | 'lowest' | 'average' = 'none';\n\n /**\n * If `true`, a button tag will be rendered and the card will be tappable.\n */\n @Prop() button: boolean = false;\n\n /**\n * value of the card\n */\n @Prop() value?: string;\n\n /**\n * The type of the button. Only used when an `onclick` or `button` property is present.\n */\n @Prop() type: 'submit' | 'reset' | 'button' = 'button';\n\n /**\n * This attribute instructs browsers to download a URL instead of navigating to\n * it, so the user will be prompted to save it as a local file. If the attribute\n * has a value, it is used as the pre-filled file name in the Save prompt\n * (the user can still change the file name if they want).\n */\n @Prop() download?: string;\n\n /**\n * Contains a URL or a URL fragment that the hyperlink points to.\n * If this property is set, an anchor tag will be rendered.\n */\n @Prop() href?: string;\n\n /**\n * Specifies the relationship of the target object to the link object.\n * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n */\n @Prop() rel?: string;\n\n /**\n * Specifies where to display the linked URL.\n * Only applies when an `href` is provided.\n * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n */\n @Prop() target?: string;\n\n /**\n * Emitted when the card is clicked and send the `value` of the card\n */\n @Event() roadcardclick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n /** @internal */\n @Event() roadCardClick!: EventEmitter<{\n value: string | undefined | null;\n label: string | undefined | null;\n }>;\n\n private isClickable(): boolean {\n return (this.href !== undefined || this.button);\n }\n\n private onClick = () => {\n if(this.value !== undefined) {\n this.roadcardclick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n this.roadCardClick.emit({\n value: this.value,\n label: this.el.querySelector('road-label')?.textContent,\n });\n }\n };\n\n private renderCard() {\n const clickable = this.isClickable();\n const { elevation, href } = this;\n const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;\n if (!clickable) {\n \n \n return [\n <Host class={`${elevationClass}`}>\n <slot/>\n </Host>\n ];\n \n }\n const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div' as any;\n const attrs = (TagType === 'button')\n ? { type: this.type }\n : {\n download: this.download,\n href: this.href,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n <Host class={`${elevationClass}`}>\n <TagType\n {...attrs}\n class=\"card-native\"\n part=\"native\"\n onClick={this.onClick}\n >\n <slot/>\n </TagType>\n </Host>\n );\n }\n\n render() {\n return (\n this.renderCard()\n );\n }\n\n}\n"],"mappings":"gEAAA,MAAMA,EAAU,wjC,MCaHC,EAAI,M,mHAoEPC,KAAAC,QAAU,K,QAChB,GAAGD,KAAKE,QAAUC,UAAW,CAC3BH,KAAKI,cAAcC,KAAK,CACtBH,MAAOF,KAAKE,MACZI,OAAOC,EAAAP,KAAKQ,GAAGC,cAAc,iBAAa,MAAAF,SAAA,SAAAA,EAAEG,cAE9CV,KAAKW,cAAcN,KAAK,CACtBH,MAAOF,KAAKE,MACZI,OAAOM,EAAAZ,KAAKQ,GAAGC,cAAc,iBAAa,MAAAG,SAAA,SAAAA,EAAEF,a,kBArEI,O,YAK5B,M,+BAUoB,S,qFA0CtC,WAAAG,GACN,OAAQb,KAAKc,OAASX,WAAaH,KAAKe,M,CAgBlC,UAAAC,GACN,MAAMC,EAAYjB,KAAKa,cACvB,MAAMK,UAAEA,EAASJ,KAAEA,GAASd,KAC5B,MAAMmB,EAAiBnB,KAAKkB,UAAY,kBAAkBA,IAAc,GACxE,IAAKD,EAAW,CAGd,MAAO,CACLG,EAACC,EAAI,CAACC,MAAO,GAAGH,KAChBC,EAAA,c,CAKJ,MAAMG,EAAUN,EAAaH,IAASX,UAAY,SAAW,IAAO,MACpE,MAAMqB,EAASD,IAAY,SACvB,CAAEE,KAAMzB,KAAKyB,MACb,CACAC,SAAU1B,KAAK0B,SACfZ,KAAMd,KAAKc,KACXa,IAAK3B,KAAK2B,IACVC,OAAQ5B,KAAK4B,QAGjB,OACER,EAACC,EAAI,CAACC,MAAO,GAAGH,KAChBC,EAACG,EAAOM,OAAAC,OAAA,GACFN,EAAK,CACTF,MAAM,cACNS,KAAK,SACL9B,QAASD,KAAKC,UAEdmB,EAAA,c,CAMN,MAAAY,GACE,OACEhC,KAAKgB,Y"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as o,h as r}from"./p-f3d586b3.js";const t=":host{--margin-top:0.5rem;display:block}.dropdown{position:relative;font-family:var(--road-font)}.dropdown summary{display:block;outline:none}.dropdown summary::-webkit-details-marker{display:none}.dropdown-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;cursor:pointer;border-radius:0.25rem}.dropdown-medium-button{width:2.5rem;height:2.5rem}.dropdown-button:hover{background:var(--road-grey-200)}.position-right{display:flex;justify-content:flex-end}.bg-white{background:var(--road-grey-000)}.dropdown-button-icon{width:2.5rem;height:2.5rem}.dropdown-medium-button .dropdown-button-icon{width:1.75rem;height:1.75rem}.dropdown[open] .dropdown-menu{transform:scaleY(1)}.dropdown[open] .dropdown-menu.direction-top{position:absolute;bottom:0;left:0;transform:translate3d(0, -56px, 0);will-change:transform}.dropdown-menu{position:absolute;display:flex;flex-direction:column;width:100%;min-width:16.875rem;padding:0.5rem 0;color:var(--road-on-surface);background:var(--road-surface);border:1px solid;border-color:var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out;transform:scaleY(0);transform-origin:0 0}.dropdown-item{min-height:40px;padding:0 1rem;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);text-align:left;text-decoration:none;cursor:pointer;background:var(--road-surface);border:none;outline:none}.dropdown-item-border{border-color:var(--road-outline-weak);border-bottom:1px solid}.dropdown-item:hover,.dropdown-item.focus-visible{background:var(--road-surface-inverse)}";const n=class{constructor(r){o(this,r);this.onClick=()=>{this.isOpen=!this.isOpen};this.isOpen=false;this.isLight=false;this.isMedium=false;this.position=undefined;this.direction="bottom"}render(){const o=this.isLight==true?`dropdown-button`:"dropdown-button bg-white";const t=this.isMedium==true?`dropdown-medium-button dropdown-button`:"dropdown-button bg-white";const n=this.position!==undefined?`position-${this.position}`:"";const e=this.direction!==undefined?`direction-${this.direction}`:"";return r("details",{class:"dropdown",open:this.isOpen},r("summary",{"aria-expanded":`${this.isOpen}`,tabindex:"0",role:"button",onClick:this.onClick},r("div",{class:`d-flex ${n}`},r("div",{class:`${o} ${t}`},r("road-icon",{name:"navigation-more",class:"dropdown-button-icon"})))),r("div",{class:`dropdown-menu ${e}`},r("slot",{name:"list"})))}};n.style=t;export{n as road_dropdown};
|
|
2
|
-
//# sourceMappingURL=p-9c13b3e4.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["dropdownCss","Dropdown","this","onClick","isOpen","render","isLightButtonDropDown","isLight","isMediumButtonDropDown","isMedium","positionClass","position","undefined","directionClass","direction","h","class","open","tabindex","role","name"],"sources":["src/components/dropdown/dropdown.css?tag=road-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * Dropdown\n *\n * Index\n * - Dropdown\n * - Dropdown menu\n */\n\n/**\n * @prop --margin-top: Top margin of the menu\n */\n\n/* DROPDOWN\n -------------------- */\n\n:host {\n --margin-top: 0.5rem;\n display: block;\n}\n\n.dropdown {\n position: relative;\n font-family: var(--road-font);\n}\n\n.dropdown summary {\n display: block;\n outline: none;\n}\n\n.dropdown summary::-webkit-details-marker { /* remove native arrow */\n display: none;\n}\n\n.dropdown-button{\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 3.5rem;\n height: 3.5rem;\n cursor: pointer;\n border-radius: 0.25rem;\n}\n\n.dropdown-medium-button{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-button:hover{\n background: var(--road-grey-200);\n}\n\n.position-right{\n display: flex;\n justify-content: flex-end;\n}\n\n.bg-white{\n background: var(--road-grey-000);\n}\n\n.dropdown-button-icon{\n width: 2.5rem;\n height: 2.5rem;\n}\n\n.dropdown-medium-button .dropdown-button-icon{\n width: 1.75rem;\n height: 1.75rem;\n}\n\n/**\n * Open state\n */\n\n.dropdown[open] .dropdown-menu {\n transform: scaleY(1);\n}\n\n.dropdown[open] .dropdown-menu.direction-top {\n position: absolute;\n bottom: 0;\n left: 0;\n transform: translate3d(0, -56px, 0);\n will-change: transform;\n}\n\n/* MENU\n -------------------- */\n\n.dropdown-menu {\n position: absolute;\n display: flex;\n flex-direction: column;\n width: 100%;\n min-width: 16.875rem;\n padding: 0.5rem 0;\n color: var(--road-on-surface);\n background: var(--road-surface);\n border: 1px solid;\n border-color: var(--road-outline-weak);\n border-radius: 0.25rem;\n box-shadow: var(--road-elevation-low);\n transition: transform 0.2s ease-in-out;\n transform: scaleY(0);\n transform-origin: 0 0;\n}\n\n/* ITEM\n -------------------- */\n\n.dropdown-item {\n min-height: 40px;\n padding: 0 1rem;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n text-align: left;\n text-decoration: none;\n cursor: pointer;\n background: var(--road-surface);\n border: none;\n outline: none;\n}\n\n.dropdown-item-border {\n border-color: var(--road-outline-weak);\n border-bottom: 1px solid;\n}\n\n/**\n * Hover state\n */\n\n.dropdown-item:hover,\n.dropdown-item.focus-visible {\n background: var(--road-surface-inverse);\n}\n\n\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - Element how will open the dropdown when clicked\n * @slot list - List of item values (you can add border with lines=`full` but not on the last item)\n)\n */\n\n@Component({\n tag: 'road-dropdown',\n styleUrl: 'dropdown.css',\n shadow: true,\n})\nexport class Dropdown {\n\n /**\n * Set to `true` to open the dropdown menu and to `false` to close it.\n */\n @Prop({ mutable: true }) isOpen : boolean = false;\n\n /**\n * If you want to remove background of the dropdown button\n */\n @Prop() isLight : boolean = false;\n \n /**\n * If you want a medium dropdown\n */\n @Prop() isMedium : boolean = false;\n\n /**\n * The button position.\n */\n @Prop({ reflect: true }) position?: 'left' | 'right';\n\n /**\n * The opening direction.\n */\n @Prop({ reflect: true }) direction?: 'top' | 'bottom' = 'bottom';\n\n /**\n * Toggle the display when clicking element in slot\n */\n private onClick = () => {\n this.isOpen = !this.isOpen;\n };\n\n render() {\n\n const isLightButtonDropDown = this.isLight == true ? `dropdown-button` : 'dropdown-button bg-white';\n const isMediumButtonDropDown = this.isMedium == true ? `dropdown-medium-button dropdown-button` : 'dropdown-button bg-white';\n const positionClass = this.position !== undefined ? `position-${this.position}` : '';\n const directionClass = this.direction !== undefined ? `direction-${this.direction}` : '';\n\n\n return (\n <details class=\"dropdown\" open={this.isOpen}>\n <summary aria-expanded={`${this.isOpen}`} tabindex=\"0\" role=\"button\" onClick={this.onClick}>\n <div class={`d-flex ${positionClass}`}>\n <div class={`${isLightButtonDropDown} ${isMediumButtonDropDown}`}>\n <road-icon name=\"navigation-more\" class=\"dropdown-button-icon\"></road-icon>\n </div>\n </div>\n </summary>\n <div class={`dropdown-menu ${directionClass}`}>\n <slot name=\"list\"/>\n </div>\n </details>\n );\n }\n\n}\n"],"mappings":"2CAAA,MAAMA,EAAc,onD,MCaPC,EAAQ,M,yBA8BXC,KAAAC,QAAU,KAChBD,KAAKE,QAAUF,KAAKE,MAAM,E,YA1BgB,M,aAKd,M,cAKC,M,uCAU2B,Q,CAS1D,MAAAC,GAEE,MAAMC,EAAwBJ,KAAKK,SAAW,KAAO,kBAAoB,2BACzE,MAAMC,EAAyBN,KAAKO,UAAY,KAAO,yCAA2C,2BAClG,MAAMC,EAAgBR,KAAKS,WAAaC,UAAY,YAAYV,KAAKS,WAAa,GAClF,MAAME,EAAiBX,KAAKY,YAAcF,UAAY,aAAaV,KAAKY,YAAc,GAGtF,OACEC,EAAA,WAASC,MAAM,WAAWC,KAAMf,KAAKE,QACnCW,EAAA,2BAAwB,GAAGb,KAAKE,SAAUc,SAAS,IAAIC,KAAK,SAAShB,QAASD,KAAKC,SACjFY,EAAA,OAAKC,MAAO,UAAUN,KACpBK,EAAA,OAAKC,MAAO,GAAGV,KAAyBE,KACtCO,EAAA,aAAWK,KAAK,kBAAkBJ,MAAM,4BAI9CD,EAAA,OAAKC,MAAO,iBAAiBH,KAC3BE,EAAA,QAAMK,KAAK,U"}
|