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

add headline property to editor-entity-layout for consistent headline size

Browse Source
This commit is contained in:
Mads Rasmussen
2022-09-14 13:47:35 +02:00
parent 980def8750
commit 62060df5c5
4 changed files with 16 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/Umbraco.Web.UI.Client/src/backoffice/editors/extensions/editor-extensions.element.ts
View File

@@ -52,8 +52,7 @@ export class UmbEditorExtensionsElement extends UmbContextConsumerMixin(LitEleme
render() {
return html`
<umb-editor-entity-layout alias="Umb.Editor.Extensions">
<h3 slot="name">Extensions</h3>
<umb-editor-entity-layout headline="Extensions" alias="Umb.Editor.Extensions">
<uui-box headline="Extensions">
<uui-table>
<uui-table-head>

8
src/Umbraco.Web.UI.Client/src/backoffice/editors/shared/editor-entity-layout/editor-entity-layout.element.ts
View File

@@ -58,6 +58,9 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(LitElement) {
`,
];
@property()
headline = '';
@property()
alias = '';
@@ -171,7 +174,10 @@ export class UmbEditorEntityLayout extends UmbContextConsumerMixin(LitElement) {
<umb-editor-layout>
<div id="header" slot="header">
<slot id="icon" name="icon"></slot>
<slot id="name" name="name"></slot>
<div id="name">
${this.headline ? html`<h3>${this.headline}</h3>` : nothing}
<slot id="name" name="name"></slot>
</div>
${this._renderViews()}
</div>

4
src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/content-picker/modal-layout-content-picker.element.ts
View File

@@ -72,9 +72,7 @@ export class UmbModalLayoutContentPickerElement extends UmbModalLayoutElement<Um
render() {
return html`
<!-- TODO: maybe we need a layout component between umb-editor-layout and umb-editor-entity? -->
<umb-editor-entity-layout>
<h3 slot="name">Select content</h3>
<umb-editor-entity-layout headline="Select Content">
<uui-box>
<uui-input></uui-input>
<hr />

14
src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts
View File

@@ -3,10 +3,12 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { customElement, property, state } from 'lit/decorators.js';
import { ifDefined } from 'lit-html/directives/if-defined.js';
import { UmbContextConsumerMixin } from '../../../../context';
import type { UmbModalHandler } from '../../modal-handler';
import type { UmbExtensionManifestPropertyEditorUI, UmbExtensionRegistry } from '../../../../extension';
import type { Subscription } from 'rxjs';
import type { UUIComboboxListElement, UUIComboboxListEvent } from '@umbraco-ui/uui';
import type { UmbModalHandler } from '../../modal-handler';
import type { UmbExtensionRegistry } from '../../../../extension';
import type { ManifestPropertyEditorUI } from '../../../../models';
export interface UmbModalPropertyEditorUIPickerData {
selection?: Array<string>;
@@ -23,7 +25,7 @@ export class UmbModalLayoutPropertyEditorUIPickerElement extends UmbContextConsu
data?: UmbModalPropertyEditorUIPickerData;
@state()
private _propertyEditorUIs: Array<UmbExtensionManifestPropertyEditorUI> = [];
private _propertyEditorUIs: Array<ManifestPropertyEditorUI> = [];
@state()
private _selection?: Array<string>;
@@ -77,9 +79,7 @@ export class UmbModalLayoutPropertyEditorUIPickerElement extends UmbContextConsu
render() {
return html`
<!-- TODO: maybe we need a layout component between umb-editor-layout and umb-editor-entity? -->
<umb-editor-entity alias="Umb.Modal.PropertyEditorUIPicker">
<h3 slot="name">Select Property Editor UI</h3>
<umb-editor-entity-layout headline="Select Property Editor UI">
<uui-box>
<uui-combobox-list value="${ifDefined(this._selection?.[0])}" @change="${this._handleChange}">
${this._propertyEditorUIs.map(
@@ -97,7 +97,7 @@ export class UmbModalLayoutPropertyEditorUIPickerElement extends UmbContextConsu
<uui-button label="Close" @click=${this._close}></uui-button>
<uui-button label="Submit" look="primary" color="positive" @click=${this._submit}></uui-button>
</div>
</umb-editor-entity>
</umb-editor-entity-layout>
`;
}
}