web/flow: fix styling of loading between stages

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-03-23 19:52:00 +01:00
parent 62d0e020db
commit a1f961db97
1 changed files with 8 additions and 5 deletions

View File

@ -41,6 +41,7 @@ import { until } from "lit-html/directives/until";
import { TITLE_SUFFIX } from "../elements/router/RouterOutlet"; import { TITLE_SUFFIX } from "../elements/router/RouterOutlet";
import { AccessDeniedChallenge } from "./access_denied/FlowAccessDenied"; import { AccessDeniedChallenge } from "./access_denied/FlowAccessDenied";
import { getQueryVariables } from "./utils"; import { getQueryVariables } from "./utils";
import { SpinnerSize } from "../elements/Spinner";
export const NEXT_ARG = "next"; export const NEXT_ARG = "next";
@ -169,10 +170,9 @@ export class FlowExecutor extends LitElement implements StageHost {
} }
renderLoading(): TemplateResult { renderLoading(): TemplateResult {
return html`<ak-empty-state return html`<div class="ak-loading">
?loading=${true} <ak-spinner size=${SpinnerSize.XLarge}></ak-spinner>
header=${gettext("Loading")}> </div>`;
</ak-empty-state>`;
} }
renderChallenge(): TemplateResult { renderChallenge(): TemplateResult {
@ -230,7 +230,10 @@ export class FlowExecutor extends LitElement implements StageHost {
renderChallengeWrapper(): TemplateResult { renderChallengeWrapper(): TemplateResult {
if (!this.challenge) { if (!this.challenge) {
return this.renderLoading(); return html`<ak-empty-state
?loading=${true}
header=${gettext("Loading")}>
</ak-empty-state>`;
} }
return html` return html`
${this.loading ? this.renderLoading() : html``} ${this.loading ? this.renderLoading() : html``}