Styled loader for Tiptap input component

This commit is contained in:
leekelleher
2024-09-30 17:46:20 +01:00
parent d696d549ba
commit 8825cccef0

View File

@@ -91,7 +91,6 @@ export class UmbInputTiptapElement extends UmbFormControlMixin<string, typeof Um
if (!element) return;
const dimensions = this.configuration?.getValueByAlias<{ width?: number; height?: number }>('dimensions');
console.log(this.configuration, dimensions);
if (dimensions?.width) this.setAttribute('style', `max-width: ${dimensions.width}px;`);
if (dimensions?.height) element.setAttribute('style', `max-height: ${dimensions.height}px;`);
@@ -120,7 +119,7 @@ export class UmbInputTiptapElement extends UmbFormControlMixin<string, typeof Um
return html`
${when(
!this._editor && !this._extensions?.length,
() => html`<uui-loader></uui-loader>`,
() => html`<div id="loader"><uui-loader></uui-loader></div>`,
() => html`
<umb-tiptap-fixed-menu
.toolbar=${this._toolbar}
@@ -140,6 +139,7 @@ export class UmbInputTiptapElement extends UmbFormControlMixin<string, typeof Um
position: relative;
z-index: 0;
}
:host([readonly]) {
pointer-events: none;
@@ -148,6 +148,12 @@ export class UmbInputTiptapElement extends UmbFormControlMixin<string, typeof Um
}
}
#loader {
display: flex;
align-items: center;
justify-content: center;
}
.tiptap {
height: 100%;
width: 100%;