web: fix background for modals on light theme
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
parent
53b10e64f8
commit
4a56b5e827
|
@ -55,14 +55,14 @@ export class ConfirmationForm extends ModalButton {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderModalInner(): TemplateResult {
|
renderModalInner(): TemplateResult {
|
||||||
return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
|
return html`<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">
|
<h1 class="pf-c-title pf-m-2xl">
|
||||||
<slot name="header"></slot>
|
<slot name="header"></slot>
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<form class="pf-c-form pf-m-horizontal">
|
<form class="pf-c-form pf-m-horizontal">
|
||||||
<slot class="pf-c-content" name="body"></slot>
|
<slot class="pf-c-content" name="body"></slot>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -177,12 +177,12 @@ export class DeleteBulkForm extends ModalButton {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderModalInner(): TemplateResult {
|
renderModalInner(): TemplateResult {
|
||||||
return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
|
return html`<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">${t`Delete ${this.objectLabel}`}</h1>
|
<h1 class="pf-c-title pf-m-2xl">${t`Delete ${this.objectLabel}`}</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<form class="pf-c-form pf-m-horizontal">
|
<form class="pf-c-form pf-m-horizontal">
|
||||||
<p class="pf-c-title">
|
<p class="pf-c-title">
|
||||||
${t`Are you sure you want to delete ${this.objects.length} ${this.objectLabel}?`}
|
${t`Are you sure you want to delete ${this.objects.length} ${this.objectLabel}?`}
|
||||||
|
@ -190,7 +190,7 @@ export class DeleteBulkForm extends ModalButton {
|
||||||
<slot name="notice"></slot>
|
<slot name="notice"></slot>
|
||||||
</form>
|
</form>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<ak-delete-objects-table
|
<ak-delete-objects-table
|
||||||
.objects=${this.objects}
|
.objects=${this.objects}
|
||||||
.usedBy=${this.usedBy}
|
.usedBy=${this.usedBy}
|
||||||
|
|
|
@ -71,12 +71,12 @@ export class DeleteForm extends ModalButton {
|
||||||
} else {
|
} else {
|
||||||
objName = "";
|
objName = "";
|
||||||
}
|
}
|
||||||
return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
|
return html`<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">${t`Delete ${this.objectLabel}`}</h1>
|
<h1 class="pf-c-title pf-m-2xl">${t`Delete ${this.objectLabel}`}</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<form class="pf-c-form pf-m-horizontal">
|
<form class="pf-c-form pf-m-horizontal">
|
||||||
<p>${t`Are you sure you want to delete ${this.objectLabel} ${objName} ?`}</p>
|
<p>${t`Are you sure you want to delete ${this.objectLabel} ${objName} ?`}</p>
|
||||||
</form>
|
</form>
|
||||||
|
@ -88,7 +88,7 @@ export class DeleteForm extends ModalButton {
|
||||||
return html``;
|
return html``;
|
||||||
}
|
}
|
||||||
return html`
|
return html`
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<form class="pf-c-form pf-m-horizontal">
|
<form class="pf-c-form pf-m-horizontal">
|
||||||
<p>${t`The following objects use ${objName} `}</p>
|
<p>${t`The following objects use ${objName} `}</p>
|
||||||
<ul class="pf-c-list">
|
<ul class="pf-c-list">
|
||||||
|
|
|
@ -58,14 +58,14 @@ export class ModalForm extends ModalButton {
|
||||||
return html`${this.loading
|
return html`${this.loading
|
||||||
? html`<ak-loading-overlay ?topMost=${true}></ak-loading-overlay>`
|
? html`<ak-loading-overlay ?topMost=${true}></ak-loading-overlay>`
|
||||||
: html``}
|
: html``}
|
||||||
<section class="pf-c-modal-box__header pf-c-page__main-section">
|
<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">
|
<h1 class="pf-c-title pf-m-2xl">
|
||||||
<slot name="header"></slot>
|
<slot name="header"></slot>
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<slot name="form"></slot>
|
<slot name="form"></slot>
|
||||||
</section>
|
</section>
|
||||||
<footer class="pf-c-modal-box__footer">
|
<footer class="pf-c-modal-box__footer">
|
||||||
|
|
|
@ -63,12 +63,12 @@ export class MemberSelectTable extends TableModal<User> {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderModalInner(): TemplateResult {
|
renderModalInner(): TemplateResult {
|
||||||
return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
|
return html`<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">${t`Select users to add`}</h1>
|
<h1 class="pf-c-title pf-m-2xl">${t`Select users to add`}</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
${this.renderTable()}
|
${this.renderTable()}
|
||||||
</section>
|
</section>
|
||||||
<footer class="pf-c-modal-box__footer">
|
<footer class="pf-c-modal-box__footer">
|
||||||
|
|
|
@ -61,12 +61,12 @@ export class GroupSelectModal extends TableModal<Group> {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderModalInner(): TemplateResult {
|
renderModalInner(): TemplateResult {
|
||||||
return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
|
return html`<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">${t`Select groups to add user to`}</h1>
|
<h1 class="pf-c-title pf-m-2xl">${t`Select groups to add user to`}</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
${this.renderTable()}
|
${this.renderTable()}
|
||||||
</section>
|
</section>
|
||||||
<footer class="pf-c-modal-box__footer">
|
<footer class="pf-c-modal-box__footer">
|
||||||
|
|
|
@ -25,12 +25,12 @@ export class UserActiveForm extends DeleteForm {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderModalInner(): TemplateResult {
|
renderModalInner(): TemplateResult {
|
||||||
return html`<section class="pf-c-modal-box__header pf-c-page__main-section">
|
return html`<section class="pf-c-modal-box__header pf-c-page__main-section pf-m-light">
|
||||||
<div class="pf-c-content">
|
<div class="pf-c-content">
|
||||||
<h1 class="pf-c-title pf-m-2xl">${t`Update ${this.objectLabel}`}</h1>
|
<h1 class="pf-c-title pf-m-2xl">${t`Update ${this.objectLabel}`}</h1>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="pf-c-modal-box__body pf-c-page__main-section">
|
<section class="pf-c-modal-box__body pf-c-page__main-section pf-m-light">
|
||||||
<form class="pf-c-form pf-m-horizontal">
|
<form class="pf-c-form pf-m-horizontal">
|
||||||
<p>
|
<p>
|
||||||
${t`Are you sure you want to update ${this.objectLabel} "${this.obj?.name}"?`}
|
${t`Are you sure you want to update ${this.objectLabel} "${this.obj?.name}"?`}
|
||||||
|
|
Reference in a new issue