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

hide overflow when property layout is vertical

Browse Source
This commit is contained in:
Nathan Woulfe
2023-06-26 11:33:55 +10:00
parent 2b8716b217
commit bd3b2fcd36
1 changed files with 34 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/Umbraco.Web.UI.Client/src/packages/core/workspace/workspace-property-layout/workspace-property-layout.element.ts
View File

@@ -1,4 +1,10 @@
import { css, html, LitElement, customElement, property } from '@umbraco-cms/backoffice/external/lit';
import {
css,
html,
LitElement,
customElement,
property,
} from '@umbraco-cms/backoffice/external/lit';
import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
/**
@@ -80,9 +86,14 @@ export class UmbWorkspacePropertyLayoutElement extends LitElement {
grid-column: span 2;
}
:host > div:last-child {
margin-top:var(--uui-size-space-3);
}
@container (width > 600px) {
:host(:not([orientation='vertical'])) > div {
grid-column: span 1;
margin-top:0;
}
}
@@ -90,8 +101,13 @@ export class UmbWorkspacePropertyLayoutElement extends LitElement {
border-bottom: none;
}
/* container has 18px padding, reduce here to ensure consistency */
:host-context(umb-variantable-property:first-of-type) {
padding-top: 0;
padding-top: var(--uui-size-space-2);
}
:host-context(umb-variantable-property:last-of-type) {
padding-bottom: var(--uui-size-space-2);
}
#description {
@@ -102,7 +118,22 @@ export class UmbWorkspacePropertyLayoutElement extends LitElement {
position: sticky;
top: var(--uui-size-space-4);
height: min-content;
z-index: 2;
z-index: 1050;
background-color:var(--uui-color-surface);
}
:host-context(umb-variantable-property) #header {
top: 0;
}
#header::before {
content: '';
display:block;
position:absolute;
top:calc(var(--uui-size-layout-1) * -1);
width:100%;
height:var(--uui-size-layout-1);
background-color:var(--uui-color-surface);
}
`,
];