xv-webcomponents 1.24.16-qa.0 → 1.24.18-qa.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/xv-accordion-v2_50.cjs.entry.js +9 -7
- package/dist/cjs/xv-mega-menu-next.cjs.entry.js +5 -5
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.css +28 -14
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.js +4 -4
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.css +28 -14
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.js +4 -4
- package/dist/collection/components/xv-tile/xv-tile.js +4 -2
- package/dist/esm/xv-accordion-v2_50.entry.js +9 -7
- package/dist/esm/xv-mega-menu-next.entry.js +5 -5
- package/dist/types/components/xv-tile/xv-tile.d.ts +1 -0
- package/dist/xv-webcomponents/p-468ee97d.entry.js +1 -0
- package/dist/xv-webcomponents/{p-18d5491c.entry.js → p-b853effd.entry.js} +1 -1
- package/dist/xv-webcomponents/xv-webcomponents.esm.js +1 -1
- package/hydrate/index.js +14 -12
- package/hydrate/index.mjs +14 -12
- package/package.json +1 -1
- package/dist/xv-webcomponents/p-ec19bcc7.entry.js +0 -1
|
@@ -82996,7 +82996,7 @@ const XvLoginModal = class {
|
|
|
82996
82996
|
};
|
|
82997
82997
|
XvLoginModal.style = xvLoginModalCss();
|
|
82998
82998
|
|
|
82999
|
-
const xvMegaMenuCss = () => `.sc-xv-mega-menu-h{--menu-group-width:244px;--menu-group-height:454px;--link-visited:var(--link-primary)}.xv-menu.sc-xv-mega-menu{background:inherit;position:relative;font-family:var(--ff-work-sans), sans-serif}@media (min-width: 992px){.xv-menu.sc-xv-mega-menu{min-height:55px}}.xv-menu.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu *.sc-xv-mega-menu{box-sizing:content-box}.xv-menu-loader.sc-xv-mega-menu{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;background-color:rgba(255, 255, 255, 0.7);display:flex;align-items:center;justify-content:center}@media (max-width: 991px){.xv-menu-loader.sc-xv-mega-menu:not(.open){display:none}}@media (max-width: 991px){.xv-menu.open.sc-xv-mega-menu{padding-bottom:env(safe-area-inset-bottom);max-height:calc(100vh - 120px);overflow:auto;overscroll-behavior:contain}}.xv-menu_mobile.sc-xv-mega-menu{position:relative;display:none}@media (max-width: 991px){.xv-menu_mobile.sc-xv-mega-menu{display:inline-flex}}.xv-menu.sc-xv-mega-menu ul.sc-xv-mega-menu{margin:0;padding:0;list-style:none}.xv-menu.sc-xv-mega-menu .link-chevron.sc-xv-mega-menu{display:inline-block;margin-inline-start:var(--spacing-01)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu{display:block;color:var(--link-primary);text-decoration:none;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:visited{color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-decoration-color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover{color:var(--link-primary-hover);cursor:pointer}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{overflow-x:auto;display:flex;justify-content:flex-start;column-gap:var(--spacing-08)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{flex-direction:column;display:none}}.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:auto;display:flex;align-items:center;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:unset;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu--backdrop.sc-xv-mega-menu{z-index:-1;background-color:rgba(0, 0, 0, 0.3);position:fixed;top:0;left:0;width:100%;height:100%}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.open.sc-xv-mega-menu{display:flex}}.xv-menu.sc-xv-mega-menu .menu-item.sc-xv-mega-menu:hover .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:990;display:flex}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{display:block;margin:0;padding-block:var(--spacing-05, 16px);color:inherit;text-decoration:none;font-size:16px;line-height:24px;font-family:var(--ff-body), sans-serif;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:250ms ease-in-out border-bottom-color;user-select:none;white-space:nowrap}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:-1;position:absolute;left:0;top:100%;width:100%;background-color:var(--background, #fff);display:none;flex-direction:column;border:1px solid var(--border-subtle-01);row-gap:var(--spacing-05);padding-block:var(--spacing-08) var(--spacing-06);min-height:var(--menu-group-height);border-radius:0 0 8px 8px;overflow:hidden;color:var(--interactive-01, #273435)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{min-height:unset;padding-block:unset;position:relative;row-gap:unset;border:none}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{display:flex;align-items:flex-start}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{flex-direction:column;align-items:stretch}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{user-select:none;min-width:var(--menu-group-width);max-width:var(--menu-group-width);color:var(--text-primary, #333);font-size:16px;font-style:normal;font-weight:400;line-height:137.5%;display:flex;column-gap:var(--spacing-04);text-align:right;justify-content:flex-end;cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-text.sc-xv-mega-menu{text-overflow:ellipsis;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{width:8px;height:8px;border-bottom:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(-45deg);transform-origin:bottom;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{max-width:unset;min-width:unset;align-items:stretch;justify-content:flex-start;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container.sc-xv-mega-menu{flex:1;display:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:absolute;top:0;right:0;width:calc(100% - (var(--menu-group-width) + var(--spacing-06) + var(--spacing-09) + var(--spacing-05)));min-height:calc(100% - (var(--spacing-08) + var(--spacing-06)));padding:var(--spacing-08) var(--spacing-06) var(--spacing-06) var(--spacing-09);display:flex;background-color:var(--layer-01, #F7F7F7)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:unset;flex-direction:column;width:100%;flex:1;padding:var(--spacing-06) 0;background-color:var(--background)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.noLabel.sc-xv-mega-menu{left:0;width:calc(100% - (var(--spacing-06) + var(--spacing-09)))}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label.sc-xv-mega-menu{font-weight:600}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{transform-origin:center;transform:rotate(45deg)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-container.sc-xv-mega-menu{display:flex}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-06)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{display:flex;row-gap:var(--spacing-07);column-gap:var(--spacing-05);flex:1}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{flex-direction:column;gap:var(--spacing-07)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{flex-direction:column;flex-wrap:wrap;max-height:365px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{max-height:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{flex-direction:column;justify-content:stretch;align-items:stretch;text-align:center}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{box-sizing:content-box;max-width:228px;min-width:200px;padding-left:var(--spacing-06);border-left:1px solid var(--border-subtle-01)}@media (min-width: 992px) and (max-width: 1199px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{display:none}}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{margin-block-start:var(--spacing-06);border-left:none;padding-left:0;max-width:unset;min-width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{box-shadow:none;background-color:var(--background, #fff)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{font-size:var(--fz-md, 14px);font-style:normal;line-height:18px;letter-spacing:0.16px}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-link_standalone.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{font-family:var(--ff-work-sans), sans-serif}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu{color:var(--text-primary, #333);font-weight:600}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{color:var(--text-secondary, #515151);font-weight:400;padding-top:var(--spacing-03);display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:0}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu:not(:last-child){border-bottom:1px solid var(--border-subtle-01);padding-bottom:var(--spacing-04)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-label.sc-xv-mega-menu{margin:0;font-size:var(--fz-md, 14px);color:var(--text-secondary)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-routes.sc-xv-mega-menu{display:flex;flex-direction:column;row-gap:var(--spacing-05)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{display:inline-flex;align-items:center;column-gap:var(--spacing-03);position:relative;font-size:var(--fz-lg, 16px)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu{color:inherit;text-decoration:none;font-family:var(--ff-work-sans), sans-serif;line-height:133.333%;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:visited{color:inherit}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:hover{color:var(--link-primary);cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{white-space:nowrap}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-tag.sc-xv-mega-menu{font-size:9px}`;
|
|
82999
|
+
const xvMegaMenuCss = () => `.sc-xv-mega-menu-h{--menu-group-width:244px;--menu-group-height:454px;--link-visited:var(--link-primary)}.xv-menu.sc-xv-mega-menu{background:inherit;position:relative;font-family:var(--ff-work-sans), sans-serif}@media (min-width: 992px){.xv-menu.sc-xv-mega-menu{min-height:55px}}.xv-menu.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu *.sc-xv-mega-menu{box-sizing:content-box}.xv-menu-loader.sc-xv-mega-menu{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;background-color:rgba(255, 255, 255, 0.7);display:flex;align-items:center;justify-content:center}@media (max-width: 991px){.xv-menu-loader.sc-xv-mega-menu:not(.open){display:none}}@media (max-width: 991px){.xv-menu.open.sc-xv-mega-menu{padding-bottom:env(safe-area-inset-bottom);max-height:calc(100vh - 120px);overflow:auto;overscroll-behavior:contain}}.xv-menu_mobile.sc-xv-mega-menu{position:relative;display:none}@media (max-width: 991px){.xv-menu_mobile.sc-xv-mega-menu{display:inline-flex}}.xv-menu.sc-xv-mega-menu ul.sc-xv-mega-menu{margin:0;padding:0;list-style:none}.xv-menu.sc-xv-mega-menu .link-chevron.sc-xv-mega-menu{display:inline-block;margin-inline-start:var(--spacing-01)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu{display:block;color:var(--link-primary);font-family:var(--ff-body), sans-serif;font-size:14px;line-height:20px;font-weight:400;letter-spacing:0.16px;text-decoration:none;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:visited{color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus,.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-decoration-color:var(--link-primary)}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:hover{color:var(--link-primary-hover);cursor:pointer}.xv-menu.sc-xv-mega-menu .action-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{overflow-x:auto;display:flex;justify-content:flex-start;column-gap:var(--spacing-08)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu{flex-direction:column;display:none}}.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:auto;display:flex;align-items:center;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu--right.sc-xv-mega-menu{margin-left:unset;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu--backdrop.sc-xv-mega-menu{z-index:-1;background-color:rgba(0, 0, 0, 0.3);position:fixed;top:0;left:0;width:100%;height:100%}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.open.sc-xv-mega-menu{display:flex}}.xv-menu.sc-xv-mega-menu .menu-item.sc-xv-mega-menu:hover .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:990;display:flex}.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom-color:var(--interactive-02)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item.active.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{display:block;margin:0;padding-block:var(--spacing-05, 16px);color:inherit;text-decoration:none;font-size:16px;line-height:22px;font-family:var(--ff-body), sans-serif;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:250ms ease-in-out border-bottom-color;user-select:none;white-space:nowrap}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-label.sc-xv-mega-menu{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{z-index:-1;position:absolute;left:0;top:100%;width:100%;background-color:var(--background, #fff);display:none;flex-direction:column;border:1px solid var(--border-subtle-01);row-gap:var(--spacing-05);padding-block:var(--spacing-08) var(--spacing-06);min-height:var(--menu-group-height);border-radius:0 0 8px 8px;overflow:hidden;color:var(--interactive-01, #273435)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu-item-groups.sc-xv-mega-menu{min-height:unset;padding-block:unset;position:relative;row-gap:unset;border:none}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{display:flex;align-items:flex-start}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.sc-xv-mega-menu{flex-direction:column;align-items:stretch}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{user-select:none;min-width:var(--menu-group-width);max-width:var(--menu-group-width);color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:16px;font-style:normal;font-weight:400;line-height:22px;display:flex;column-gap:var(--spacing-04);text-align:right;justify-content:flex-end;cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-text.sc-xv-mega-menu{text-overflow:ellipsis;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{width:8px;height:8px;border-bottom:2px solid var(--link-primary, currentColor);border-right:2px solid var(--link-primary, currentColor);transform:rotate(-45deg);transform-origin:bottom;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-label.sc-xv-mega-menu{max-width:unset;min-width:unset;align-items:stretch;justify-content:flex-start;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container.sc-xv-mega-menu{flex:1;display:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:absolute;top:0;right:0;width:calc(100% - (var(--menu-group-width) + var(--spacing-06) + var(--spacing-09) + var(--spacing-05)));min-height:calc(100% - (var(--spacing-08) + var(--spacing-06)));padding:var(--spacing-08) var(--spacing-06) var(--spacing-06) var(--spacing-09);display:flex;background-color:var(--layer-01, #F7F7F7)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.sc-xv-mega-menu{position:unset;flex-direction:column;width:100%;flex:1;padding:var(--spacing-06) 0;background-color:var(--background)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-container-absolute.noLabel.sc-xv-mega-menu{left:0;width:calc(100% - (var(--spacing-06) + var(--spacing-09)))}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label.sc-xv-mega-menu{font-weight:600}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-label-icon.sc-xv-mega-menu{transform-origin:center;transform:rotate(45deg)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group.active.sc-xv-mega-menu .group-container.sc-xv-mega-menu{display:flex}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-06)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{display:flex;row-gap:var(--spacing-07);column-gap:var(--spacing-05);flex:1}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.sc-xv-mega-menu{flex-direction:column;gap:var(--spacing-07)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{flex-direction:column;flex-wrap:wrap;max-height:365px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu{max-height:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-categories.inline.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:none}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-menus-actions.sc-xv-mega-menu{flex-direction:column;justify-content:stretch;align-items:stretch;text-align:center}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{box-sizing:content-box;max-width:228px;min-width:200px;padding-left:var(--spacing-06);border-left:1px solid var(--border-subtle-01)}@media (min-width: 992px) and (max-width: 1199px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{display:none}}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu{margin-block-start:var(--spacing-06);border-left:none;padding-left:0;max-width:unset;min-width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{box-shadow:none;background-color:var(--background, #fff)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card.sc-xv-mega-menu .xv-card.sc-xv-mega-menu{width:unset}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu,.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{margin:0;font-family:var(--ff-body), sans-serif;font-size:16px;font-style:normal;line-height:22px;letter-spacing:0}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-title.sc-xv-mega-menu{display:block;color:var(--text-primary, #333);font-weight:600}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .group-card-desc.sc-xv-mega-menu{color:var(--text-secondary, #515151);font-weight:400;padding-top:var(--spacing-03);margin-bottom:var(--spacing-03);display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu{flex:0}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category.sc-xv-mega-menu:not(:last-child){border-bottom:1px solid var(--border-subtle-01);padding-bottom:var(--spacing-04)}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-label.sc-xv-mega-menu{display:block;margin:0;font-family:var(--ff-body), sans-serif;font-size:14px;line-height:18px;font-weight:400;letter-spacing:0.16px;color:var(--text-secondary)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .category-routes.sc-xv-mega-menu{display:flex;flex-direction:column;row-gap:var(--spacing-05)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{display:inline-flex;align-items:center;column-gap:var(--spacing-03);position:relative;font-size:var(--fz-lg, 16px)}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu{color:inherit;text-decoration:none;font-family:var(--ff-body), sans-serif;font-size:16px;line-height:22px;font-weight:400;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:visited{color:inherit}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:hover{color:var(--link-primary);cursor:pointer}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-link.sc-xv-mega-menu:focus{outline:1px solid var(--focus);outline-offset:1px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu{white-space:nowrap}}.xv-menu.sc-xv-mega-menu .menu.sc-xv-mega-menu .route.sc-xv-mega-menu .route-tag.sc-xv-mega-menu{font-size:9px}`;
|
|
83000
83000
|
|
|
83001
83001
|
const XvMegaMenu = class {
|
|
83002
83002
|
constructor(hostRef) {
|
|
@@ -83060,15 +83060,15 @@ const XvMegaMenu = class {
|
|
|
83060
83060
|
render() {
|
|
83061
83061
|
return (index$1.h(index$1.Host, { key: '5f2979691c296f255a4af567b13877b58042ebb1' }, index$1.h("nav", { key: '5488cc3b13d3384e349034a7faa519636b450690', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (index$1.h("div", { key: '225a780b15d381eb3dcd01a929165b8d6a3d34c2', class: { 'xv-menu-loader': true, open: this.open } }, index$1.h("xv-loader-v2", { key: 'b66f449bf7154ce77515df080872a75d661d96f1' }))), index$1.h("ul", { key: 'c7e7b2e44ca6966a0ff5aa4fed408064660eff38', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
83062
83062
|
var _a, _b;
|
|
83063
|
-
return (index$1.h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (index$1.h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (index$1.h(index$1.Fragment, null, index$1.h("
|
|
83063
|
+
return (index$1.h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (index$1.h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (index$1.h(index$1.Fragment, null, index$1.h("span", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), index$1.h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
83064
83064
|
var _a;
|
|
83065
83065
|
return (index$1.h("li", { class: { group: true, active: ((_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.id) === group.id } }, (group.label && menuItem.groups.length > 1) && (index$1.h("div", { class: "group-label", onClick: () => this.setActiveGroup(group) }, index$1.h("span", { class: "group-label-text" }, group.label), index$1.h("span", { class: "group-label-icon" }))), index$1.h("div", { class: "group-container" }, index$1.h("div", { class: {
|
|
83066
83066
|
'group-container-absolute': true,
|
|
83067
83067
|
noLabel: !(group.label && menuItem.groups.length > 1),
|
|
83068
|
-
} }, index$1.h("div", { class: "group-menus" }, index$1.h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (index$1.h("li", { class: "category" }, index$1.h("
|
|
83069
|
-
index$1.h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (index$1.h("div", { class: "group-card" }, index$1.h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, index$1.h("
|
|
83068
|
+
} }, index$1.h("div", { class: "group-menus" }, index$1.h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (index$1.h("li", { class: "category" }, index$1.h("span", { class: "category-label" }, category.label), index$1.h("ul", { class: "category-routes" }, category.routes.map((route) => (index$1.h("li", { class: "route" }, index$1.h("a", { class: "route-link", href: route.route || '#' }, route.label), route.tag && (index$1.h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), index$1.h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (index$1.h("li", { class: "action" }, action.type === 'link' && (index$1.h("a", { class: "action-link", href: action === null || action === void 0 ? void 0 : action.url }, action.label, index$1.h("span", { class: "link-chevron" }, "\u2192"))), action.type === 'button' &&
|
|
83069
|
+
index$1.h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (index$1.h("div", { class: "group-card" }, index$1.h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, index$1.h("span", { slot: "header", class: "group-card-title" }, group.card.title), index$1.h("span", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (index$1.h("a", { slot: "footer", class: "action-link", href: group.card.linkUrl || '#' }, group.card.linkLabel, index$1.h("span", { class: "link-chevron" }, "\u2192"))))))))));
|
|
83070
83070
|
}))))));
|
|
83071
|
-
}), index$1.h("li", { key: '
|
|
83071
|
+
}), index$1.h("li", { key: '9889408ddd0da2f33c4c9d6458af04ee4ae3e17d', class: "menu--right" }, index$1.h("slot", { key: 'af22cbe42fed3aa0474982c64360d9ea4413db38', name: "menu-right" })), this.open && (index$1.h("li", { key: '19db99cbf45a66836266e2c334220277304486bb', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
83072
83072
|
}
|
|
83073
83073
|
get el() { return index$1.getElement(this); }
|
|
83074
83074
|
};
|
|
@@ -84615,6 +84615,7 @@ XvTextarea.style = xvTextareaCss();
|
|
|
84615
84615
|
|
|
84616
84616
|
const xvTileCss = () => `@charset "UTF-8";.xv-tile--host{display:contents}.xv-tile--host[message]{display:inherit;position:relative}.xv-tile--host[message]:hover:before{content:attr(message);display:block;position:absolute;background-color:var(--background-inverse, #333);color:var(--text-on-color, #fff);padding:1em 3em;border-radius:5px;font-size:0.8em;left:0;bottom:100%;white-space:wrap;opacity:1;z-index:2}.xv-tile--host .xv-tile{min-height:64px;min-width:128px;border-radius:3px;border:1px solid var(--border-tile-02, #ACACAC);outline:2px solid transparent;background-color:var(--layer-02, #FFF);text-align:left;user-select:none;grid-template-columns:1fr auto;grid-template-areas:"content control" "footer footer" "expandable expandable";display:inline-grid;color:var(--text-primary, #333)}.xv-tile--host .xv-tile--variant-selectable,.xv-tile--host .xv-tile--variant-expandable,.xv-tile--host .xv-tile--variant-clickable{cursor:pointer;transition:250ms ease-in-out background-color}.xv-tile--host .xv-tile--variant-selectable:hover,.xv-tile--host .xv-tile--variant-expandable:hover,.xv-tile--host .xv-tile--variant-clickable:hover{border-color:var(--border-tile-01, #D1D1D1);background-color:var(--layer-hover-02, #F7F7F7)}.xv-tile--host .xv-tile--variant-selectable:active,.xv-tile--host .xv-tile--variant-expandable:active,.xv-tile--host .xv-tile--variant-clickable:active{background-color:var(--layer-active-02, #D1D1D1)}.xv-tile--host .xv-tile--variant-selectable:focus-within,.xv-tile--host .xv-tile--variant-expandable:focus-within,.xv-tile--host .xv-tile--variant-clickable:focus-within{outline-width:1px;outline-color:var(--focus)}.xv-tile--host .xv-tile--variant-selectable.selected,.xv-tile--host .xv-tile--variant-expandable.selected,.xv-tile--host .xv-tile--variant-clickable.selected{background-color:var(--layer-selected-02, #E3E3E3)}.xv-tile--host .xv-tile--variant-selectable.selected:hover,.xv-tile--host .xv-tile--variant-expandable.selected:hover,.xv-tile--host .xv-tile--variant-clickable.selected:hover{background-color:var(--layer-selected-hover-02, #DADADA)}.xv-tile--host .xv-tile--block{display:grid}.xv-tile--host .xv-tile--error{border-color:var(--support-error);outline:2px solid var(--support-error)}.xv-tile--host .xv-tile--disabled{border-color:var(--border-disabled, #D1D1D1);background-color:var(--layer-01, #F7F7F7);color:var(--text-disabled, rgba(19, 19, 19, 0.25));user-select:none;pointer-events:none;cursor:not-allowed}.xv-tile--host .xv-tile_content{grid-area:content;font-style:normal;font-weight:400;font-size:var(--fz-md, 14px);line-height:20px;letter-spacing:0.16px}.xv-tile--host .xv-tile_content>*{margin:0;padding:0}.xv-tile--host .xv-tile_content__title{font-size:20px;line-height:28px;letter-spacing:unset}.xv-tile--host .xv-tile_content:not(:empty){padding:var(--spacing-05, 16px)}.xv-tile--host .xv-tile_control{grid-area:control}.xv-tile--host .xv-tile_control:not(:empty){padding-block:var(--spacing-05, 16px);padding-inline-end:var(--spacing-05, 16px)}.xv-tile--host .xv-tile_control input[type=checkbox],.xv-tile--host .xv-tile_control input[type=radio]{-webkit-appearance:none;appearance:none;background-color:#fff;margin:0;width:16px;height:16px;position:relative;display:inline-flex;align-items:center;justify-content:center}.xv-tile--host .xv-tile_control input[type=checkbox]:focus,.xv-tile--host .xv-tile_control input[type=radio]:focus{outline:1.4px solid var(--focus)}.xv-tile--host .xv-tile_control input[type=checkbox]:before,.xv-tile--host .xv-tile_control input[type=checkbox]:after,.xv-tile--host .xv-tile_control input[type=radio]:before,.xv-tile--host .xv-tile_control input[type=radio]:after{display:inline-block;border-radius:inherit;transition:200ms ease-in-out border-color, 200ms ease-in-out background-color}.xv-tile--host .xv-tile_control input[type=checkbox]:before,.xv-tile--host .xv-tile_control input[type=radio]:before{content:"";width:inherit;height:inherit;background-color:#fff;border:1px solid var(--icon-primary, #131313);box-sizing:border-box}.xv-tile--host .xv-tile_control input[type=checkbox]:after,.xv-tile--host .xv-tile_control input[type=radio]:after{position:absolute}.xv-tile--host .xv-tile_control input[type=checkbox]:checked:before,.xv-tile--host .xv-tile_control input[type=radio]:checked:before{border-color:var(--background-brand, #97BF0D)}.xv-tile--host .xv-tile_control input[type=checkbox]:checked:after,.xv-tile--host .xv-tile_control input[type=radio]:checked:after{content:""}.xv-tile--host .xv-tile_control input[type=checkbox]{border-radius:2px}.xv-tile--host .xv-tile_control input[type=checkbox]:after{width:5px;height:8px;border:solid #fff;margin-bottom:2px;border-width:0 2px 2px 0;transform:rotate(45deg)}.xv-tile--host .xv-tile_control input[type=checkbox]:checked:not([readonly]):before{background-color:var(--background-brand, #97BF0D)}.xv-tile--host .xv-tile_control input[type=checkbox]:checked[readonly]:before{background-color:transparent}.xv-tile--host .xv-tile_control input[type=checkbox]:checked[readonly]:before,.xv-tile--host .xv-tile_control input[type=checkbox]:checked[readonly]:after{border-color:var(--text-disabled, rgba(18, 18, 18, 0.25))}.xv-tile--host .xv-tile_control input[type=radio]{border-radius:50%}.xv-tile--host .xv-tile_control input[type=radio]:after{width:50%;height:50%;background-color:var(--background-brand, #97BF0D)}.xv-tile--host .xv-tile_footer{grid-area:footer;display:flex;justify-content:flex-end}.xv-tile--host .xv-tile_footer__icon{pointer-events:none;background-color:transparent;outline:none;border:none;margin:0;padding:var(--spacing-05, 16px);font-size:16px;display:inline-flex;align-items:center;justify-content:center}.xv-tile--host .xv-tile_footer__icon:before{content:"";display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px}.xv-tile--host .xv-tile_footer__icon.icon--clickable:before{content:"➔"}.xv-tile--host .xv-tile_footer__icon.icon--expandable:before{width:12px;height:12px;border-style:solid;border-width:0 2px 2px 0;transform:rotate(45deg);transform-origin:center;transition:200ms ease-in-out transform}.xv-tile--host .xv-tile_footer__icon.icon--expandable.open:before{transform:rotate(-135deg)}.xv-tile--host .xv-tile_expandable{grid-area:expandable;display:none}.xv-tile--host .xv-tile_expandable.open{display:block}.xv-tile--host .xv-tile_expandable [slot=expandable]{margin:0;padding-inline:var(--spacing-05, 16px);padding-block-end:var(--spacing-05, 16px)}`;
|
|
84617
84617
|
|
|
84618
|
+
let tileUid = 0;
|
|
84618
84619
|
const XvTile = class {
|
|
84619
84620
|
constructor(hostRef) {
|
|
84620
84621
|
index$1.registerInstance(this, hostRef);
|
|
@@ -84622,6 +84623,7 @@ const XvTile = class {
|
|
|
84622
84623
|
this.variant = 'base';
|
|
84623
84624
|
this.checked = false;
|
|
84624
84625
|
this.readonly = false;
|
|
84626
|
+
this.inputId = `xv-tile-${tileUid++}`;
|
|
84625
84627
|
this.handleChange = (e) => {
|
|
84626
84628
|
const input = e.target;
|
|
84627
84629
|
this.checked = !!input.checked;
|
|
@@ -84647,7 +84649,7 @@ const XvTile = class {
|
|
|
84647
84649
|
this.checked = !this.checked;
|
|
84648
84650
|
}
|
|
84649
84651
|
render() {
|
|
84650
|
-
return (index$1.h(index$1.Host, { key: '
|
|
84652
|
+
return (index$1.h(index$1.Host, { key: 'e9093c3a902d972bdeb4c0696daf2f9e57cc1b09', class: "xv-tile--host" }, index$1.h("label", { key: '1ac7a225720930bee3cc9c58228f04c65cf6df41', htmlFor: this.variant === 'selectable' ? this.inputId : undefined, class: {
|
|
84651
84653
|
[this.el.className]: !!this.el.className,
|
|
84652
84654
|
'xv-tile': true,
|
|
84653
84655
|
[`xv-tile--variant-${this.variant}`]: !!this.variant,
|
|
@@ -84655,7 +84657,7 @@ const XvTile = class {
|
|
|
84655
84657
|
'xv-tile--disabled': !!this.disabled,
|
|
84656
84658
|
'selected': !!this.checked,
|
|
84657
84659
|
'xv-tile--error': !!this.error,
|
|
84658
|
-
} }, index$1.h("div", { key: '
|
|
84660
|
+
} }, index$1.h("div", { key: '46cdcfaea2dc4064c1af27591c638a08bd349003', class: "xv-tile_content" }, this.label && index$1.h("p", { key: 'eb8bbc489d077061f76d0e86c3623f4d70c0fc71', class: "xv-tile_content__title" }, this.label), index$1.h("slot", { key: '54fd4d5852efc46bbb4dc101e7484416e09f86c3' })), this.variant === 'selectable' && (index$1.h("div", { key: '49922cc57a1d57cb42d7f7712019630ce773e68c', class: "xv-tile_control" }, this.multiple ? (index$1.h("input", { type: "checkbox", id: this.inputId, disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })) : (index$1.h("input", { type: "radio", id: this.inputId, disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })))), (this.variant === 'clickable' || this.variant === 'expandable') && (index$1.h("div", { key: 'c4c10a986bbd4459719975c250005af5c35c0c79', class: "xv-tile_footer" }, index$1.h("button", { key: '52bfefd1ac2dad91a0defc37b2b671d87a704092', class: { 'xv-tile_footer__icon': true, [`icon--${this.variant}`]: true, open: this.checked } }))), index$1.h("div", { key: '61dab20478eea4fa550ab1f3f2145071eff15039', class: { 'xv-tile_expandable': true, open: this.checked } }, index$1.h("slot", { key: '71dfca2fa1961457aba36c2cd454e115ad08df8b', name: "expandable" })))));
|
|
84659
84661
|
}
|
|
84660
84662
|
get el() { return index$1.getElement(this); }
|
|
84661
84663
|
};
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var index = require('./index-CsKqwBc1.js');
|
|
4
4
|
var index$1 = require('./index-Cb30DBqk.js');
|
|
5
5
|
|
|
6
|
-
const xvMegaMenuNextCss = () => `.sc-xv-mega-menu-next-h{--menu-group-width:244px;--menu-group-height:454px;--link-visited:var(--link-primary)}.xv-menu.sc-xv-mega-menu-next{background:inherit;position:relative;font-family:var(--ff-work-sans), sans-serif}@media (min-width: 992px){.xv-menu.sc-xv-mega-menu-next{min-height:55px}}.xv-menu-loader.sc-xv-mega-menu-next{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;background-color:rgba(255, 255, 255, 0.7);display:flex;align-items:center;justify-content:center}@media (max-width: 991px){.xv-menu-loader.sc-xv-mega-menu-next:not(.open){display:none}}@media (max-width: 991px){.xv-menu.open.sc-xv-mega-menu-next{padding-bottom:env(safe-area-inset-bottom);max-height:calc(100vh - 120px);overflow:auto;overscroll-behavior:contain}}.xv-menu_mobile.sc-xv-mega-menu-next{position:relative;display:none}@media (max-width: 991px){.xv-menu_mobile.sc-xv-mega-menu-next{display:inline-flex}}.xv-menu.sc-xv-mega-menu-next ul.sc-xv-mega-menu-next{margin:0;padding:0;list-style:none}.xv-menu.sc-xv-mega-menu-next .link-chevron.sc-xv-mega-menu-next{display:inline-block;margin-inline-start:var(--spacing-01)}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next{display:block;color:var(--link-primary);text-decoration:none;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:visited{color:var(--link-primary)}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:hover,.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:focus,.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-decoration-color:var(--link-primary)}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:hover{color:var(--link-primary-hover);cursor:pointer}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:focus{outline:1px solid var(--focus);outline-offset:1px}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next{overflow-x:auto;display:flex;justify-content:flex-start;column-gap:var(--spacing-08)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next{flex-direction:column;display:none}}.xv-menu.sc-xv-mega-menu-next .menu--right.sc-xv-mega-menu-next{margin-left:auto;display:flex;align-items:center;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu--right.sc-xv-mega-menu-next{margin-left:unset;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu-next .menu--backdrop.sc-xv-mega-menu-next{z-index:-1;background-color:rgba(0, 0, 0, 0.3);position:fixed;top:0;left:0;width:100%;height:100%}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.open.sc-xv-mega-menu-next{display:flex}}.xv-menu.sc-xv-mega-menu-next .menu-item.sc-xv-mega-menu-next:hover .menu-item-label.sc-xv-mega-menu-next{border-bottom-color:var(--interactive-02)}.xv-menu.sc-xv-mega-menu-next .menu-item.active.sc-xv-mega-menu-next .menu-item-groups.sc-xv-mega-menu-next{z-index:990;display:flex}.xv-menu.sc-xv-mega-menu-next .menu-item.active.sc-xv-mega-menu-next .menu-item-label.sc-xv-mega-menu-next{border-bottom-color:var(--interactive-02)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu-item.active.sc-xv-mega-menu-next{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu-next .menu-item-label.sc-xv-mega-menu-next{display:block;margin:0;padding-block:var(--spacing-05, 16px);color:inherit;text-decoration:none;font-size:16px;line-height:24px;font-family:var(--ff-body), sans-serif;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:250ms ease-in-out border-bottom-color;user-select:none;white-space:nowrap}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu-item-label.sc-xv-mega-menu-next{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu-next .menu-item-groups.sc-xv-mega-menu-next{z-index:-1;position:absolute;left:0;top:100%;width:100%;background-color:var(--background, #fff);display:none;flex-direction:column;border:1px solid var(--border-subtle-01);row-gap:var(--spacing-05);padding-block:var(--spacing-08) var(--spacing-06);min-height:var(--menu-group-height);border-radius:0 0 8px 8px;overflow:hidden;color:var(--interactive-01, #273435)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu-item-groups.sc-xv-mega-menu-next{min-height:unset;padding-block:unset;position:relative;row-gap:unset;border:none}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.sc-xv-mega-menu-next{display:flex;align-items:flex-start}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.sc-xv-mega-menu-next{flex-direction:column;align-items:stretch}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label.sc-xv-mega-menu-next{user-select:none;min-width:var(--menu-group-width);max-width:var(--menu-group-width);color:var(--text-primary, #333);font-size:16px;font-style:normal;font-weight:400;line-height:137.5%;display:flex;column-gap:var(--spacing-04);text-align:right;justify-content:flex-end;cursor:pointer}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label-text.sc-xv-mega-menu-next{text-overflow:ellipsis;overflow:hidden}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label-icon.sc-xv-mega-menu-next{width:8px;height:8px;border-bottom:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(-45deg);transform-origin:bottom;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label.sc-xv-mega-menu-next{max-width:unset;min-width:unset;align-items:stretch;justify-content:flex-start;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container.sc-xv-mega-menu-next{flex:1;display:none}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container-absolute.sc-xv-mega-menu-next{position:absolute;top:0;right:0;width:calc(100% - (var(--menu-group-width) + var(--spacing-06) + var(--spacing-09) + var(--spacing-05)));min-height:calc(100% - (var(--spacing-08) + var(--spacing-06)));padding:var(--spacing-08) var(--spacing-06) var(--spacing-06) var(--spacing-09);display:flex;background-color:var(--layer-01, #F7F7F7)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container-absolute.sc-xv-mega-menu-next{position:unset;flex-direction:column;width:100%;flex:1;padding:var(--spacing-06) 0;background-color:var(--background)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container-absolute.noLabel.sc-xv-mega-menu-next{left:0;width:calc(100% - (var(--spacing-06) + var(--spacing-09)))}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.active.sc-xv-mega-menu-next .group-label.sc-xv-mega-menu-next{font-weight:600}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.active.sc-xv-mega-menu-next .group-label-icon.sc-xv-mega-menu-next{transform-origin:center;transform:rotate(45deg)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.active.sc-xv-mega-menu-next .group-container.sc-xv-mega-menu-next{display:flex}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus.sc-xv-mega-menu-next{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-06)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.sc-xv-mega-menu-next{display:flex;row-gap:var(--spacing-07);column-gap:var(--spacing-05);flex:1}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.sc-xv-mega-menu-next{flex-direction:column;gap:var(--spacing-07)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.inline.sc-xv-mega-menu-next{flex-direction:column;flex-wrap:wrap;max-height:365px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.inline.sc-xv-mega-menu-next{max-height:unset}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.inline.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next{flex:none}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-actions.sc-xv-mega-menu-next{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-actions.sc-xv-mega-menu-next{flex-direction:column;justify-content:stretch;align-items:stretch;text-align:center}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next{box-sizing:content-box;max-width:228px;min-width:200px;padding-left:var(--spacing-06);border-left:1px solid var(--border-subtle-01)}@media (min-width: 992px) and (max-width: 1199px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next{display:none}}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next{margin-block-start:var(--spacing-06);border-left:none;padding-left:0;max-width:unset;min-width:unset}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next .xv-card.sc-xv-mega-menu-next{box-shadow:none;background-color:var(--background, #fff)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next .xv-card.sc-xv-mega-menu-next{width:unset}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-title.sc-xv-mega-menu-next,.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-desc.sc-xv-mega-menu-next{font-size:var(--fz-md, 14px);font-style:normal;line-height:18px;letter-spacing:0.16px}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next .xv-link_standalone.sc-xv-mega-menu-next,.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-title.sc-xv-mega-menu-next,.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-desc.sc-xv-mega-menu-next{font-family:var(--ff-work-sans), sans-serif}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-title.sc-xv-mega-menu-next{color:var(--text-primary, #333);font-weight:600}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-desc.sc-xv-mega-menu-next{color:var(--text-secondary, #515151);font-weight:400;padding-top:var(--spacing-03);display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next{flex:0}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next:not(:last-child){border-bottom:1px solid var(--border-subtle-01);padding-bottom:var(--spacing-04)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category-label.sc-xv-mega-menu-next{margin:0;font-size:var(--fz-md, 14px);color:var(--text-secondary)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category-routes.sc-xv-mega-menu-next{display:flex;flex-direction:column;row-gap:var(--spacing-05)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next{display:inline-flex;align-items:center;column-gap:var(--spacing-03);position:relative;font-size:var(--fz-lg, 16px)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next{color:inherit;text-decoration:none;font-family:var(--ff-work-sans), sans-serif;line-height:133.333%;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next:visited{color:inherit}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next:hover{color:var(--link-primary);cursor:pointer}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next:focus{outline:1px solid var(--focus);outline-offset:1px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next{white-space:nowrap}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-tag.sc-xv-mega-menu-next{font-size:9px}`;
|
|
6
|
+
const xvMegaMenuNextCss = () => `.sc-xv-mega-menu-next-h{--menu-group-width:244px;--menu-group-height:454px;--link-visited:var(--link-primary)}.xv-menu.sc-xv-mega-menu-next{background:inherit;position:relative;font-family:var(--ff-work-sans), sans-serif}@media (min-width: 992px){.xv-menu.sc-xv-mega-menu-next{min-height:55px}}.xv-menu-loader.sc-xv-mega-menu-next{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;background-color:rgba(255, 255, 255, 0.7);display:flex;align-items:center;justify-content:center}@media (max-width: 991px){.xv-menu-loader.sc-xv-mega-menu-next:not(.open){display:none}}@media (max-width: 991px){.xv-menu.open.sc-xv-mega-menu-next{padding-bottom:env(safe-area-inset-bottom);max-height:calc(100vh - 120px);overflow:auto;overscroll-behavior:contain}}.xv-menu_mobile.sc-xv-mega-menu-next{position:relative;display:none}@media (max-width: 991px){.xv-menu_mobile.sc-xv-mega-menu-next{display:inline-flex}}.xv-menu.sc-xv-mega-menu-next ul.sc-xv-mega-menu-next{margin:0;padding:0;list-style:none}.xv-menu.sc-xv-mega-menu-next .link-chevron.sc-xv-mega-menu-next{display:inline-block;margin-inline-start:var(--spacing-01)}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next{display:block;color:var(--link-primary);font-family:var(--ff-body), sans-serif;font-size:14px;line-height:20px;font-weight:400;letter-spacing:0.16px;text-decoration:none;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:visited{color:var(--link-primary)}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:hover,.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:focus,.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-decoration-color:var(--link-primary)}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:hover{color:var(--link-primary-hover);cursor:pointer}.xv-menu.sc-xv-mega-menu-next .action-link.sc-xv-mega-menu-next:focus{outline:1px solid var(--focus);outline-offset:1px}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next{overflow-x:auto;display:flex;justify-content:flex-start;column-gap:var(--spacing-08)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next{flex-direction:column;display:none}}.xv-menu.sc-xv-mega-menu-next .menu--right.sc-xv-mega-menu-next{margin-left:auto;display:flex;align-items:center;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu--right.sc-xv-mega-menu-next{margin-left:unset;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu-next .menu--backdrop.sc-xv-mega-menu-next{z-index:-1;background-color:rgba(0, 0, 0, 0.3);position:fixed;top:0;left:0;width:100%;height:100%}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.open.sc-xv-mega-menu-next{display:flex}}.xv-menu.sc-xv-mega-menu-next .menu-item.sc-xv-mega-menu-next:hover .menu-item-label.sc-xv-mega-menu-next{border-bottom-color:var(--interactive-02)}.xv-menu.sc-xv-mega-menu-next .menu-item.active.sc-xv-mega-menu-next .menu-item-groups.sc-xv-mega-menu-next{z-index:990;display:flex}.xv-menu.sc-xv-mega-menu-next .menu-item.active.sc-xv-mega-menu-next .menu-item-label.sc-xv-mega-menu-next{border-bottom-color:var(--interactive-02)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu-item.active.sc-xv-mega-menu-next{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu-next .menu-item-label.sc-xv-mega-menu-next{display:block;margin:0;padding-block:var(--spacing-05, 16px);color:inherit;text-decoration:none;font-size:16px;line-height:22px;font-family:var(--ff-body), sans-serif;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:250ms ease-in-out border-bottom-color;user-select:none;white-space:nowrap}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu-item-label.sc-xv-mega-menu-next{border-bottom:1px solid #E1E4ED}}.xv-menu.sc-xv-mega-menu-next .menu-item-groups.sc-xv-mega-menu-next{z-index:-1;position:absolute;left:0;top:100%;width:100%;background-color:var(--background, #fff);display:none;flex-direction:column;border:1px solid var(--border-subtle-01);row-gap:var(--spacing-05);padding-block:var(--spacing-08) var(--spacing-06);min-height:var(--menu-group-height);border-radius:0 0 8px 8px;overflow:hidden;color:var(--interactive-01, #273435)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu-item-groups.sc-xv-mega-menu-next{min-height:unset;padding-block:unset;position:relative;row-gap:unset;border:none}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.sc-xv-mega-menu-next{display:flex;align-items:flex-start}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.sc-xv-mega-menu-next{flex-direction:column;align-items:stretch}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label.sc-xv-mega-menu-next{user-select:none;min-width:var(--menu-group-width);max-width:var(--menu-group-width);color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:16px;font-style:normal;font-weight:400;line-height:22px;display:flex;column-gap:var(--spacing-04);text-align:right;justify-content:flex-end;cursor:pointer}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label-text.sc-xv-mega-menu-next{text-overflow:ellipsis;overflow:hidden}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label-icon.sc-xv-mega-menu-next{width:8px;height:8px;border-bottom:2px solid var(--link-primary, currentColor);border-right:2px solid var(--link-primary, currentColor);transform:rotate(-45deg);transform-origin:bottom;align-self:center}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-label.sc-xv-mega-menu-next{max-width:unset;min-width:unset;align-items:stretch;justify-content:flex-start;padding-block:var(--spacing-05)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container.sc-xv-mega-menu-next{flex:1;display:none}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container-absolute.sc-xv-mega-menu-next{position:absolute;top:0;right:0;width:calc(100% - (var(--menu-group-width) + var(--spacing-06) + var(--spacing-09) + var(--spacing-05)));min-height:calc(100% - (var(--spacing-08) + var(--spacing-06)));padding:var(--spacing-08) var(--spacing-06) var(--spacing-06) var(--spacing-09);display:flex;background-color:var(--layer-01, #F7F7F7)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container-absolute.sc-xv-mega-menu-next{position:unset;flex-direction:column;width:100%;flex:1;padding:var(--spacing-06) 0;background-color:var(--background)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-container-absolute.noLabel.sc-xv-mega-menu-next{left:0;width:calc(100% - (var(--spacing-06) + var(--spacing-09)))}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.active.sc-xv-mega-menu-next .group-label.sc-xv-mega-menu-next{font-weight:600}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.active.sc-xv-mega-menu-next .group-label-icon.sc-xv-mega-menu-next{transform-origin:center;transform:rotate(45deg)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group.active.sc-xv-mega-menu-next .group-container.sc-xv-mega-menu-next{display:flex}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus.sc-xv-mega-menu-next{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-06)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.sc-xv-mega-menu-next{display:flex;row-gap:var(--spacing-07);column-gap:var(--spacing-05);flex:1}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.sc-xv-mega-menu-next{flex-direction:column;gap:var(--spacing-07)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.inline.sc-xv-mega-menu-next{flex-direction:column;flex-wrap:wrap;max-height:365px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.inline.sc-xv-mega-menu-next{max-height:unset}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-categories.inline.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next{flex:none}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-actions.sc-xv-mega-menu-next{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-menus-actions.sc-xv-mega-menu-next{flex-direction:column;justify-content:stretch;align-items:stretch;text-align:center}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next{box-sizing:content-box;max-width:228px;min-width:200px;padding-left:var(--spacing-06);border-left:1px solid var(--border-subtle-01)}@media (min-width: 992px) and (max-width: 1199px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next{display:none}}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next{margin-block-start:var(--spacing-06);border-left:none;padding-left:0;max-width:unset;min-width:unset}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next .xv-card.sc-xv-mega-menu-next{box-shadow:none;background-color:var(--background, #fff)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card.sc-xv-mega-menu-next .xv-card.sc-xv-mega-menu-next{width:unset}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-title.sc-xv-mega-menu-next,.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-desc.sc-xv-mega-menu-next{margin:0;font-family:var(--ff-body), sans-serif;font-size:16px;font-style:normal;line-height:22px;letter-spacing:0}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-title.sc-xv-mega-menu-next{display:block;color:var(--text-primary, #333);font-weight:600}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .group-card-desc.sc-xv-mega-menu-next{color:var(--text-secondary, #515151);font-weight:400;padding-top:var(--spacing-03);margin-bottom:var(--spacing-03);display:-webkit-box;-webkit-line-clamp:11;-webkit-box-orient:vertical;overflow:hidden}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next{flex:1;display:flex;flex-direction:column;row-gap:var(--spacing-05)}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next{flex:0}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category.sc-xv-mega-menu-next:not(:last-child){border-bottom:1px solid var(--border-subtle-01);padding-bottom:var(--spacing-04)}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category-label.sc-xv-mega-menu-next{display:block;margin:0;font-family:var(--ff-body), sans-serif;font-size:14px;line-height:18px;font-weight:400;letter-spacing:0.16px;color:var(--text-secondary)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .category-routes.sc-xv-mega-menu-next{display:flex;flex-direction:column;row-gap:var(--spacing-05)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next{display:inline-flex;align-items:center;column-gap:var(--spacing-03);position:relative;font-size:var(--fz-lg, 16px)}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next{color:inherit;text-decoration:none;font-family:var(--ff-body), sans-serif;font-size:16px;line-height:22px;font-weight:400;transition:color 200ms ease-in-out}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next:visited{color:inherit}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next:hover{color:var(--link-primary);cursor:pointer}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-link.sc-xv-mega-menu-next:focus{outline:1px solid var(--focus);outline-offset:1px}@media (max-width: 991px){.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next{white-space:nowrap}}.xv-menu.sc-xv-mega-menu-next .menu.sc-xv-mega-menu-next .route.sc-xv-mega-menu-next .route-tag.sc-xv-mega-menu-next{font-size:9px}`;
|
|
7
7
|
|
|
8
8
|
const XvMegaMenuNext = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -92,15 +92,15 @@ const XvMegaMenuNext = class {
|
|
|
92
92
|
render() {
|
|
93
93
|
return (index.h(index.Host, { key: '2aedf5fcd9dfb34d64b7febf92585088548a68e9' }, index.h("nav", { key: 'e3e0a1e52a24094470100f1da66a03f02a8b46b7', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (index.h("div", { key: '5ae91639ffd7d2ec8f1ec88ac5730b40dca0fcb0', class: { 'xv-menu-loader': true, open: this.open } }, index.h("xv-loader-v2", { key: 'dc99655021a279ea4fdc09f0989e61404e3c7af3' }))), index.h("ul", { key: 'c246f2b56c05e4115a3b0d5865468d883823c27a', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
94
94
|
var _a, _b;
|
|
95
|
-
return (index.h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (index.h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (index.h(index.Fragment, null, index.h("
|
|
95
|
+
return (index.h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (index.h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (index.h(index.Fragment, null, index.h("span", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), index.h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
96
96
|
var _a;
|
|
97
97
|
return (index.h("li", { class: { group: true, active: ((_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.id) === group.id } }, (group.label && menuItem.groups.length > 1) && (index.h("div", { class: "group-label", onClick: () => this.setActiveGroup(group) }, index.h("span", { class: "group-label-text" }, group.label), index.h("span", { class: "group-label-icon" }))), index.h("div", { class: "group-container" }, index.h("div", { class: {
|
|
98
98
|
'group-container-absolute': true,
|
|
99
99
|
noLabel: !(group.label && menuItem.groups.length > 1),
|
|
100
|
-
} }, index.h("div", { class: "group-menus" }, index.h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (index.h("li", { class: "category" }, index.h("
|
|
101
|
-
index.h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (index.h("div", { class: "group-card" }, index.h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, index.h("
|
|
100
|
+
} }, index.h("div", { class: "group-menus" }, index.h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (index.h("li", { class: "category" }, index.h("span", { class: "category-label" }, category.label), index.h("ul", { class: "category-routes" }, category.routes.map((route) => (index.h("li", { class: "route" }, index.h("a", { class: "route-link", href: route.route || '#' }, route.label), route.tag && (index.h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), index.h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (index.h("li", { class: "action" }, action.type === 'link' && (index.h("a", { class: "action-link", href: action === null || action === void 0 ? void 0 : action.url }, action.label, index.h("span", { class: "link-chevron" }, "\u2192"))), action.type === 'button' &&
|
|
101
|
+
index.h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (index.h("div", { class: "group-card" }, index.h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, index.h("span", { slot: "header", class: "group-card-title" }, group.card.title), index.h("span", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (index.h("a", { slot: "footer", class: "action-link", href: group.card.linkUrl || '#' }, group.card.linkLabel, index.h("span", { class: "link-chevron" }, "\u2192"))))))))));
|
|
102
102
|
}))))));
|
|
103
|
-
}), index.h("li", { key: '
|
|
103
|
+
}), index.h("li", { key: 'b44d97459b5709f5a7a573fb0f8fa86b94a996f0', class: "menu--right" }, index.h("slot", { key: 'b94eca9d1f1e0351d14676204ee6106cdb506719', name: "menu-right" })), this.open && (index.h("li", { key: 'a25e251d83d4c9b86aa7625fe6aa818c09a750b4', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
104
104
|
}
|
|
105
105
|
get el() { return index.getElement(this); }
|
|
106
106
|
static get watchers() { return {
|
|
@@ -64,6 +64,11 @@
|
|
|
64
64
|
.xv-menu .action-link {
|
|
65
65
|
display: block;
|
|
66
66
|
color: var(--link-primary);
|
|
67
|
+
font-family: var(--ff-body), sans-serif;
|
|
68
|
+
font-size: 14px;
|
|
69
|
+
line-height: 20px;
|
|
70
|
+
font-weight: 400;
|
|
71
|
+
letter-spacing: 0.16px;
|
|
67
72
|
text-decoration: none;
|
|
68
73
|
transition: color 200ms ease-in-out;
|
|
69
74
|
}
|
|
@@ -147,9 +152,9 @@
|
|
|
147
152
|
color: inherit;
|
|
148
153
|
text-decoration: none;
|
|
149
154
|
font-size: 16px;
|
|
150
|
-
line-height:
|
|
155
|
+
line-height: 22px;
|
|
151
156
|
font-family: var(--ff-body), sans-serif;
|
|
152
|
-
font-weight:
|
|
157
|
+
font-weight: 500;
|
|
153
158
|
cursor: pointer;
|
|
154
159
|
border-bottom: 2px solid transparent;
|
|
155
160
|
transition: 250ms ease-in-out border-bottom-color;
|
|
@@ -202,10 +207,11 @@
|
|
|
202
207
|
min-width: var(--menu-group-width);
|
|
203
208
|
max-width: var(--menu-group-width);
|
|
204
209
|
color: var(--text-primary, #333);
|
|
210
|
+
font-family: var(--ff-body), sans-serif;
|
|
205
211
|
font-size: 16px;
|
|
206
212
|
font-style: normal;
|
|
207
213
|
font-weight: 400;
|
|
208
|
-
line-height:
|
|
214
|
+
line-height: 22px;
|
|
209
215
|
display: flex;
|
|
210
216
|
column-gap: var(--spacing-04);
|
|
211
217
|
text-align: right;
|
|
@@ -219,8 +225,8 @@
|
|
|
219
225
|
.xv-menu .menu .group-label-icon {
|
|
220
226
|
width: 8px;
|
|
221
227
|
height: 8px;
|
|
222
|
-
border-bottom: 2px solid currentColor;
|
|
223
|
-
border-right: 2px solid currentColor;
|
|
228
|
+
border-bottom: 2px solid var(--link-primary, currentColor);
|
|
229
|
+
border-right: 2px solid var(--link-primary, currentColor);
|
|
224
230
|
transform: rotate(-45deg);
|
|
225
231
|
transform-origin: bottom;
|
|
226
232
|
align-self: center;
|
|
@@ -350,15 +356,15 @@
|
|
|
350
356
|
}
|
|
351
357
|
}
|
|
352
358
|
.xv-menu .menu .group-card-title, .xv-menu .menu .group-card-desc {
|
|
353
|
-
|
|
359
|
+
margin: 0;
|
|
360
|
+
font-family: var(--ff-body), sans-serif;
|
|
361
|
+
font-size: 16px;
|
|
354
362
|
font-style: normal;
|
|
355
|
-
line-height:
|
|
356
|
-
letter-spacing: 0
|
|
357
|
-
}
|
|
358
|
-
.xv-menu .menu .group-card .xv-link_standalone, .xv-menu .menu .group-card-title, .xv-menu .menu .group-card-desc {
|
|
359
|
-
font-family: var(--ff-work-sans), sans-serif;
|
|
363
|
+
line-height: 22px;
|
|
364
|
+
letter-spacing: 0;
|
|
360
365
|
}
|
|
361
366
|
.xv-menu .menu .group-card-title {
|
|
367
|
+
display: block;
|
|
362
368
|
color: var(--text-primary, #333);
|
|
363
369
|
font-weight: 600;
|
|
364
370
|
}
|
|
@@ -366,6 +372,7 @@
|
|
|
366
372
|
color: var(--text-secondary, #515151);
|
|
367
373
|
font-weight: 400;
|
|
368
374
|
padding-top: var(--spacing-03);
|
|
375
|
+
margin-bottom: var(--spacing-03);
|
|
369
376
|
display: -webkit-box;
|
|
370
377
|
-webkit-line-clamp: 11;
|
|
371
378
|
-webkit-box-orient: vertical;
|
|
@@ -387,8 +394,13 @@
|
|
|
387
394
|
}
|
|
388
395
|
}
|
|
389
396
|
.xv-menu .menu .category-label {
|
|
397
|
+
display: block;
|
|
390
398
|
margin: 0;
|
|
391
|
-
font-
|
|
399
|
+
font-family: var(--ff-body), sans-serif;
|
|
400
|
+
font-size: 14px;
|
|
401
|
+
line-height: 18px;
|
|
402
|
+
font-weight: 400;
|
|
403
|
+
letter-spacing: 0.16px;
|
|
392
404
|
color: var(--text-secondary);
|
|
393
405
|
}
|
|
394
406
|
.xv-menu .menu .category-routes {
|
|
@@ -406,8 +418,10 @@
|
|
|
406
418
|
.xv-menu .menu .route .route-link {
|
|
407
419
|
color: inherit;
|
|
408
420
|
text-decoration: none;
|
|
409
|
-
font-family: var(--ff-
|
|
410
|
-
|
|
421
|
+
font-family: var(--ff-body), sans-serif;
|
|
422
|
+
font-size: 16px;
|
|
423
|
+
line-height: 22px;
|
|
424
|
+
font-weight: 400;
|
|
411
425
|
transition: color 200ms ease-in-out;
|
|
412
426
|
}
|
|
413
427
|
.xv-menu .menu .route .route-link:visited {
|
|
@@ -60,15 +60,15 @@ export class XvMegaMenu {
|
|
|
60
60
|
render() {
|
|
61
61
|
return (h(Host, { key: '5f2979691c296f255a4af567b13877b58042ebb1' }, h("nav", { key: '5488cc3b13d3384e349034a7faa519636b450690', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (h("div", { key: '225a780b15d381eb3dcd01a929165b8d6a3d34c2', class: { 'xv-menu-loader': true, open: this.open } }, h("xv-loader-v2", { key: 'b66f449bf7154ce77515df080872a75d661d96f1' }))), h("ul", { key: 'c7e7b2e44ca6966a0ff5aa4fed408064660eff38', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
62
62
|
var _a, _b;
|
|
63
|
-
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (h(Fragment, null, h("
|
|
63
|
+
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (h(Fragment, null, h("span", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
64
64
|
var _a;
|
|
65
65
|
return (h("li", { class: { group: true, active: ((_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.id) === group.id } }, (group.label && menuItem.groups.length > 1) && (h("div", { class: "group-label", onClick: () => this.setActiveGroup(group) }, h("span", { class: "group-label-text" }, group.label), h("span", { class: "group-label-icon" }))), h("div", { class: "group-container" }, h("div", { class: {
|
|
66
66
|
'group-container-absolute': true,
|
|
67
67
|
noLabel: !(group.label && menuItem.groups.length > 1),
|
|
68
|
-
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("
|
|
69
|
-
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("
|
|
68
|
+
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("span", { class: "category-label" }, category.label), h("ul", { class: "category-routes" }, category.routes.map((route) => (h("li", { class: "route" }, h("a", { class: "route-link", href: route.route || '#' }, route.label), route.tag && (h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (h("li", { class: "action" }, action.type === 'link' && (h("a", { class: "action-link", href: action === null || action === void 0 ? void 0 : action.url }, action.label, h("span", { class: "link-chevron" }, "\u2192"))), action.type === 'button' &&
|
|
69
|
+
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("span", { slot: "header", class: "group-card-title" }, group.card.title), h("span", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (h("a", { slot: "footer", class: "action-link", href: group.card.linkUrl || '#' }, group.card.linkLabel, h("span", { class: "link-chevron" }, "\u2192"))))))))));
|
|
70
70
|
}))))));
|
|
71
|
-
}), h("li", { key: '
|
|
71
|
+
}), h("li", { key: '9889408ddd0da2f33c4c9d6458af04ee4ae3e17d', class: "menu--right" }, h("slot", { key: 'af22cbe42fed3aa0474982c64360d9ea4413db38', name: "menu-right" })), this.open && (h("li", { key: '19db99cbf45a66836266e2c334220277304486bb', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
72
72
|
}
|
|
73
73
|
static get is() { return "xv-mega-menu"; }
|
|
74
74
|
static get encapsulation() { return "scoped"; }
|
|
@@ -60,6 +60,11 @@
|
|
|
60
60
|
.xv-menu .action-link {
|
|
61
61
|
display: block;
|
|
62
62
|
color: var(--link-primary);
|
|
63
|
+
font-family: var(--ff-body), sans-serif;
|
|
64
|
+
font-size: 14px;
|
|
65
|
+
line-height: 20px;
|
|
66
|
+
font-weight: 400;
|
|
67
|
+
letter-spacing: 0.16px;
|
|
63
68
|
text-decoration: none;
|
|
64
69
|
transition: color 200ms ease-in-out;
|
|
65
70
|
}
|
|
@@ -143,9 +148,9 @@
|
|
|
143
148
|
color: inherit;
|
|
144
149
|
text-decoration: none;
|
|
145
150
|
font-size: 16px;
|
|
146
|
-
line-height:
|
|
151
|
+
line-height: 22px;
|
|
147
152
|
font-family: var(--ff-body), sans-serif;
|
|
148
|
-
font-weight:
|
|
153
|
+
font-weight: 500;
|
|
149
154
|
cursor: pointer;
|
|
150
155
|
border-bottom: 2px solid transparent;
|
|
151
156
|
transition: 250ms ease-in-out border-bottom-color;
|
|
@@ -198,10 +203,11 @@
|
|
|
198
203
|
min-width: var(--menu-group-width);
|
|
199
204
|
max-width: var(--menu-group-width);
|
|
200
205
|
color: var(--text-primary, #333);
|
|
206
|
+
font-family: var(--ff-body), sans-serif;
|
|
201
207
|
font-size: 16px;
|
|
202
208
|
font-style: normal;
|
|
203
209
|
font-weight: 400;
|
|
204
|
-
line-height:
|
|
210
|
+
line-height: 22px;
|
|
205
211
|
display: flex;
|
|
206
212
|
column-gap: var(--spacing-04);
|
|
207
213
|
text-align: right;
|
|
@@ -215,8 +221,8 @@
|
|
|
215
221
|
.xv-menu .menu .group-label-icon {
|
|
216
222
|
width: 8px;
|
|
217
223
|
height: 8px;
|
|
218
|
-
border-bottom: 2px solid currentColor;
|
|
219
|
-
border-right: 2px solid currentColor;
|
|
224
|
+
border-bottom: 2px solid var(--link-primary, currentColor);
|
|
225
|
+
border-right: 2px solid var(--link-primary, currentColor);
|
|
220
226
|
transform: rotate(-45deg);
|
|
221
227
|
transform-origin: bottom;
|
|
222
228
|
align-self: center;
|
|
@@ -346,15 +352,15 @@
|
|
|
346
352
|
}
|
|
347
353
|
}
|
|
348
354
|
.xv-menu .menu .group-card-title, .xv-menu .menu .group-card-desc {
|
|
349
|
-
|
|
355
|
+
margin: 0;
|
|
356
|
+
font-family: var(--ff-body), sans-serif;
|
|
357
|
+
font-size: 16px;
|
|
350
358
|
font-style: normal;
|
|
351
|
-
line-height:
|
|
352
|
-
letter-spacing: 0
|
|
353
|
-
}
|
|
354
|
-
.xv-menu .menu .group-card .xv-link_standalone, .xv-menu .menu .group-card-title, .xv-menu .menu .group-card-desc {
|
|
355
|
-
font-family: var(--ff-work-sans), sans-serif;
|
|
359
|
+
line-height: 22px;
|
|
360
|
+
letter-spacing: 0;
|
|
356
361
|
}
|
|
357
362
|
.xv-menu .menu .group-card-title {
|
|
363
|
+
display: block;
|
|
358
364
|
color: var(--text-primary, #333);
|
|
359
365
|
font-weight: 600;
|
|
360
366
|
}
|
|
@@ -362,6 +368,7 @@
|
|
|
362
368
|
color: var(--text-secondary, #515151);
|
|
363
369
|
font-weight: 400;
|
|
364
370
|
padding-top: var(--spacing-03);
|
|
371
|
+
margin-bottom: var(--spacing-03);
|
|
365
372
|
display: -webkit-box;
|
|
366
373
|
-webkit-line-clamp: 11;
|
|
367
374
|
-webkit-box-orient: vertical;
|
|
@@ -383,8 +390,13 @@
|
|
|
383
390
|
}
|
|
384
391
|
}
|
|
385
392
|
.xv-menu .menu .category-label {
|
|
393
|
+
display: block;
|
|
386
394
|
margin: 0;
|
|
387
|
-
font-
|
|
395
|
+
font-family: var(--ff-body), sans-serif;
|
|
396
|
+
font-size: 14px;
|
|
397
|
+
line-height: 18px;
|
|
398
|
+
font-weight: 400;
|
|
399
|
+
letter-spacing: 0.16px;
|
|
388
400
|
color: var(--text-secondary);
|
|
389
401
|
}
|
|
390
402
|
.xv-menu .menu .category-routes {
|
|
@@ -402,8 +414,10 @@
|
|
|
402
414
|
.xv-menu .menu .route .route-link {
|
|
403
415
|
color: inherit;
|
|
404
416
|
text-decoration: none;
|
|
405
|
-
font-family: var(--ff-
|
|
406
|
-
|
|
417
|
+
font-family: var(--ff-body), sans-serif;
|
|
418
|
+
font-size: 16px;
|
|
419
|
+
line-height: 22px;
|
|
420
|
+
font-weight: 400;
|
|
407
421
|
transition: color 200ms ease-in-out;
|
|
408
422
|
}
|
|
409
423
|
.xv-menu .menu .route .route-link:visited {
|
|
@@ -110,15 +110,15 @@ export class XvMegaMenuNext {
|
|
|
110
110
|
render() {
|
|
111
111
|
return (h(Host, { key: '2aedf5fcd9dfb34d64b7febf92585088548a68e9' }, h("nav", { key: 'e3e0a1e52a24094470100f1da66a03f02a8b46b7', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (h("div", { key: '5ae91639ffd7d2ec8f1ec88ac5730b40dca0fcb0', class: { 'xv-menu-loader': true, open: this.open } }, h("xv-loader-v2", { key: 'dc99655021a279ea4fdc09f0989e61404e3c7af3' }))), h("ul", { key: 'c246f2b56c05e4115a3b0d5865468d883823c27a', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
112
112
|
var _a, _b;
|
|
113
|
-
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (h(Fragment, null, h("
|
|
113
|
+
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("a", { class: "menu-item-label", href: menuItem.route.route }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label)) : (h(Fragment, null, h("span", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
114
114
|
var _a;
|
|
115
115
|
return (h("li", { class: { group: true, active: ((_a = this.activeGroup) === null || _a === void 0 ? void 0 : _a.id) === group.id } }, (group.label && menuItem.groups.length > 1) && (h("div", { class: "group-label", onClick: () => this.setActiveGroup(group) }, h("span", { class: "group-label-text" }, group.label), h("span", { class: "group-label-icon" }))), h("div", { class: "group-container" }, h("div", { class: {
|
|
116
116
|
'group-container-absolute': true,
|
|
117
117
|
noLabel: !(group.label && menuItem.groups.length > 1),
|
|
118
|
-
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("
|
|
119
|
-
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("
|
|
118
|
+
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("span", { class: "category-label" }, category.label), h("ul", { class: "category-routes" }, category.routes.map((route) => (h("li", { class: "route" }, h("a", { class: "route-link", href: route.route || '#' }, route.label), route.tag && (h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (h("li", { class: "action" }, action.type === 'link' && (h("a", { class: "action-link", href: action === null || action === void 0 ? void 0 : action.url }, action.label, h("span", { class: "link-chevron" }, "\u2192"))), action.type === 'button' &&
|
|
119
|
+
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("span", { slot: "header", class: "group-card-title" }, group.card.title), h("span", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (h("a", { slot: "footer", class: "action-link", href: group.card.linkUrl || '#' }, group.card.linkLabel, h("span", { class: "link-chevron" }, "\u2192"))))))))));
|
|
120
120
|
}))))));
|
|
121
|
-
}), h("li", { key: '
|
|
121
|
+
}), h("li", { key: 'b44d97459b5709f5a7a573fb0f8fa86b94a996f0', class: "menu--right" }, h("slot", { key: 'b94eca9d1f1e0351d14676204ee6106cdb506719', name: "menu-right" })), this.open && (h("li", { key: 'a25e251d83d4c9b86aa7625fe6aa818c09a750b4', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
122
122
|
}
|
|
123
123
|
static get is() { return "xv-mega-menu-next"; }
|
|
124
124
|
static get encapsulation() { return "scoped"; }
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
|
+
let tileUid = 0;
|
|
2
3
|
export class XvTile {
|
|
3
4
|
constructor() {
|
|
4
5
|
this.variant = 'base';
|
|
5
6
|
this.checked = false;
|
|
6
7
|
this.readonly = false;
|
|
8
|
+
this.inputId = `xv-tile-${tileUid++}`;
|
|
7
9
|
this.handleChange = (e) => {
|
|
8
10
|
const input = e.target;
|
|
9
11
|
this.checked = !!input.checked;
|
|
@@ -29,7 +31,7 @@ export class XvTile {
|
|
|
29
31
|
this.checked = !this.checked;
|
|
30
32
|
}
|
|
31
33
|
render() {
|
|
32
|
-
return (h(Host, { key: '
|
|
34
|
+
return (h(Host, { key: 'e9093c3a902d972bdeb4c0696daf2f9e57cc1b09', class: "xv-tile--host" }, h("label", { key: '1ac7a225720930bee3cc9c58228f04c65cf6df41', htmlFor: this.variant === 'selectable' ? this.inputId : undefined, class: {
|
|
33
35
|
[this.el.className]: !!this.el.className,
|
|
34
36
|
'xv-tile': true,
|
|
35
37
|
[`xv-tile--variant-${this.variant}`]: !!this.variant,
|
|
@@ -37,7 +39,7 @@ export class XvTile {
|
|
|
37
39
|
'xv-tile--disabled': !!this.disabled,
|
|
38
40
|
'selected': !!this.checked,
|
|
39
41
|
'xv-tile--error': !!this.error,
|
|
40
|
-
} }, h("div", { key: '
|
|
42
|
+
} }, h("div", { key: '46cdcfaea2dc4064c1af27591c638a08bd349003', class: "xv-tile_content" }, this.label && h("p", { key: 'eb8bbc489d077061f76d0e86c3623f4d70c0fc71', class: "xv-tile_content__title" }, this.label), h("slot", { key: '54fd4d5852efc46bbb4dc101e7484416e09f86c3' })), this.variant === 'selectable' && (h("div", { key: '49922cc57a1d57cb42d7f7712019630ce773e68c', class: "xv-tile_control" }, this.multiple ? (h("input", { type: "checkbox", id: this.inputId, disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })) : (h("input", { type: "radio", id: this.inputId, disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })))), (this.variant === 'clickable' || this.variant === 'expandable') && (h("div", { key: 'c4c10a986bbd4459719975c250005af5c35c0c79', class: "xv-tile_footer" }, h("button", { key: '52bfefd1ac2dad91a0defc37b2b671d87a704092', class: { 'xv-tile_footer__icon': true, [`icon--${this.variant}`]: true, open: this.checked } }))), h("div", { key: '61dab20478eea4fa550ab1f3f2145071eff15039', class: { 'xv-tile_expandable': true, open: this.checked } }, h("slot", { key: '71dfca2fa1961457aba36c2cd454e115ad08df8b', name: "expandable" })))));
|
|
41
43
|
}
|
|
42
44
|
static get is() { return "xv-tile"; }
|
|
43
45
|
static get originalStyleUrls() {
|