yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix interactions between header attributes

Browse Source
This commit is contained in:
Jesper Møller Jensen
2023-06-08 18:06:12 +12:00
parent 3d2e685d4f
commit 6c473dae38
1 changed files with 19 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/Umbraco.Web.UI.Client/src/packages/core/components/body-layout/body-layout.element.ts
View File

@@ -150,36 +150,39 @@ export class UmbBodyLayoutElement extends LitElement {
box-sizing: border-box;
z-index: 1;
}
:host([header-height-fit]) #header {
height: fit-content;
}
:host([header-transparent]) #header {
background-color: transparent;
border-color: transparent;
transition: box-shadow 150ms ease-in-out;
box-shadow: 0 -1px 0px 0px rgba(0, 0, 0, 0.8);
box-shadow: 0 -1px 0px 0px rgba(0, 0, 0, 0.5);
}
:host([header-transparent][scrolling]) #header {
/* This should be using the uui-shadows but for now they are too drastic for this use case */
box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2);
}
:host([header-height-fit][header-transparent]:not([header-no-padding])) #header-slot {
padding: var(--uui-size-layout-1);
}
:host([header-height-fit]) #header {
height: fit-content;
}
#header-slot {
padding: 0 var(--uui-size-layout-1);
flex-grow: 1;
}
:host([header-no-padding]) #header-slot {
padding: 0;
}
:host([header-transparent]:not([main-no-padding])) #main:not(*[style='display: none'] + *) {
/* The following styling is only applied if the clear-header IS present,
the main-no-padding attribute is NOT present, and the header is NOT hidden */
padding-top: var(--uui-size-space-1);
}
:host([header-transparent][scrolling]) #header {
/* This should be using the uui-shadows but for now they are too drastic for this use case */
box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.3);
}
:host([main-no-padding]) #main {
padding: 0;
}
:host([header-height-fit][header-transparent]) #header-slot {
padding: var(--uui-size-layout-1);
}
#header-slot,
#tabs-slot,
#action-menu-slot,
@@ -190,11 +193,6 @@ export class UmbBodyLayoutElement extends LitElement {
box-sizing: border-box;
}
#header-slot {
padding: 0 var(--uui-size-layout-1);
flex-grow: 1;
}
#navigation-slot,
#tabs-slot {
margin-left: auto;