remove double box containers + adjust styling

This commit is contained in:
Mads Rasmussen
2025-01-16 21:05:03 +01:00
parent df8da92344
commit 810b7d6de3
4 changed files with 58 additions and 55 deletions

View File

@@ -99,19 +99,18 @@ export class UmbDocumentHistoryWorkspaceInfoAppElement extends UmbLitElement {
override render() {
return html`
<uui-box headline=${this.localize.term('general_history')}>
<umb-extension-with-api-slot
<umb-extension-with-api-slot
slot="header-actions"
type="entityAction"
.filter=${(manifest: ManifestEntityAction) => this.#allowedActions.has(manifest.alias)}></umb-extension-with-api-slot>
</uui-button>
.filter=${(manifest: ManifestEntityAction) =>
this.#allowedActions.has(manifest.alias)}></umb-extension-with-api-slot>
${when(
this._items,
() => this.#renderHistory(),
() => html`<div id="loader"><uui-loader></uui-loader></div>`,
)}
${this.#renderPagination()}
</uui-box>
`;
}
@@ -163,6 +162,11 @@ export class UmbDocumentHistoryWorkspaceInfoAppElement extends UmbLitElement {
static override styles = [
UmbTextStyles,
css`
:host {
display: block;
padding: var(--uui-size-space-4) var(--uui-size-space-5);
}
#loader {
display: flex;
justify-content: center;

View File

@@ -137,48 +137,46 @@ export class UmbDocumentReferencesWorkspaceInfoAppElement extends UmbLitElement
override render() {
if (!this._items?.length) return nothing;
return html`
<uui-box headline=${this.localize.term('references_labelUsedByItems')} style="--uui-box-default-padding:0">
<uui-table>
<uui-table-head>
<uui-table-head-cell></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_name">Name</umb-localize></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_status">Status</umb-localize></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_typeName">Type Name</umb-localize></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_type">Type</umb-localize></uui-table-head-cell>
</uui-table-head>
${repeat(
this._items,
(item) => item.id,
(item) => html`
<uui-table-row>
<uui-table-cell style="text-align:center;">
<umb-icon name=${this.#getIcon(item)}></umb-icon>
</uui-table-cell>
<uui-table-cell class="link-cell">
${when(
isDocumentReference(item),
() => html`
<uui-button
label="${this.localize.term('general_edit')} ${item.name}"
href="${this._editDocumentPath}edit/${item.id}">
${item.name}
</uui-button>
`,
() => item.name,
)}
</uui-table-cell>
<uui-table-cell>
${this.#getPublishedStatus(item)
? this.localize.term('content_published')
: this.localize.term('content_unpublished')}
</uui-table-cell>
<uui-table-cell>${this.#getContentTypeName(item)}</uui-table-cell>
<uui-table-cell>${this.#getContentType(item)}</uui-table-cell>
</uui-table-row>
`,
)}
</uui-table>
</uui-box>
<uui-table>
<uui-table-head>
<uui-table-head-cell></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_name">Name</umb-localize></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_status">Status</umb-localize></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_typeName">Type Name</umb-localize></uui-table-head-cell>
<uui-table-head-cell><umb-localize key="general_type">Type</umb-localize></uui-table-head-cell>
</uui-table-head>
${repeat(
this._items,
(item) => item.id,
(item) => html`
<uui-table-row>
<uui-table-cell style="text-align:center;">
<umb-icon name=${this.#getIcon(item)}></umb-icon>
</uui-table-cell>
<uui-table-cell class="link-cell">
${when(
isDocumentReference(item),
() => html`
<uui-button
label="${this.localize.term('general_edit')} ${item.name}"
href="${this._editDocumentPath}edit/${item.id}">
${item.name}
</uui-button>
`,
() => item.name,
)}
</uui-table-cell>
<uui-table-cell>
${this.#getPublishedStatus(item)
? this.localize.term('content_published')
: this.localize.term('content_unpublished')}
</uui-table-cell>
<uui-table-cell>${this.#getContentTypeName(item)}</uui-table-cell>
<uui-table-cell>${this.#getContentType(item)}</uui-table-cell>
</uui-table-row>
`,
)}
</uui-table>
${this.#renderReferencePagination()}
`;
}
@@ -202,6 +200,7 @@ export class UmbDocumentReferencesWorkspaceInfoAppElement extends UmbLitElement
:host {
display: contents;
}
uui-table-cell:not(.link-cell) {
color: var(--uui-color-text-alt);
}

View File

@@ -155,13 +155,11 @@ export class UmbDocumentLinksWorkspaceInfoAppElement extends UmbLitElement {
override render() {
return html`
<uui-box headline=${this.localize.term('general_links')}>
${when(
this._loading,
() => this.#renderLoading(),
() => this.#renderContent(),
)}
</uui-box>
${when(
this._loading,
() => this.#renderLoading(),
() => this.#renderContent(),
)}
`;
}

View File

@@ -194,7 +194,9 @@ export class UmbDocumentWorkspaceViewInfoElement extends UmbLitElement {
#renderInfoApp(initializer: UmbExtensionElementInitializer<ManifestWorkspaceInfoApp>) {
const headline = initializer.manifest?.meta.label;
return html`
<uui-box headline=${ifDefined(headline ? this.localize.string(headline) : undefined)}>
<uui-box
headline=${ifDefined(headline ? this.localize.string(headline) : undefined)}
style="--uui-box-default-padding:0">
${initializer.component}</uui-box
>
`;