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

show property action menu on hover

Browse Source
This commit is contained in:
Mads Rasmussen
2022-07-04 13:27:33 +02:00
parent 99069d3e3c
commit eba57d92e3
1 changed files with 14 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/Umbraco.Web.UI.Client/src/backoffice/components/node-property.element.ts
View File

@@ -18,9 +18,20 @@ class UmbNodeProperty extends UmbContextConsumerMixin(LitElement) {
:host {
display: block;
}
p {
color: var(--uui-color-text-alt);
}
#property-action-menu {
opacity: 0;
}
#layout:focus-within #property-action-menu,
#layout:hover #property-action-menu,
#property-action-menu[open] {
opacity: 1;
}
`,
];
@@ -54,6 +65,7 @@ class UmbNodeProperty extends UmbContextConsumerMixin(LitElement) {
this._dataTypeStore = _instance;
this._useDataType();
});
this.consumeContext('umbExtensionRegistry', (_instance: UmbExtensionRegistry) => {
this._extensionRegistry = _instance;
this._useDataType();
@@ -138,12 +150,12 @@ class UmbNodeProperty extends UmbContextConsumerMixin(LitElement) {
}
private _renderPropertyActionMenu () {
return html`${ this._dataType ? html`<umb-property-action-menu .propertyEditorUIAlias="${this._dataType.propertyEditorUIAlias}" .value="${this.value}"></umb-property-action-menu>`: '' }`;
return html`${ this._dataType ? html`<umb-property-action-menu id="property-action-menu" .propertyEditorUIAlias="${this._dataType.propertyEditorUIAlias}" .value="${this.value}"></umb-property-action-menu>`: '' }`;
}
render() {
return html`
<umb-editor-property-layout>
<umb-editor-property-layout id="layout">
<div slot="header">
<uui-label>${this.property.label}</uui-label>
${ this._renderPropertyActionMenu() }