@proximus/lavender 2.0.0-alpha.129 → 2.0.0-alpha.130
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/lavender.cjs.js +1 -1
- package/dist/lavender.es.js +12 -9
- package/dist/lavender.umd.js +1 -1
- package/package.json +1 -1
package/dist/lavender.es.js
CHANGED
|
@@ -2384,8 +2384,8 @@ let Span = _Span;
|
|
|
2384
2384
|
if (!customElements.get("px-span")) {
|
|
2385
2385
|
customElements.define("px-span", Span);
|
|
2386
2386
|
}
|
|
2387
|
-
const actionButtonCss = "button{border-radius:var(--px-radius-pill);background-color:var(--px-color-background-container-secondary-default);
|
|
2388
|
-
const styles$N = ":host{display:block}:host *{box-sizing:border-box}:host(:not([promoted])){display:none}a,button{display:block;padding:var(--px-padding-xs-mobile);cursor:pointer;border-radius:var(--px-radius-main);text-decoration:none;color:var(--px-color-text-brand-default);--btn-transition: all .2s ease-in-out 0s;transition:var(--btn-transition)}a px-span,button px-span{font-size:var(--px-text-size-label-s-mobile)}a:hover,button:hover{background-color:var(--px-color-background-container-secondary-default)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-mobile);outline:var(--px-focus-outline-mobile) solid var(--px-color-border-focus-outline-default)}@media only screen and (min-width: 48rem){a,button{padding:var(--px-padding-xs-tablet);min-width:65px}a px-span,button px-span{font-size:var(--px-text-size-label-s-tablet)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}:host(:not([promoted])){display:block}}@media only screen and (min-width: 64.0625rem){a,button{padding:var(--px-padding-xs-laptop)}a px-span,button px-span{font-size:var(--px-text-size-label-s-laptop)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-laptop);outline-width:var(--px-focus-outline-laptop)}}@media only screen and (min-width: 90.0625rem){a,button{padding:var(--px-padding-xs-desktop)}a px-span,button px-span{font-size:var(--px-text-size-label-s-desktop)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}}";
|
|
2387
|
+
const actionButtonCss = "button{border-radius:var(--px-radius-pill);background-color:var(--px-color-background-container-secondary-default);width:var(--px-size-l);height:var(--px-size-l)}button:hover{background-color:transparent;border-color:var(--px-color-border-state-hover-default)}@media only screen and (min-width: 48rem){button{border-radius:var(--px-radius-main);width:inherit;height:inherit}}";
|
|
2388
|
+
const styles$N = ":host{display:block}:host *{box-sizing:border-box}:host(:not([promoted])){display:none}a,button{display:block;padding:var(--px-padding-xs-mobile);cursor:pointer;border-radius:var(--px-radius-main);text-decoration:none;color:var(--px-color-text-brand-default);--btn-transition: all .2s ease-in-out 0s;transition:var(--btn-transition)}a px-span,button px-span{font-size:var(--px-text-size-label-s-mobile);line-height:var(--px-line-height-ratio-s)}a:hover,button:hover{background-color:var(--px-color-background-container-secondary-default)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-mobile);outline:var(--px-focus-outline-mobile) solid var(--px-color-border-focus-outline-default)}@media only screen and (min-width: 48rem){a,button{padding:var(--px-padding-xs-tablet);min-width:65px}a px-span,button px-span{font-size:var(--px-text-size-label-s-tablet)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}:host(:not([promoted])){display:block}}@media only screen and (min-width: 64.0625rem){a,button{padding:var(--px-padding-xs-laptop);border:var(--px-size-border-m) solid transparent}a px-span,button px-span{font-size:var(--px-text-size-label-s-laptop)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-laptop);outline-width:var(--px-focus-outline-laptop)}}@media only screen and (min-width: 90.0625rem){a,button{padding:var(--px-padding-xs-desktop)}a px-span,button px-span{font-size:var(--px-text-size-label-s-desktop)}a:focus-visible,button:focus-visible{outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}}";
|
|
2389
2389
|
const actionButtonStyles = new CSSStyleSheet();
|
|
2390
2390
|
const actionLinkStyles = new CSSStyleSheet();
|
|
2391
2391
|
actionButtonStyles.replaceSync(actionButtonCss);
|
|
@@ -2403,7 +2403,7 @@ const _ActionButton = class _ActionButton extends PxElement {
|
|
|
2403
2403
|
hidden--mobile
|
|
2404
2404
|
>
|
|
2405
2405
|
</px-icon>
|
|
2406
|
-
<px-span color="brand"><slot></slot></px-span>
|
|
2406
|
+
<px-span color="brand" font-size="inherit"><slot></slot></px-span>
|
|
2407
2407
|
</px-vstack>
|
|
2408
2408
|
</button>
|
|
2409
2409
|
`;
|
|
@@ -3318,7 +3318,7 @@ const _ActionLink = class _ActionLink extends PxElement {
|
|
|
3318
3318
|
size="m"
|
|
3319
3319
|
>
|
|
3320
3320
|
</px-icon>
|
|
3321
|
-
<px-span color="brand" hidden--mobile><slot></slot></px-span>
|
|
3321
|
+
<px-span color="brand" font-size="inherit" hidden--mobile><slot></slot></px-span>
|
|
3322
3322
|
</px-vstack>
|
|
3323
3323
|
</a>`;
|
|
3324
3324
|
this.shadowRoot.innerHTML = this.template();
|
|
@@ -11954,7 +11954,7 @@ let FooterSitemapItem = _FooterSitemapItem;
|
|
|
11954
11954
|
if (!customElements.get("px-footer-sitemap-item")) {
|
|
11955
11955
|
customElements.define("px-footer-sitemap-item", FooterSitemapItem);
|
|
11956
11956
|
}
|
|
11957
|
-
const styles$v = ":host{display:block}:host *{box-sizing:border-box}button,a{display:
|
|
11957
|
+
const styles$v = ":host{display:block;height:100%}:host *{box-sizing:border-box}button,a{display:flex;flex-direction:column;justify-content:center;font-family:var(--px-font-family);font-size:var(--px-text-size-label-m-mobile);line-height:var(--px-font-line-height-l);color:var(--px-color-text-neutral-default);text-align:center;cursor:pointer;padding:var(--px-padding-m-mobile) 0;height:100%}button:after,a:after{content:attr(data-label);display:block;height:0;width:auto;visibility:hidden;overflow:hidden;-webkit-user-select:none;user-select:none;pointer-events:none;font-weight:var(--px-font-weight-title)}button:focus-visible,a:focus-visible{outline-offset:var(--px-focus-offset-mobile);outline:var(--px-focus-outline-mobile) solid var(--px-color-border-focus-outline-default)}:host([current]) button,button:hover,:host([current]) a,a:hover{font-weight:var(--px-font-weight-title);color:var(--px-color-background-container-primary-default)}button{margin:0;border:0;border-bottom:2px solid rgba(0,0,0,0);outline:0;background:inherit}button[aria-expanded=true]{font-weight:var(--px-font-weight-title);color:var(--px-color-background-container-primary-default);border-bottom-color:var(--px-color-background-container-primary-default)}a{text-decoration:none}@media screen and (min-width: 48rem){button,a{font-size:var(--px-text-size-label-m-tablet);padding:var(--px-padding-m-tablet) 0}button:focus-visible,a:focus-visible{outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}}@media screen and (min-width: 64.0625rem){button,a{font-size:var(--px-text-size-label-m-laptop);padding:var(--px-padding-m-laptop) 0}button:focus-visible,a:focus-visible{outline-offset:var(--px-focus-offset-laptop);outline-width:var(--px-focus-outline-laptop)}}@media screen and (min-width: 90.0625rem){button,a{font-size:var(--px-text-size-label-m-desktop);padding:var(--px-padding-m-desktop) 0}button:focus-visible,a:focus-visible{outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}}";
|
|
11958
11958
|
const stylesheet$7 = new CSSStyleSheet();
|
|
11959
11959
|
stylesheet$7.replaceSync(styles$v);
|
|
11960
11960
|
class HeaderItem extends WithExtraAttributes {
|
|
@@ -12070,7 +12070,7 @@ class MDDLink extends HTMLElement {
|
|
|
12070
12070
|
if (!customElements.get("px-mdd-a")) {
|
|
12071
12071
|
customElements.define("px-mdd-a", MDDLink);
|
|
12072
12072
|
}
|
|
12073
|
-
const styles$u =
|
|
12073
|
+
const styles$u = '#navigation-container{border-bottom:var(--px-size-border-m) solid var(--px-color-border-main-default)}#dropdown-zone--desktop{display:none}#primary-navigation{display:none;margin:0;padding:0}#primary-navigation div,#primary-navigation px-hstack{height:100%}#panel-container{position:absolute;top:0;left:0;right:0;z-index:999}#backdrop-filter{display:none;position:absolute;z-index:998;left:0;width:100vw;height:100%;background:#0000004d;-webkit-backdrop-filter:saturate(180%) blur(15px);backdrop-filter:saturate(180%) blur(15px)}@media screen and (min-width: 48rem){#dropdown-zone--desktop{display:flex;justify-content:space-between;align-items:center}#dropdown-zone--desktop ::slotted([slot="target-group"]),#dropdown-zone--desktop ::slotted([slot="user-language"]){margin-bottom:var(--px-spacing-s-tablet)}#primary-navigation{display:block}#panel-container{top:auto}::slotted([slot="header-actions"]){margin-bottom:var(--px-padding-s-tablet)}}@media screen and (min-width: 64.0625rem){#dropdown-zone--desktop ::slotted([slot="target-group"]),#dropdown-zone--desktop ::slotted([slot="user-language"]){margin-bottom:var(--px-spacing-s-laptop)}::slotted([slot="header-actions"]){margin-bottom:var(--px-padding-s-laptop)}}@media screen and (min-width: 90.0625rem){#dropdown-zone--desktop ::slotted([slot="target-group"]),#dropdown-zone--desktop ::slotted([slot="user-language"]){margin-bottom:var(--px-spacing-s-desktop)}::slotted([slot="header-actions"]){margin-bottom:var(--px-padding-s-desktop)}}';
|
|
12074
12074
|
const stylesheet$6 = new CSSStyleSheet();
|
|
12075
12075
|
stylesheet$6.replaceSync(styles$u);
|
|
12076
12076
|
const menuAriaLabel = "Menu";
|
|
@@ -12084,12 +12084,15 @@ class Header extends WithExtraAttributes {
|
|
|
12084
12084
|
<div>
|
|
12085
12085
|
<header>
|
|
12086
12086
|
<slot name="skip"></slot>
|
|
12087
|
-
<px-section id="navigation-container" padding-
|
|
12087
|
+
<px-section id="navigation-container" padding-bottom="none" padding-bottom--mobile="s" padding-top="s" background-color="none">
|
|
12088
12088
|
<div id="dropdown-zone--desktop">
|
|
12089
12089
|
<slot name="target-group"></slot>
|
|
12090
12090
|
<slot name="user-language"></slot>
|
|
12091
12091
|
</div>
|
|
12092
|
-
<px-hstack gap="default" wrap="wrap"
|
|
12092
|
+
<px-hstack gap="default" wrap="wrap" id="navigation-wrapper">
|
|
12093
|
+
<px-hstack align-items="center">
|
|
12094
|
+
<slot name="header-logo"></slot>
|
|
12095
|
+
</px-hstack>
|
|
12093
12096
|
<slot name="header-logo"></slot>
|
|
12094
12097
|
<nav id="primary-navigation" aria-label="${this.primaryNavigationAriaLabel}">
|
|
12095
12098
|
<div role="list">
|
|
@@ -12104,7 +12107,7 @@ class Header extends WithExtraAttributes {
|
|
|
12104
12107
|
<px-button-icon id="burger-menu" variant="naked" aria-label="${this.burgerMenuAriaLabel ?? "Open menu"}"
|
|
12105
12108
|
aria-expanded="false" hidden--tablet hidden--laptop
|
|
12106
12109
|
hidden--desktop>
|
|
12107
|
-
<px-icon name="burger_menu" from="lavender"></px-icon>
|
|
12110
|
+
<px-icon name="burger_menu" from="lavender" size="m"></px-icon>
|
|
12108
12111
|
</px-button-icon>
|
|
12109
12112
|
</px-hstack>
|
|
12110
12113
|
</px-hstack>
|