@sapudex/web-components 2.44.0 → 2.46.0

package/src/themes/MastheadItem.css

@@ -30,6 +30,11 @@
   --udex-masthead-item-button-icon-size: 32px;
   --udex-masthead-item-arrow-icon-size: 16px;
   --udex-masthead-item-arrow-margin-inline-start: var(--udexSpacer4);
+  --udex-masthead-item-profile-padding-l: var(--udexSpacer64) var(--udexSpacer48) 80px var(--udexSpacer48);
+  --udex-masthead-item-padding-l: var(--udexSpacer32) 52px 52px;
+  --udex-masthead-item-padding-m: var(--udexSpacer24) var(--udexSpacer24) 0;
+  --udex-masthead-item-padding-s: var(--udexSpacer24) var(--udexSpacer48) 0 var(--udexSpacer48);
+  --udex-masthead-item-padding-xs: var(--udexSpacer24) var(--udexSpacer24) 0;
 
   display: var(--udex-masthead-item-display);
   align-items: var(--udex-masthead-item-align-content);
@@ -88,6 +93,10 @@
   background: var(--sapShell_Navigation_Background, #FFF);
 }
 
+.udex-masthead-item__button--explore + .udex-masthead-item__dropdown-holder {
+  padding: 0;
+}
+
 :host([_has-four-columns-menu]),
 :host([slot="exploreSAP"]) {
   position: inherit;
@@ -99,12 +108,8 @@
   inline-size: 100%;
 }
 
-:host([_has-four-columns-menu]) ::slotted([slot="dropdown"]) {
-  --udex-masthead-menu-padding-desktop: 32px var(--udexSpacer84);
-}
-
-:host([slot="exploreSAP"]) ::slotted([slot="dropdown"]) {
-  --udex-masthead-menu-padding-desktop: 32px 0;
+:host([_has-four-columns-menu]) .udex-masthead-item__dropdown-holder {
+  padding: var(--udexSpacer32) var(--udexSpacer84);
 }
 
 :host([_has-four-columns-menu]) ::slotted([slot="dropdown"]),
@@ -114,14 +119,11 @@
 }
 
 :host([slot="exploreSAP"]) .udex-masthead-item__dropdown-holder {
+  padding: var(--udexSpacer32) 0;
   max-width: var(--udex-masthead-shell-container-xl-max-width, 1432px);
   margin: 0 auto;
 }
 
-.udex-masthead-item__dropdown-holder {
-  position: relative;
-}
-
 .udex-masthead-item {
   font-size: inherit;
   line-height: inherit;
@@ -364,6 +366,10 @@
   box-shadow: none;
 }
 
+:host([_is-mobile-mode]) .udex-masthead-item__dropdown-holder {
+  overflow: auto;
+}
+
 :host([_is-mobile-mode]) .udex-masthead-item__dropdown:after,
 :host([part="menu-open-btn"]) .udex-masthead-item__dropdown:after {
   box-shadow: var(--udex-masthead-shell-dropdown-shadow);
@@ -381,18 +387,37 @@
   position: initial;
 }
 
+:host([_is-menu-open-btn]) .udex-masthead-item__dropdown-holder {
+  padding: 0;
+}
+
 .udex-masthead-hidden-text {
   display: none;
 }
 
+.udex-masthead-item__dropdown-holder {
+  padding: var(--udex-masthead-item-padding-l);
+  box-sizing: border-box;
+  position: relative;
+}
+
+.udex-masthead-item__button--profile+.udex-masthead-item__dropdown-holder {
+  padding: var(--udex-masthead-item-profile-padding-l);
+}
+
+:host([_is-mobile-mode]) .udex-masthead-item__dropdown-holder {
+  padding: var(--udex-masthead-item-padding-m);
+}
+
 @media (max-width: 1599px) {
   :host([slot="exploreSAP"]) .udex-masthead-item__dropdown-holder {
     max-width: var(--udex-masthead-shell-container-l-max-width, 1456px);
-    padding: 0 var(--udexSpacer72);
+    padding: var(--udexSpacer32) var(--udexSpacer72);
+    box-sizing: content-box;
   }
 
-  :host([_has-four-columns-menu]) ::slotted([slot="dropdown"]) {
-    --udex-masthead-menu-padding-desktop: 32px var(--udexSpacer72);
+  :host([_has-four-columns-menu]) .udex-masthead-item__dropdown-holder {
+    padding: var(--udexSpacer32) var(--udexSpacer72);
   }
 }
 
@@ -406,6 +431,10 @@
     display: initial;
   }
 
