@swisspost/design-system-components 9.0.0-next.24 → 9.0.0-next.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +21 -21
- package/dist/cjs/{package-be30a2ae.js → package-8dee32a7.js} +1 -1
- package/dist/cjs/{post-accordion-980e3707.js → post-accordion-0b2214eb.js} +1 -1
- package/dist/cjs/{post-accordion-item-34526ddd.js → post-accordion-item-de23d2a4.js} +1 -1
- package/dist/cjs/post-accordion-item.cjs.entry.js +2 -2
- package/dist/cjs/post-accordion.cjs.entry.js +2 -2
- package/dist/cjs/{post-avatar-ed964ac4.js → post-avatar-ae0f8117.js} +1 -1
- package/dist/cjs/post-avatar.cjs.entry.js +2 -2
- package/dist/cjs/{post-back-to-top-12ee9182.js → post-back-to-top-821fa8c6.js} +4 -4
- package/dist/cjs/post-back-to-top.cjs.entry.js +3 -3
- package/dist/cjs/{post-banner-13755850.js → post-banner-f703f839.js} +1 -1
- package/dist/cjs/post-banner.cjs.entry.js +2 -2
- package/dist/cjs/{post-breadcrumb-d6d9f5a4.js → post-breadcrumb-db70dbb0.js} +1 -1
- package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +2 -2
- package/dist/cjs/post-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/{post-card-control-4a6fbf19.js → post-card-control-0a234cd7.js} +1 -1
- package/dist/cjs/post-card-control.cjs.entry.js +2 -2
- package/dist/cjs/post-closebutton_15.cjs.entry.js +3 -3
- package/dist/cjs/{post-collapsible-trigger-5bdd97f1.js → post-collapsible-trigger-cde50d59.js} +1 -1
- package/dist/cjs/post-collapsible_2.cjs.entry.js +2 -2
- package/dist/cjs/{post-footer-f2217a34.js → post-footer-da4d4cf7.js} +1 -1
- package/dist/cjs/post-footer.cjs.entry.js +2 -2
- package/dist/cjs/{post-linkarea-ced4f6ad.js → post-linkarea-e08ff922.js} +1 -1
- package/dist/cjs/post-linkarea.cjs.entry.js +2 -2
- package/dist/cjs/{post-menu-item-4ef32029.js → post-menu-item-6e00329f.js} +1 -1
- package/dist/cjs/{post-popover-1a5b1f4c.js → post-popover-083e3d27.js} +1 -1
- package/dist/cjs/post-popover.cjs.entry.js +2 -2
- package/dist/cjs/{post-rating-9a9ce431.js → post-rating-7aea8f7a.js} +1 -1
- package/dist/cjs/post-rating.cjs.entry.js +2 -2
- package/dist/cjs/{post-tab-header-43c52a57.js → post-tab-header-4ec43572.js} +1 -1
- package/dist/cjs/post-tab-header.cjs.entry.js +2 -2
- package/dist/cjs/{post-tab-panel-16064007.js → post-tab-panel-140f40c4.js} +1 -1
- package/dist/cjs/post-tab-panel.cjs.entry.js +2 -2
- package/dist/cjs/{post-tabs-e4739459.js → post-tabs-0a05ad67.js} +1 -1
- package/dist/cjs/post-tabs.cjs.entry.js +2 -2
- package/dist/cjs/{post-tag-e1ed422b.js → post-tag-64ca2aaa.js} +1 -1
- package/dist/cjs/post-tag.cjs.entry.js +2 -2
- package/dist/cjs/{post-togglebutton-38ec151e.js → post-togglebutton-245f7bb8.js} +83 -58
- package/dist/cjs/{post-tooltip-463eaaf6.js → post-tooltip-0dfe7ecc.js} +1 -1
- package/dist/cjs/post-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/{slide-8ae17ee4.js → slide-cd1f09b3.js} +6 -6
- package/dist/collection/animations/slide.js +6 -6
- package/dist/collection/components/post-back-to-top/post-back-to-top.js +2 -2
- package/dist/collection/components/post-header/post-header.css +1 -1
- package/dist/collection/components/post-header/post-header.js +79 -54
- package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
- package/dist/components/package.js +1 -1
- package/dist/components/post-back-to-top2.js +3 -3
- package/dist/components/post-header2.js +81 -56
- package/dist/components/post-mainnavigation2.js +1 -1
- package/dist/components/slide.js +7 -7
- package/dist/docs.json +1 -1
- package/dist/esm/index.js +21 -21
- package/dist/esm/package-69fdcae3.js +3 -0
- package/dist/esm/{post-accordion-7f239aa6.js → post-accordion-f67ce0ad.js} +1 -1
- package/dist/esm/{post-accordion-item-bac98792.js → post-accordion-item-4f1a4597.js} +1 -1
- package/dist/esm/post-accordion-item.entry.js +2 -2
- package/dist/esm/post-accordion.entry.js +2 -2
- package/dist/esm/{post-avatar-f74f6de0.js → post-avatar-52a2ba46.js} +1 -1
- package/dist/esm/post-avatar.entry.js +2 -2
- package/dist/esm/{post-back-to-top-6fdad155.js → post-back-to-top-9d72c88f.js} +4 -4
- package/dist/esm/post-back-to-top.entry.js +3 -3
- package/dist/esm/{post-banner-8448d770.js → post-banner-9487b62d.js} +1 -1
- package/dist/esm/post-banner.entry.js +2 -2
- package/dist/esm/{post-breadcrumb-d35e27a0.js → post-breadcrumb-5096ed4f.js} +1 -1
- package/dist/esm/post-breadcrumb-item_2.entry.js +2 -2
- package/dist/esm/post-breadcrumb.entry.js +2 -2
- package/dist/esm/{post-card-control-9233ca52.js → post-card-control-de358f9d.js} +1 -1
- package/dist/esm/post-card-control.entry.js +2 -2
- package/dist/esm/post-closebutton_15.entry.js +3 -3
- package/dist/esm/{post-collapsible-trigger-f98e1f9a.js → post-collapsible-trigger-4566760b.js} +1 -1
- package/dist/esm/post-collapsible_2.entry.js +2 -2
- package/dist/esm/{post-footer-f4be2a31.js → post-footer-9117392a.js} +1 -1
- package/dist/esm/post-footer.entry.js +2 -2
- package/dist/esm/{post-linkarea-c9d8d2be.js → post-linkarea-9412ebb6.js} +1 -1
- package/dist/esm/post-linkarea.entry.js +2 -2
- package/dist/esm/{post-menu-item-1ea9397a.js → post-menu-item-b475d581.js} +1 -1
- package/dist/esm/{post-popover-aa961cc7.js → post-popover-33f9c2a2.js} +1 -1
- package/dist/esm/post-popover.entry.js +2 -2
- package/dist/esm/{post-rating-17ecd4f4.js → post-rating-215726b3.js} +1 -1
- package/dist/esm/post-rating.entry.js +2 -2
- package/dist/esm/{post-tab-header-6f9449f1.js → post-tab-header-bd6cc764.js} +1 -1
- package/dist/esm/post-tab-header.entry.js +2 -2
- package/dist/esm/{post-tab-panel-fcecd935.js → post-tab-panel-1070163c.js} +1 -1
- package/dist/esm/post-tab-panel.entry.js +2 -2
- package/dist/esm/{post-tabs-008c118d.js → post-tabs-2bb77fdd.js} +1 -1
- package/dist/esm/post-tabs.entry.js +2 -2
- package/dist/esm/{post-tag-1e709fe5.js → post-tag-45a5e46a.js} +1 -1
- package/dist/esm/post-tag.entry.js +2 -2
- package/dist/esm/{post-togglebutton-a932d770.js → post-togglebutton-83debaae.js} +83 -58
- package/dist/esm/{post-tooltip-ad5b722d.js → post-tooltip-c29ac8e8.js} +1 -1
- package/dist/esm/post-tooltip.entry.js +2 -2
- package/dist/esm/{slide-62768431.js → slide-cd2850ee.js} +7 -7
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-07788cb9.entry.js +1 -0
- package/dist/post-components/p-12d9fcd9.entry.js +1 -0
- package/dist/post-components/{p-7daa1a9c.js → p-1698e849.js} +1 -1
- package/dist/post-components/p-189d9cb4.entry.js +1 -0
- package/dist/post-components/{p-edcc075c.js → p-1c55ede8.js} +1 -1
- package/dist/post-components/p-21003c46.entry.js +1 -0
- package/dist/post-components/{p-23c2b420.js → p-24d7d1a9.js} +1 -1
- package/dist/post-components/{p-c1307879.js → p-303eaf1d.js} +1 -1
- package/dist/post-components/p-3aaac027.entry.js +1 -0
- package/dist/post-components/{p-5e4d5df5.js → p-3bbd92a0.js} +1 -1
- package/dist/post-components/{p-1382d4c9.js → p-4bdde06a.js} +1 -1
- package/dist/post-components/{p-78d9d13e.entry.js → p-4f471325.entry.js} +1 -1
- package/dist/post-components/p-54c9cdb3.entry.js +1 -0
- package/dist/post-components/p-61423175.entry.js +1 -0
- package/dist/post-components/p-62de2967.entry.js +1 -0
- package/dist/post-components/{p-53dd7a51.js → p-848f737d.js} +1 -1
- package/dist/post-components/p-876b1909.entry.js +1 -0
- package/dist/post-components/p-8bb67775.entry.js +1 -0
- package/dist/post-components/{p-6545ed83.js → p-984a0615.js} +1 -1
- package/dist/post-components/p-9b052461.js +1 -0
- package/dist/post-components/{p-f0719685.js → p-9e673495.js} +1 -1
- package/dist/post-components/p-a354bd50.entry.js +1 -0
- package/dist/post-components/{p-923793ff.js → p-a37b1832.js} +1 -1
- package/dist/post-components/p-a98123d4.entry.js +1 -0
- package/dist/post-components/{p-12d7344a.entry.js → p-b332e4ba.entry.js} +1 -1
- package/dist/post-components/{p-bd957c85.js → p-b646df4e.js} +1 -1
- package/dist/post-components/{p-cfe29403.js → p-bad8774d.js} +1 -1
- package/dist/post-components/p-bb0c8b7f.js +1 -0
- package/dist/post-components/{p-637b619c.js → p-cdf8245c.js} +1 -1
- package/dist/post-components/p-d20f0d29.entry.js +1 -0
- package/dist/post-components/p-daba2472.js +1 -0
- package/dist/post-components/p-e28d2566.entry.js +1 -0
- package/dist/post-components/{p-f4c60bbb.js → p-e60601e1.js} +1 -1
- package/dist/post-components/p-e6272866.entry.js +1 -0
- package/dist/post-components/p-e66049a5.js +1 -0
- package/dist/post-components/{p-43b10fa7.js → p-e95db4f0.js} +1 -1
- package/dist/post-components/p-eae73564.js +1 -0
- package/dist/post-components/p-ed2b9ebc.entry.js +1 -0
- package/dist/post-components/{p-a0345520.js → p-f6ada564.js} +1 -1
- package/dist/post-components/p-fb548ceb.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-header/post-header.d.ts +10 -7
- package/loaders/package.js +1 -1
- package/loaders/post-back-to-top.js +3 -3
- package/loaders/post-header.js +81 -56
- package/loaders/post-mainnavigation.js +1 -1
- package/loaders/slide.js +7 -7
- package/package.json +3 -3
- package/dist/esm/package-7deeece6.js +0 -3
- package/dist/post-components/p-0e6ce700.entry.js +0 -1
- package/dist/post-components/p-20e07b4f.entry.js +0 -1
- package/dist/post-components/p-3b7f8717.entry.js +0 -1
- package/dist/post-components/p-453aa3c8.js +0 -1
- package/dist/post-components/p-4af6dbed.js +0 -1
- package/dist/post-components/p-6239b8f8.entry.js +0 -1
- package/dist/post-components/p-64ba9026.entry.js +0 -1
- package/dist/post-components/p-6a79800f.entry.js +0 -1
- package/dist/post-components/p-6eaba4b6.entry.js +0 -1
- package/dist/post-components/p-73acda40.entry.js +0 -1
- package/dist/post-components/p-7796d5c5.entry.js +0 -1
- package/dist/post-components/p-87c82919.entry.js +0 -1
- package/dist/post-components/p-8f80c6f8.entry.js +0 -1
- package/dist/post-components/p-9184781c.entry.js +0 -1
- package/dist/post-components/p-96e3823e.entry.js +0 -1
- package/dist/post-components/p-9b4b416c.entry.js +0 -1
- package/dist/post-components/p-a5682a18.entry.js +0 -1
- package/dist/post-components/p-ac46ccd1.entry.js +0 -1
- package/dist/post-components/p-c8bfefed.js +0 -1
- package/dist/post-components/p-d6757696.entry.js +0 -1
- package/dist/post-components/p-e47d9a2b.js +0 -1
- package/dist/post-components/p-fbe84d70.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item post-megadropdown-trigger button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px}post-mainnavigation .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.98px){post-mainnavigation .back-button{font-size:16px}}@media screen and (max-width: 599.98px){post-mainnavigation .back-button{font-size:14px}}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:"";mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media screen and (min-width: 1024px){post-mainnavigation{display:block}post-mainnavigation nav{max-width:100%;background:#fff;max-height:var(--main-navigation-height);user-select:none;transition:margin 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{z-index:4;position:absolute;inset-block-end:0;overflow:hidden}post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;background:#fff;padding:16px;box-shadow:var(--post-device-elevation-500);line-height:100%;height:var(--main-navigation-height)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{background-color:ButtonFace !important}post-mainnavigation .left-scroll-button button:hover,post-mainnavigation .right-scroll-button button:hover{background-color:Highlight !important}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button button post-icon,post-mainnavigation .right-scroll-button button post-icon{font-size:1rem}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button.d-none,post-mainnavigation .right-scroll-button.d-none{display:none}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button{inset-inline-start:0;padding-inline-end:2rem}}@media screen and (min-width: 1024px){post-mainnavigation .right-scroll-button{inset-inline-end:0;padding-inline-start:2rem}}@media screen and (min-width: 1024px){post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--main-navigation-height);gap:4px;font-size:16px;z-index:4}post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:"";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (min-width: 1024px){post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:"";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}post-mainnavigation .back-button .btn{padding-inline:0}
|
|
1
|
+
post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item post-megadropdown-trigger button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px}post-mainnavigation .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.98px){post-mainnavigation .back-button{font-size:16px}}@media screen and (max-width: 599.98px){post-mainnavigation .back-button{font-size:14px}}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:"";mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media screen and (min-width: 1024px){post-mainnavigation{display:block;overflow-x:hidden}post-mainnavigation nav{max-width:100%;background:#fff;max-height:var(--main-navigation-height);user-select:none;transition:margin 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{z-index:4;position:absolute;inset-block-end:0;overflow:hidden}post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;background:#fff;padding:16px;box-shadow:var(--post-device-elevation-500);line-height:100%;height:var(--main-navigation-height)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{background-color:ButtonFace !important}post-mainnavigation .left-scroll-button button:hover,post-mainnavigation .right-scroll-button button:hover{background-color:Highlight !important}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button button post-icon,post-mainnavigation .right-scroll-button button post-icon{font-size:1rem}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button.d-none,post-mainnavigation .right-scroll-button.d-none{display:none}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button{inset-inline-start:0;padding-inline-end:2rem}}@media screen and (min-width: 1024px){post-mainnavigation .right-scroll-button{inset-inline-end:0;padding-inline-start:2rem}}@media screen and (min-width: 1024px){post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--main-navigation-height);gap:4px;font-size:16px;z-index:4}post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:"";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (min-width: 1024px){post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:"";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}post-mainnavigation .back-button .btn{padding-inline:0}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { s as
|
|
2
|
+
import { s as slideDown, a as slideUp } from './slide.js';
|
|
3
3
|
import { v as version } from './package.js';
|
|
4
4
|
import { c as checkType } from './check-type.js';
|
|
5
5
|
import { c as checkNonEmpty } from './check-non-empty.js';
|
|
@@ -27,10 +27,10 @@ const PostBackToTop = /*@__PURE__*/ proxyCustomElement(class PostBackToTop exten
|
|
|
27
27
|
// Watch for changes in belowFold
|
|
28
28
|
watchBelowFold(newValue) {
|
|
29
29
|
if (newValue) {
|
|
30
|
-
|
|
30
|
+
slideDown(this.host, this.translateY);
|
|
31
31
|
}
|
|
32
32
|
else {
|
|
33
|
-
|
|
33
|
+
slideUp(this.host, this.translateY);
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
scrollToTop() {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { v as version } from './package.js';
|
|
3
|
-
import {
|
|
3
|
+
import { a as slideUp, s as slideDown } from './slide.js';
|
|
4
4
|
import { g as getFocusableChildren } from './get-focusable-children.js';
|
|
5
5
|
|
|
6
6
|
/* eslint-disable no-undefined,no-param-reassign,no-shadow */
|
|
@@ -137,7 +137,7 @@ function throttle (delay, callback, options) {
|
|
|
137
137
|
return wrapper;
|
|
138
138
|
}
|
|
139
139
|
|
|
140
|
-
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative}:host(:not(:has([slot=title]))) .local-header{padding-block-start:0}:host(:not(:has([slot=title]))) .local-sub{display:none}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;position:sticky;padding-inline:4px;height:var(--global-header-height)}@media screen and (max-width: 1023.98px){.global-header{z-index:3;inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{z-index:5;padding-inline-end:12px;inset-block-start:calc((var(--global-header-height) - var(--global-header-reduced-height))*-1)}}.global-sub{display:flex;align-items:center;gap:24px}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--global-header-height);width:var(--global-header-height);min-height:var(--global-header-reduced-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{height:calc(var(--global-header-height) - var(--header-scroll-top))}}::slotted(ul){margin-block:0 !important;list-style:none;display:flex;padding-left:0;gap:1rem;flex-shrink:0 !important}.local-header{display:flex;position:sticky;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;min-height:var(--local-header-min-height);background:#fff;transition:box-shadow .2s ease-in-out}.local-header::after{content:\"\";position:absolute;width:100%;height:1px;background-color:#e1e0dc;bottom:-1px;z-index:1}@media screen and (min-width: 1024px){.local-header{z-index:3;inset-block-start:calc(-1*(var(--local-header-height) - var(--main-navigation-height)) + var(--global-header-reduced-height));padding-block-start:18px;box-shadow:var(--post-device-elevation-300)}}@media screen and (max-width: 1023.98px){.local-header{z-index:2;inset-block-start:var(--global-header-height);padding-block:12px;flex-wrap:wrap;gap:16px}.local-header.local-header-mobile-extended::after{bottom:0}.local-header:not(.local-header-mobile-extended){box-shadow:var(--post-device-elevation-300)}}.local-sub{margin-inline-end:16px}::slotted(.list-inline){margin:0 !important;z-index:3 !important;position:relative !important}
|
|
140
|
+
const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{z-index:1020;position:relative}:host(:not(:has([slot=title]))) .local-header{padding-block-start:0}:host(:not(:has([slot=title]))) .local-sub{display:none}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;position:sticky;padding-inline:4px;height:var(--global-header-height)}@media screen and (max-width: 1023.98px){.global-header{z-index:3;inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{z-index:5;padding-inline-end:12px;inset-block-start:calc((var(--global-header-height) - var(--global-header-reduced-height))*-1)}}.global-sub{display:flex;align-items:center;gap:24px}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--global-header-height);width:var(--global-header-height);min-height:var(--global-header-reduced-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{height:calc(var(--global-header-height) - var(--header-scroll-top))}}::slotted(ul){margin-block:0 !important;list-style:none;display:flex;padding-left:0;gap:1rem;flex-shrink:0 !important}.local-header{display:flex;position:sticky;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;min-height:var(--local-header-min-height);background:#fff;transition:box-shadow .2s ease-in-out}.local-header::after{content:\"\";position:absolute;width:100%;height:1px;background-color:#e1e0dc;bottom:-1px;z-index:1}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.local-header::after{background-color:Highlight}}@media screen and (min-width: 1024px){.local-header{z-index:3;inset-block-start:calc(-1*(var(--local-header-height) - var(--main-navigation-height)) + var(--global-header-reduced-height));padding-block-start:18px;box-shadow:var(--post-device-elevation-300)}}@media screen and (max-width: 1023.98px){.local-header{z-index:2;inset-block-start:var(--global-header-height);padding-block:12px;flex-wrap:wrap;gap:16px}.local-header.local-header-mobile-extended::after{bottom:0}.local-header:not(.local-header-mobile-extended){box-shadow:var(--post-device-elevation-300)}}.local-sub{margin-inline-end:16px}::slotted(.list-inline){margin:0 !important;z-index:3 !important;position:relative !important}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{width:100%}@media screen and (min-width: 1024px){.navigation{inset-block-start:var(--global-header-reduced-height)}.navigation::before{display:block;content:\"\";position:absolute;inset:0;z-index:2;background:#fff}}@media screen and (max-width: 1023.98px){.navigation{position:fixed;z-index:1;inset-inline:0;inset-block-start:var(--header-height);overflow:hidden}::slotted(post-mainnavigation),.navigation-footer{display:none;flex-direction:column;padding-block:16px 24px;padding-inline:32px}.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer{display:flex}.navigation.extended>div{display:flex;flex-direction:column;height:calc(100dvh - var(--header-height))}.navigation.extended.scroll-y>div{overflow-y:auto;overflow-x:hidden}.navigation.extended ::slotted(post-mainnavigation){flex-grow:1 !important}::slotted(post-mainnavigation){background-color:#fafafa;gap:32px}.navigation-footer{background-color:#f0efed;gap:24px}}@media screen and (max-width: 599.98px){::slotted(post-mainnavigation),.navigation-footer{padding-inline:16px}}";
|
|
141
141
|
const PostHeaderStyle0 = postHeaderCss;
|
|
142
142
|
|
|
143
143
|
const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTMLElement {
|
|
@@ -152,59 +152,79 @@ const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTM
|
|
|
152
152
|
}
|
|
153
153
|
firstFocusableEl;
|
|
154
154
|
lastFocusableEl;
|
|
155
|
-
scrollListenerElement = null;
|
|
156
|
-
overflowElement = null;
|
|
157
155
|
mobileMenu;
|
|
158
156
|
mobileMenuAnimation;
|
|
159
|
-
throttledScroll = () => this.handleScrollEvent();
|
|
160
157
|
throttledResize = throttle(50, () => this.handleResize());
|
|
158
|
+
scrollParentResizeObserver;
|
|
159
|
+
localHeaderResizeObserver;
|
|
160
|
+
get scrollParent() {
|
|
161
|
+
const frozenScrollParent = document.querySelector('[data-is-post-header-scroll-parent]');
|
|
162
|
+
if (frozenScrollParent)
|
|
163
|
+
return frozenScrollParent;
|
|
164
|
+
let element = this.host.parentElement;
|
|
165
|
+
while (element) {
|
|
166
|
+
const overflow = getComputedStyle(element).overflowY;
|
|
167
|
+
if (['auto', 'scroll'].includes(overflow)) {
|
|
168
|
+
return element;
|
|
169
|
+
}
|
|
170
|
+
element = element.parentElement;
|
|
171
|
+
}
|
|
172
|
+
return document.documentElement;
|
|
173
|
+
}
|
|
174
|
+
get host() { return this; }
|
|
175
|
+
frozeBody(isMobileMenuExtended) {
|
|
176
|
+
const scrollParent = this.scrollParent;
|
|
177
|
+
if (isMobileMenuExtended) {
|
|
178
|
+
scrollParent.setAttribute('data-is-post-header-scroll-parent', '');
|
|
179
|
+
scrollParent.style.overflow = 'hidden';
|
|
180
|
+
this.host.addEventListener('keydown', this.keyboardHandler.bind(this));
|
|
181
|
+
}
|
|
182
|
+
else {
|
|
183
|
+
scrollParent.style.overflow = '';
|
|
184
|
+
scrollParent.removeAttribute('data-is-post-header-scroll-parent');
|
|
185
|
+
this.host.removeEventListener('keydown', this.keyboardHandler.bind(this));
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
/**
|
|
189
|
+
* An event emitted when the device has changed
|
|
190
|
+
*/
|
|
191
|
+
postUpdateDevice;
|
|
161
192
|
componentWillRender() {
|
|
162
|
-
this.scrollListenerElement = this.getScrollParent();
|
|
163
|
-
this.overflowElement =
|
|
164
|
-
this.scrollListenerElement === document
|
|
165
|
-
? document.documentElement
|
|
166
|
-
: this.scrollListenerElement;
|
|
167
|
-
this.scrollListenerElement.addEventListener('scroll', this.throttledScroll, { passive: true });
|
|
168
193
|
window.addEventListener('resize', this.throttledResize, { passive: true });
|
|
194
|
+
window.addEventListener('scroll', this.handleScrollEvent.bind(this), {
|
|
195
|
+
passive: true,
|
|
196
|
+
});
|
|
197
|
+
this.scrollParent.addEventListener('scroll', this.handleScrollEvent.bind(this), {
|
|
198
|
+
passive: true,
|
|
199
|
+
});
|
|
169
200
|
this.handleResize();
|
|
170
201
|
this.handleScrollEvent();
|
|
171
202
|
this.getFocusableElements();
|
|
172
203
|
}
|
|
173
204
|
componentDidLoad() {
|
|
174
|
-
this.updateLocalHeaderHeight();
|
|
175
205
|
// Check if the mega dropdown is expanded
|
|
176
|
-
document.addEventListener('postToggleMegadropdown', (
|
|
177
|
-
this.megadropdownOpen = event.detail.isVisible;
|
|
178
|
-
});
|
|
206
|
+
document.addEventListener('postToggleMegadropdown', this.megedropdownStateHandler.bind(this));
|
|
179
207
|
this.host.addEventListener('click', this.handleLinkClick.bind(this));
|
|
208
|
+
this.handleScrollParentResize();
|
|
209
|
+
this.handleLocalHeaderResize();
|
|
180
210
|
}
|
|
181
211
|
// Clean up possible side effects when post-header is disconnected
|
|
182
212
|
disconnectedCallback() {
|
|
213
|
+
const scrollParent = this.scrollParent;
|
|
183
214
|
this.mobileMenuExtended = false;
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
215
|
+
scrollParent.style.overflow = '';
|
|
216
|
+
scrollParent.removeAttribute('data-is-post-header-scroll-parent');
|
|
217
|
+
window.removeEventListener('resize', this.throttledResize);
|
|
218
|
+
window.removeEventListener('scroll', this.handleScrollEvent.bind(this));
|
|
219
|
+
scrollParent.removeEventListener('scroll', this.handleScrollEvent.bind(this));
|
|
220
|
+
document.removeEventListener('postToggleMegadropdown', this.megedropdownStateHandler.bind(this));
|
|
221
|
+
this.host.removeEventListener('keydown', this.keyboardHandler.bind(this));
|
|
188
222
|
this.host.removeEventListener('click', this.handleLinkClick.bind(this));
|
|
223
|
+
if (this.scrollParentResizeObserver)
|
|
224
|
+
this.scrollParentResizeObserver.disconnect();
|
|
225
|
+
if (this.localHeaderResizeObserver)
|
|
226
|
+
this.localHeaderResizeObserver.disconnect();
|
|
189
227
|
}
|
|
190
|
-
get host() { return this; }
|
|
191
|
-
frozeBody(isMobileMenuExtended) {
|
|
192
|
-
this.overflowElement.style.overflow = isMobileMenuExtended ? 'hidden' : '';
|
|
193
|
-
if (isMobileMenuExtended) {
|
|
194
|
-
this.host.addEventListener('keydown', e => {
|
|
195
|
-
this.keyboardHandler(e);
|
|
196
|
-
});
|
|
197
|
-
}
|
|
198
|
-
else {
|
|
199
|
-
this.host.removeEventListener('keydown', e => {
|
|
200
|
-
this.keyboardHandler(e);
|
|
201
|
-
});
|
|
202
|
-
}
|
|
203
|
-
}
|
|
204
|
-
/**
|
|
205
|
-
* An event emitted when the device has changed
|
|
206
|
-
*/
|
|
207
|
-
postUpdateDevice;
|
|
208
228
|
/**
|
|
209
229
|
* Toggles the mobile navigation.
|
|
210
230
|
*/
|
|
@@ -224,6 +244,9 @@ const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTM
|
|
|
224
244
|
if (!this.mobileMenuExtended)
|
|
225
245
|
await this.mobileMenuAnimation.finished;
|
|
226
246
|
}
|
|
247
|
+
megedropdownStateHandler(event) {
|
|
248
|
+
this.megadropdownOpen = event.detail.isVisible;
|
|
249
|
+
}
|
|
227
250
|
// Get all the focusable elements in the post-header mobile menu
|
|
228
251
|
getFocusableElements() {
|
|
229
252
|
// Get elements in the correct order (different as the DOM order)
|
|
@@ -254,25 +277,15 @@ const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTM
|
|
|
254
277
|
}
|
|
255
278
|
}
|
|
256
279
|
}
|
|
257
|
-
getScrollParent() {
|
|
258
|
-
let parent = this.host.parentElement;
|
|
259
|
-
if (parent.tagName === 'BODY') {
|
|
260
|
-
parent = document;
|
|
261
|
-
}
|
|
262
|
-
return parent;
|
|
263
|
-
}
|
|
264
280
|
handleScrollEvent() {
|
|
265
|
-
|
|
266
|
-
const st = Math.max(0, this.scrollListenerElement instanceof Document
|
|
267
|
-
? this.scrollListenerElement.documentElement.scrollTop
|
|
268
|
-
: this.scrollListenerElement.scrollTop);
|
|
269
|
-
this.host.style.setProperty('--header-scroll-top', `${st}px`);
|
|
281
|
+
this.host.style.setProperty('--header-scroll-top', `${this.scrollParent.scrollTop}px`);
|
|
270
282
|
}
|
|
271
283
|
updateLocalHeaderHeight() {
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
284
|
+
const localHeaderHeight = this.host.shadowRoot.querySelector('.local-header')?.clientHeight || 0;
|
|
285
|
+
this.host.style.setProperty('--local-header-height', `${localHeaderHeight}px`);
|
|
286
|
+
}
|
|
287
|
+
updateScrollParentHeight() {
|
|
288
|
+
this.host.style.setProperty('--header-scroll-parent-height', `${this.scrollParent.clientHeight}px`);
|
|
276
289
|
}
|
|
277
290
|
handleLinkClick(event) {
|
|
278
291
|
const target = event.target;
|
|
@@ -309,7 +322,6 @@ const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTM
|
|
|
309
322
|
this.toggleMobileMenu();
|
|
310
323
|
this.mobileMenuAnimation.finish(); // no animation
|
|
311
324
|
}
|
|
312
|
-
this.updateLocalHeaderHeight();
|
|
313
325
|
// Apply only on change for doing work only when necessary
|
|
314
326
|
if (newDevice !== previousDevice) {
|
|
315
327
|
this.device = newDevice;
|
|
@@ -319,6 +331,19 @@ const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTM
|
|
|
319
331
|
});
|
|
320
332
|
}
|
|
321
333
|
}
|
|
334
|
+
handleScrollParentResize() {
|
|
335
|
+
if (this.scrollParent) {
|
|
336
|
+
this.scrollParentResizeObserver = new ResizeObserver(this.updateScrollParentHeight.bind(this));
|
|
337
|
+
this.scrollParentResizeObserver.observe(this.scrollParent);
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
handleLocalHeaderResize() {
|
|
341
|
+
const localHeader = this.host.shadowRoot.querySelector('.local-header');
|
|
342
|
+
if (localHeader) {
|
|
343
|
+
this.localHeaderResizeObserver = new ResizeObserver(this.updateLocalHeaderHeight.bind(this));
|
|
344
|
+
this.localHeaderResizeObserver.observe(localHeader);
|
|
345
|
+
}
|
|
346
|
+
}
|
|
322
347
|
switchLanguageSwitchMode() {
|
|
323
348
|
const variant = this.device === 'desktop' ? 'menu' : 'list';
|
|
324
349
|
Array.from(this.host.querySelectorAll('post-language-switch')).forEach(languageSwitch => {
|
|
@@ -333,10 +358,10 @@ const PostHeader = /*@__PURE__*/ proxyCustomElement(class PostHeader extends HTM
|
|
|
333
358
|
if (!this.megadropdownOpen) {
|
|
334
359
|
navigationClasses.push('scroll-y');
|
|
335
360
|
}
|
|
336
|
-
return (h("div", { ref: el => (this.mobileMenu = el)
|
|
361
|
+
return (h("div", { class: navigationClasses.join(' ') }, h("div", { ref: el => (this.mobileMenu = el) }, h("slot", { name: "post-mainnavigation" }), (this.device === 'mobile' || this.device === 'tablet') && (h("div", { class: "navigation-footer" }, h("slot", { name: "meta-navigation" }), h("slot", { name: "post-language-switch" }))))));
|
|
337
362
|
}
|
|
338
363
|
render() {
|
|
339
|
-
return (h(Host, { key: '
|
|
364
|
+
return (h(Host, { key: '866b6378652ff5860c8b046f249411941e3510ca', version: version }, h("div", { key: '4f834e011faf12f0e9629c442172153a5d710f6a', class: "global-header" }, h("div", { key: '16acea9aa91b071f4ee25b00e19a0d23f5765ffa', class: "global-sub" }, h("div", { key: '1aea872a00166aeada3538f25c8d5b1afb0595a5', class: "logo" }, h("slot", { key: '343ed3f016295d025196841260fc501795f211ec', name: "post-logo" }))), h("div", { key: '47e2d3df5973d8cf542051c9da6b2b7f077d202c', class: "global-sub" }, this.device === 'desktop' && h("slot", { key: '2000cf588d06f28b1d25bca60842d05e01635e7c', name: "meta-navigation" }), h("slot", { key: '40d62c75e080bbee36b4a5f75ee0d6a727b0153a', name: "global-controls" }), this.device === 'desktop' && h("slot", { key: '531b27a3332a6f91491b0e04efce42037edf7384', name: "post-language-switch" }), h("div", { key: '427b869f050400509ec17b1ed8aa539a3efb8fef', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, h("slot", { key: '3d824c0b31cc55f4279944e02c4fa3f26bce9b7e', name: "post-togglebutton" })))), h("div", { key: 'bd23ea8c42abf93d343f4579b1a433d7224a3631', class: 'local-header ' + (this.mobileMenuExtended ? 'local-header-mobile-extended' : '') }, h("slot", { key: '25ee29386c66395371dd1fa7c61794fefc220b85', name: "title" }), h("div", { key: 'e8b11280d2664a8d19935fe7fc095830d0ff4a1c', class: "local-sub" }, h("slot", { key: 'af10ad2f82146d10af525dd6a83871f428d09953', name: "local-controls" }), h("slot", { key: '311f3b2ef20794fae57d8354bd4a06552e90703e' })), this.device === 'desktop' && this.renderNavigation()), this.device !== 'desktop' && this.renderNavigation()));
|
|
340
365
|
}
|
|
341
366
|
static get watchers() { return {
|
|
342
367
|
"mobileMenuExtended": ["frozeBody"]
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
2
|
import { d as defineCustomElement$1 } from './post-icon2.js';
|
|
3
3
|
|
|
4
|
-
const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item post-megadropdown-trigger button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px}post-mainnavigation .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.98px){post-mainnavigation .back-button{font-size:16px}}@media screen and (max-width: 599.98px){post-mainnavigation .back-button{font-size:14px}}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media screen and (min-width: 1024px){post-mainnavigation{display:block}post-mainnavigation nav{max-width:100%;background:#fff;max-height:var(--main-navigation-height);user-select:none;transition:margin 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{z-index:4;position:absolute;inset-block-end:0;overflow:hidden}post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;background:#fff;padding:16px;box-shadow:var(--post-device-elevation-500);line-height:100%;height:var(--main-navigation-height)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{background-color:ButtonFace !important}post-mainnavigation .left-scroll-button button:hover,post-mainnavigation .right-scroll-button button:hover{background-color:Highlight !important}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button button post-icon,post-mainnavigation .right-scroll-button button post-icon{font-size:1rem}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button.d-none,post-mainnavigation .right-scroll-button.d-none{display:none}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button{inset-inline-start:0;padding-inline-end:2rem}}@media screen and (min-width: 1024px){post-mainnavigation .right-scroll-button{inset-inline-end:0;padding-inline-start:2rem}}@media screen and (min-width: 1024px){post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--main-navigation-height);gap:4px;font-size:16px;z-index:4}post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (min-width: 1024px){post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}post-mainnavigation .back-button .btn{padding-inline:0}";
|
|
4
|
+
const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button{background-color:ButtonFace !important}post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:Highlight !important}}post-mainnavigation post-list-item post-megadropdown-trigger button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item post-megadropdown-trigger button{flex:0 0 fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:4px}post-mainnavigation .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.98px){post-mainnavigation .back-button{font-size:16px}}@media screen and (max-width: 599.98px){post-mainnavigation .back-button{font-size:14px}}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{content:\"\";mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:24px;width:24px}@media screen and (min-width: 1024px){post-mainnavigation{display:block;overflow-x:hidden}post-mainnavigation nav{max-width:100%;background:#fff;max-height:var(--main-navigation-height);user-select:none;transition:margin 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{z-index:4;position:absolute;inset-block-end:0;overflow:hidden}post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;background:#fff;padding:16px;box-shadow:var(--post-device-elevation-500);line-height:100%;height:var(--main-navigation-height)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){post-mainnavigation .left-scroll-button button,post-mainnavigation .right-scroll-button button{background-color:ButtonFace !important}post-mainnavigation .left-scroll-button button:hover,post-mainnavigation .right-scroll-button button:hover{background-color:Highlight !important}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button button post-icon,post-mainnavigation .right-scroll-button button post-icon{font-size:1rem}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button.d-none,post-mainnavigation .right-scroll-button.d-none{display:none}}@media screen and (min-width: 1024px){post-mainnavigation .left-scroll-button{inset-inline-start:0;padding-inline-end:2rem}}@media screen and (min-width: 1024px){post-mainnavigation .right-scroll-button{inset-inline-end:0;padding-inline-start:2rem}}@media screen and (min-width: 1024px){post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{position:sticky;padding-inline:12px;height:var(--main-navigation-height);gap:4px;font-size:16px;z-index:4}post-mainnavigation post-list-item>a .nav-el-active,post-mainnavigation post-list-item>button .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-active{font-weight:700;text-align:center;opacity:0}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{position:absolute;opacity:1;text-align:center;width:100%;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff;font-weight:700}post-mainnavigation post-list-item>a.selected .nav-el-active,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item>button.selected .nav-el-active,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-active,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-active{opacity:1}post-mainnavigation post-list-item>a.selected .nav-el-inactive,post-mainnavigation post-list-item>a[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item>button.selected .nav-el-inactive,post-mainnavigation post-list-item>button[aria-expanded=true] .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button.selected .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true] .nav-el-inactive{opacity:0}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}}@media screen and (min-width: 1024px)and (max-width: 599.98px){post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{font-size:14px}}@media screen and (min-width: 1024px){post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:12px;transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{width:calc(100% - 28px)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}}@media screen and (min-width: 1024px){post-mainnavigation post-megadropdown button:not(.btn-icon-close),post-mainnavigation post-megadropdown a{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-megadropdown button:not(.btn-icon-close)::before,post-mainnavigation post-megadropdown a::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-megadropdown button:not(.btn-icon-close).selected,post-mainnavigation post-megadropdown button:not(.btn-icon-close)[aria-expanded=true],post-mainnavigation post-megadropdown a.selected,post-mainnavigation post-megadropdown a[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover,post-mainnavigation post-megadropdown a:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-megadropdown button:not(.btn-icon-close):hover::before,post-mainnavigation post-megadropdown a:hover::before{background-color:#504f4b}}@media screen and (min-width: 1024px){post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.98px){post-mainnavigation nav{transform:none !important}post-mainnavigation .left-scroll-button,post-mainnavigation .right-scroll-button{display:none}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;min-width:100%;height:48px;padding-inline:8px 12px;gap:16px;font-weight:400;position:relative}post-mainnavigation post-list-item>a::before,post-mainnavigation post-list-item>button::before,post-mainnavigation post-list-item post-megadropdown-trigger button::before{content:\"\";background-color:#050400;bottom:0;width:100%;height:1px;position:absolute;left:0}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{background-color:#050400;color:#fff}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{background-color:#504f4b;color:#fff}post-mainnavigation post-list-item>a:hover::before,post-mainnavigation post-list-item>button:hover::before,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::before{background-color:#504f4b}post-mainnavigation post-list-item>a .nav-el-inactive,post-mainnavigation post-list-item>button .nav-el-inactive,post-mainnavigation post-list-item post-megadropdown-trigger button .nav-el-inactive{display:none}post-mainnavigation>button::after,post-mainnavigation post-megadropdown-trigger button::after{transform:rotate(-90deg)}}post-mainnavigation .back-button .btn{padding-inline:0}";
|
|
5
5
|
const PostMainnavigationStyle0 = postMainnavigationCss;
|
|
6
6
|
|
|
7
7
|
const SCROLL_REPEAT_INTERVAL = 100; // Interval for repeated scrolling when holding down scroll button
|
package/dist/components/slide.js
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
const easing = 'ease';
|
|
2
2
|
const duration = 500;
|
|
3
3
|
const fill = 'forwards';
|
|
4
|
-
function slideUp(el, translateSize = '100%') {
|
|
4
|
+
function slideUp(el, translateSize = '-100%') {
|
|
5
5
|
return el.animate([
|
|
6
|
-
{ transform:
|
|
7
|
-
{ transform:
|
|
6
|
+
{ transform: 'translateY(0)' }, // Starting position (no translation)
|
|
7
|
+
{ transform: `translateY(${translateSize})` }, // End position
|
|
8
8
|
], {
|
|
9
9
|
duration: duration,
|
|
10
10
|
easing,
|
|
11
11
|
fill,
|
|
12
12
|
});
|
|
13
13
|
}
|
|
14
|
-
function slideDown(el, translateSize = '100%') {
|
|
14
|
+
function slideDown(el, translateSize = '-100%') {
|
|
15
15
|
return el.animate([
|
|
16
|
-
{ transform:
|
|
17
|
-
{ transform:
|
|
16
|
+
{ transform: `translateY(${translateSize})` }, // Starting position (no translation)
|
|
17
|
+
{ transform: 'translateY(0)' }, // End position
|
|
18
18
|
], {
|
|
19
19
|
duration: duration,
|
|
20
20
|
easing,
|
|
@@ -22,4 +22,4 @@ function slideDown(el, translateSize = '100%') {
|
|
|
22
22
|
});
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
export {
|
|
25
|
+
export { slideUp as a, slideDown as s };
|
package/dist/docs.json
CHANGED
package/dist/esm/index.js
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
export { P as PostAccordion } from './post-accordion-
|
|
2
|
-
export { P as PostAccordionItem } from './post-accordion-item-
|
|
3
|
-
export { P as PostAvatar } from './post-avatar-
|
|
4
|
-
export { P as PostBackToTop } from './post-back-to-top-
|
|
5
|
-
export { P as PostBanner } from './post-banner-
|
|
6
|
-
export { P as PostBreadcrumb } from './post-breadcrumb-
|
|
7
|
-
export { P as PostBreadcrumbItem, a as PostMenuItem } from './post-menu-item-
|
|
8
|
-
export { P as PostCardControl } from './post-card-control-
|
|
9
|
-
export { P as PostClosebutton, a as PostHeader, b as PostIcon, c as PostLanguageOption, d as PostLanguageSwitch, e as PostList, f as PostListItem, g as PostLogo, h as PostMainnavigation, i as PostMegadropdown, j as PostMegadropdownTrigger, k as PostMenu, l as PostMenuTrigger, m as PostPopovercontainer, n as PostTogglebutton } from './post-togglebutton-
|
|
10
|
-
export { P as PostCollapsible, a as PostCollapsibleTrigger } from './post-collapsible-trigger-
|
|
11
|
-
export { P as PostFooter } from './post-footer-
|
|
12
|
-
export { P as PostLinkarea } from './post-linkarea-
|
|
13
|
-
export { P as PostPopover } from './post-popover-
|
|
14
|
-
export { P as PostRating } from './post-rating-
|
|
15
|
-
export { P as PostTabs } from './post-tabs-
|
|
16
|
-
export { P as PostTabHeader } from './post-tab-header-
|
|
17
|
-
export { P as PostTabPanel } from './post-tab-panel-
|
|
18
|
-
export { P as PostTag } from './post-tag-
|
|
19
|
-
export { P as PostTooltip } from './post-tooltip-
|
|
1
|
+
export { P as PostAccordion } from './post-accordion-f67ce0ad.js';
|
|
2
|
+
export { P as PostAccordionItem } from './post-accordion-item-4f1a4597.js';
|
|
3
|
+
export { P as PostAvatar } from './post-avatar-52a2ba46.js';
|
|
4
|
+
export { P as PostBackToTop } from './post-back-to-top-9d72c88f.js';
|
|
5
|
+
export { P as PostBanner } from './post-banner-9487b62d.js';
|
|
6
|
+
export { P as PostBreadcrumb } from './post-breadcrumb-5096ed4f.js';
|
|
7
|
+
export { P as PostBreadcrumbItem, a as PostMenuItem } from './post-menu-item-b475d581.js';
|
|
8
|
+
export { P as PostCardControl } from './post-card-control-de358f9d.js';
|
|
9
|
+
export { P as PostClosebutton, a as PostHeader, b as PostIcon, c as PostLanguageOption, d as PostLanguageSwitch, e as PostList, f as PostListItem, g as PostLogo, h as PostMainnavigation, i as PostMegadropdown, j as PostMegadropdownTrigger, k as PostMenu, l as PostMenuTrigger, m as PostPopovercontainer, n as PostTogglebutton } from './post-togglebutton-83debaae.js';
|
|
10
|
+
export { P as PostCollapsible, a as PostCollapsibleTrigger } from './post-collapsible-trigger-4566760b.js';
|
|
11
|
+
export { P as PostFooter } from './post-footer-9117392a.js';
|
|
12
|
+
export { P as PostLinkarea } from './post-linkarea-9412ebb6.js';
|
|
13
|
+
export { P as PostPopover } from './post-popover-33f9c2a2.js';
|
|
14
|
+
export { P as PostRating } from './post-rating-215726b3.js';
|
|
15
|
+
export { P as PostTabs } from './post-tabs-2bb77fdd.js';
|
|
16
|
+
export { P as PostTabHeader } from './post-tab-header-bd6cc764.js';
|
|
17
|
+
export { P as PostTabPanel } from './post-tab-panel-1070163c.js';
|
|
18
|
+
export { P as PostTag } from './post-tag-45a5e46a.js';
|
|
19
|
+
export { P as PostTooltip } from './post-tooltip-c29ac8e8.js';
|
|
20
20
|
import './index-3419e46d.js';
|
|
21
|
-
import './package-
|
|
21
|
+
import './package-69fdcae3.js';
|
|
22
22
|
import './heading-levels-5b7b4349.js';
|
|
23
23
|
import './check-one-of-0bee20f5.js';
|
|
24
24
|
import './index-8f8fe5b0.js';
|
|
@@ -27,7 +27,7 @@ import './check-type-37d5d307.js';
|
|
|
27
27
|
import './check-url-17962bc8.js';
|
|
28
28
|
import './index.browser-51485f85.js';
|
|
29
29
|
import './check-non-empty-258a56b3.js';
|
|
30
|
-
import './slide-
|
|
30
|
+
import './slide-cd2850ee.js';
|
|
31
31
|
import './fade-1f3cacf4.js';
|
|
32
32
|
import './debounce-e54c7131.js';
|
|
33
33
|
import './breakpoints-bbe0c54e.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, g as getElement, h, H as Host } from './index-3419e46d.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-69fdcae3.js';
|
|
3
3
|
import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
|
|
4
4
|
import { c as checkOneOf } from './check-one-of-0bee20f5.js';
|
|
5
5
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, g as getElement, h, H as Host } from './index-3419e46d.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-69fdcae3.js';
|
|
3
3
|
import { H as HEADING_LEVELS } from './heading-levels-5b7b4349.js';
|
|
4
4
|
import { c as checkEmptyOrOneOf } from './index-8f8fe5b0.js';
|
|
5
5
|
import { n as nanoid } from './index.browser-51485f85.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export { P as post_accordion_item } from './post-accordion-item-
|
|
1
|
+
export { P as post_accordion_item } from './post-accordion-item-4f1a4597.js';
|
|
2
2
|
import './index-3419e46d.js';
|
|
3
|
-
import './package-
|
|
3
|
+
import './package-69fdcae3.js';
|
|
4
4
|
import './heading-levels-5b7b4349.js';
|
|
5
5
|
import './index-8f8fe5b0.js';
|
|
6
6
|
import './constants-8d548297.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { P as post_accordion } from './post-accordion-
|
|
1
|
+
export { P as post_accordion } from './post-accordion-f67ce0ad.js';
|
|
2
2
|
import './index-3419e46d.js';
|
|
3
|
-
import './package-
|
|
3
|
+
import './package-69fdcae3.js';
|
|
4
4
|
import './heading-levels-5b7b4349.js';
|
|
5
5
|
import './check-one-of-0bee20f5.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, g as getElement, h, H as Host } from './index-3419e46d.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-69fdcae3.js';
|
|
3
3
|
import { c as checkNonEmpty } from './check-non-empty-258a56b3.js';
|
|
4
4
|
|
|
5
5
|
const postAvatarCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{--post-avatar-bg:var(--post-scheme-color-interactive-primary-enabled-bg2);--post-avatar-fg:var(--post-scheme-color-interactive-primary-enabled-fg3);display:inline-flex;position:relative;width:var(--post-device-sizing-interactive-icon-size3);height:var(--post-device-sizing-interactive-icon-size3);background-color:var(--post-scheme-color-interactive-primary-enabled-stroke3);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-primary-enabled-stroke3);border-radius:var(--post-device-border-radius-round);font-size:var(--post-device-font-size-8);vertical-align:top;line-height:1}:host::after{display:block;content:\"\";position:absolute;inset:0;z-index:1;border-radius:inherit}*,*::before,*::after{box-sizing:border-box}slot,img,::slotted(img){display:block;width:100%;height:100%}img,::slotted(img){border-radius:var(--post-device-border-radius-round)}::slotted(:not(img)){display:none !important}.initials{display:flex;justify-content:center;align-items:center;position:relative;z-index:2;width:100%;height:100%;background-color:var(--post-avatar-bg);border-radius:var(--post-device-border-radius-round);color:var(--post-avatar-fg);text-transform:uppercase}.initials span{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.initials span:not(caption){position:absolute !important}";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { P as post_avatar } from './post-avatar-
|
|
1
|
+
export { P as post_avatar } from './post-avatar-52a2ba46.js';
|
|
2
2
|
import './index-3419e46d.js';
|
|
3
|
-
import './package-
|
|
3
|
+
import './package-69fdcae3.js';
|
|
4
4
|
import './check-non-empty-258a56b3.js';
|
|
5
5
|
import './constants-8d548297.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, g as getElement, h, H as Host } from './index-3419e46d.js';
|
|
2
|
-
import { s as
|
|
3
|
-
import { v as version } from './package-
|
|
2
|
+
import { s as slideDown, a as slideUp } from './slide-cd2850ee.js';
|
|
3
|
+
import { v as version } from './package-69fdcae3.js';
|
|
4
4
|
import { c as checkType } from './check-type-37d5d307.js';
|
|
5
5
|
import { c as checkNonEmpty } from './check-non-empty-258a56b3.js';
|
|
6
6
|
|
|
@@ -24,10 +24,10 @@ const PostBackToTop = class {
|
|
|
24
24
|
// Watch for changes in belowFold
|
|
25
25
|
watchBelowFold(newValue) {
|
|
26
26
|
if (newValue) {
|
|
27
|
-
|
|
27
|
+
slideDown(this.host, this.translateY);
|
|
28
28
|
}
|
|
29
29
|
else {
|
|
30
|
-
|
|
30
|
+
slideUp(this.host, this.translateY);
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
scrollToTop() {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { P as post_back_to_top } from './post-back-to-top-
|
|
1
|
+
export { P as post_back_to_top } from './post-back-to-top-9d72c88f.js';
|
|
2
2
|
import './index-3419e46d.js';
|
|
3
|
-
import './slide-
|
|
4
|
-
import './package-
|
|
3
|
+
import './slide-cd2850ee.js';
|
|
4
|
+
import './package-69fdcae3.js';
|
|
5
5
|
import './check-type-37d5d307.js';
|
|
6
6
|
import './check-non-empty-258a56b3.js';
|
|
7
7
|
import './constants-8d548297.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, g as getElement, h, H as Host } from './index-3419e46d.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-69fdcae3.js';
|
|
3
3
|
import { f as fadeOut } from './fade-1f3cacf4.js';
|
|
4
4
|
import { a as checkEmptyOrPattern, c as checkEmptyOrOneOf } from './index-8f8fe5b0.js';
|
|
5
5
|
import { n as nanoid } from './index.browser-51485f85.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export { P as post_banner } from './post-banner-
|
|
1
|
+
export { P as post_banner } from './post-banner-9487b62d.js';
|
|
2
2
|
import './index-3419e46d.js';
|
|
3
|
-
import './package-
|
|
3
|
+
import './package-69fdcae3.js';
|
|
4
4
|
import './fade-1f3cacf4.js';
|
|
5
5
|
import './index-8f8fe5b0.js';
|
|
6
6
|
import './constants-8d548297.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, g as getElement, h, H as Host } from './index-3419e46d.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-69fdcae3.js';
|
|
3
3
|
import { c as checkUrl } from './check-url-17962bc8.js';
|
|
4
4
|
import { d as debounce } from './debounce-e54c7131.js';
|
|
5
5
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export { P as post_breadcrumb_item, a as post_menu_item } from './post-menu-item-
|
|
1
|
+
export { P as post_breadcrumb_item, a as post_menu_item } from './post-menu-item-b475d581.js';
|
|
2
2
|
import './index-3419e46d.js';
|
|
3
|
-
import './package-
|
|
3
|
+
import './package-69fdcae3.js';
|
|
4
4
|
import './index-8f8fe5b0.js';
|
|
5
5
|
import './constants-8d548297.js';
|
|
6
6
|
import './check-one-of-0bee20f5.js';
|