+  :host .udex-masthead-item__dropdown-holder {
+    padding: var(--udex-masthead-item-padding-m);
+  }
+
   .udex-masthead-item__button--country-selector+.udex-masthead-item__dropdown {
     min-width: var(--udex-masthead-item-dropdown-mobile-min-width);
   }
@@ -445,6 +474,7 @@
 
   .udex-masthead-item__dropdown-holder {
     height: 100%;
+    overflow: auto;
   }
 
   .udex-masthead-item__dropdown:after {
@@ -470,5 +500,15 @@
   .udex-masthead-item__button--profile + .udex-masthead-item__dropdown {
     min-width: auto;
   }
+
+  :host .udex-masthead-item__dropdown-holder {
+    padding: var(--udex-masthead-item-padding-s);
+  }
+}
+
+@media (max-width: 639px) {
+  :host .udex-masthead-item__dropdown-holder {
+    padding: var(--udex-masthead-item-padding-xs);
+  }
 }
 

package/src/themes/MastheadMenu.css

@@ -1,6 +1,4 @@
 :host {
-  --udex-masthead-menu-padding-desktop: 32px 52px 52px;
-  --udex-masthead-menu-padding-mobile: 24px;
   --udex-masthead-menu-background: var(--sapShell_Navigation_Background, #FFF);
   --udex-masthead-menu-column_gap: 52px;
   --udex-masthead-menu-column-width: calc(1rem * 15);
@@ -14,6 +12,7 @@
   --udex-masthead-menu-grid-template-columns: auto;
   --udex-masthead-menu-justify-content: flex-start;
   --udex-masthead-menu-sub-category-font-size: var(--udexTypographyBodyXSFontSize, 14px);
+  --udex-masthead-menu-sub-category-font-size: var(--udexTypographyBodyXSFontSize, 14px);
   --udex-masthead-menu-sub-category-color: var(--udexColorGrey9, #223548);
   --udex-masthead-menu-sub-category-text-transform: none;
   --udex-masthead-menu-sub-category-font-weight: var(--udexTypographyFontWeightRegular, 400);
@@ -25,7 +24,6 @@
 }
 
 .udex-masthead-menu {
-  padding: var(--udex-masthead-menu-padding-desktop);
   background: var(--udex-masthead-menu-background);
   display: inline-block;
   position: relative;
@@ -178,10 +176,6 @@
   font-size: var(--udex-masthead-menu-title-font-size-mobile);
 }
 
-:host([_is-mobile-mode]) .udex-masthead-menu {
-  padding: var(--udex-masthead-menu-padding-mobile);
-}
-
 :host([_is-mobile-mode]) .udex-masthead-menu__row {
   gap: var(--udex-masthead-menu-mobile-column-gap, 56px);
   display: flex;
@@ -266,10 +260,6 @@
     font-size: var(--udex-masthead-menu-title-font-size-mobile);
   }
 
-  .udex-masthead-menu {
-    padding: var(--udex-masthead-menu-padding-mobile);
-  }
-
   .udex-masthead-menu__row {
     gap: var(--udex-masthead-menu-mobile-column-gap, 56px);
     display: flex;

package/src/themes/MastheadMobileMenu.css

@@ -114,15 +114,3 @@ span.udex-masthead-mobile-menu__sub-category {
 .udex-masthead-mobile-menu__sub-list li {
   margin-bottom: var(--udex-masthead-menu-sub-list-item-spacing);
 }
-
-@media (max-width: 979px) {
-  .udex-masthead-mobile-menu__nav-holder {
-    padding: var(--udex-masthead-mobile-menu-padding-s);
-  }
-}
-
-@media (max-width: 639px) {
-  .udex-masthead-mobile-menu__nav-holder {
-    padding: var(--udex-masthead-mobile-menu-padding-xs);
-  }
-}

package/src/themes/MastheadProfileMenu.css

@@ -1,8 +1,5 @@
 :host {
   --udex-masthead-profile-menu-color: var(--udexColorNeutralBlack, #000);
-  --udex-masthead-profile-menu-paddings-desktop: 64px 48px 80px 48px;
-  --udex-masthead-profile-menu-paddings-mobile: var(--udexSpacer24, 24px);
-  --udex-masthead-profile-menu-paddings-mobile-s: var(--udexSpacer24, 24px) var(--udexSpacer48, 48px);
   --udex-masthead-profile-menu-background-color: var(--udexColorNeutralWhite, #FFF);
   --udex-masthead-profile-menu-login-border-color: var(--udexColorGrey2, #EAECEE);
   --udex-masthead-profile-menu-username-color: inherit;
@@ -30,7 +27,6 @@
   flex-direction: column;
   align-items: stretch;
   background-color: var(--udex-masthead-profile-menu-background-color);
-  padding: var(--udex-masthead-profile-menu-paddings-desktop);
   box-sizing: border-box;
 }
 
@@ -73,13 +69,12 @@
 }
 
 :host([_is-mobile-mode]) .udex-masthead-profile-menu {
-  padding: var(--udex-masthead-profile-menu-paddings-mobile);
   box-sizing: border-box;
   width: 100%;
   height: 100%;
-  overflow: auto;
 }
 
+:host([_is-mobile-mode]) .udex-masthead-profile-menu__identities-list-wrap,
 :host([_is-mobile-mode]) .udex-masthead-profile-menu__message,
 :host([_is-mobile-mode]) .udex-masthead-profile-menu__header {
   margin-bottom: var(--udexSpacer24);
@@ -158,6 +153,17 @@
   overflow: auto;
 }
 
+:host([_is-mobile-mode]) .udex-masthead-profile-menu__add-remove-btn,
+:host([_is-mobile-mode]) .udex-masthead-profile-menu__btn,
+:host([_is-mobile-mode]) .udex-masthead-profile-menu__content {
+  margin-bottom: var(--udexSpacer24);
+  padding-top: 0;
+}
+
+:host([_is-mobile-mode]) .udex-masthead-profile-menu__add-remove-btn {
+  margin-top: 0;
+}
+
 .udex-masthead-profile-menu__links {
   height: 100%;
   overflow: auto;
@@ -244,12 +250,15 @@
   }
 
   .udex-masthead-profile-menu {
-    padding: var(--udex-masthead-profile-menu-paddings-mobile);
     box-sizing: border-box;
     width: 100%;
     min-height: 100%;
   }
 
+  .udex-masthead-profile-menu__identities-list-wrap,
+  .udex-masthead-profile-menu__add-remove-btn,
+  .udex-masthead-profile-menu__btn,
+  .udex-masthead-profile-menu__content,
   :host([_is-mobile-mode]) .udex-masthead-profile-menu__message,
   :host([_is-mobile-mode]) .udex-masthead-profile-menu__header {
     margin-bottom: var(--udexSpacer32);
@@ -263,19 +272,16 @@
   udex-masthead-menu-item::part(menu-item) {
     justify-content: center;
   }
-}
 
-@media (max-width: 979px) {
-  :host([_is-mobile-mode]) .udex-masthead-profile-menu,
-  .udex-masthead-profile-menu {
-    padding: var(--udex-masthead-profile-menu-paddings-mobile-s);
+  .udex-masthead-profile-menu__btn {
+    padding-top: 0;
   }
 }
 
-@media (max-width: 639px) {
-  :host([_is-mobile-mode]) .udex-masthead-profile-menu,
-  .udex-masthead-profile-menu {
-    padding: var(--udex-masthead-profile-menu-paddings-mobile);
+@media (max-height: 550px) {
+  .udex-masthead-profile-menu__identities-list-wrap,
+  .udex-masthead-profile-menu__content {
+    min-height: 100px;
   }
 }
 

package/src/themes/TagGroup.css

@@ -38,8 +38,7 @@
   display: none;
 }
 
-:host([disabled]) .udex-tag-group__tokenizer,
-:host([readonly]) .udex-tag-group__tokenizer {
+:host([disabled]) .udex-tag-group__tokenizer {
   pointer-events: none;
 }
 

package/dist/assets/messagebundle_pt-DPeE7NbC.js

@@ -1 +0,0 @@
-const s="© {0} SAP SE ou empresa afiliada SAP. Todos os direitos reservados.",o="Síntese",a="Sair",e="Principais links",t="Voltar ao início",O={COPYRIGHT:s,OVERVIEW:o,LOGOUT:a,MAIN_LINKS:e,BACK_TO_TOP:t};export{t as BACK_TO_TOP,s as COPYRIGHT,a as LOGOUT,e as MAIN_LINKS,o as OVERVIEW,O as default};

package/dist/assets/messagebundle_ro-CN4kAAYE.js

@@ -1 +0,0 @@
-const e="© {0} SAP SE sau o companie afiliată a SAP. Toate drepturile rezervate.",a="Imagine generală",n="Ieșire",o="Linkuri principale",s="Înapoi sus",t={COPYRIGHT:e,OVERVIEW:a,LOGOUT:n,MAIN_LINKS:o,BACK_TO_TOP:s};export{s as BACK_TO_TOP,e as COPYRIGHT,n as LOGOUT,o as MAIN_LINKS,a as OVERVIEW,t as default};