trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

web: use ak-spinner everywhere

Browse source
This commit is contained in:
Jens Langhammer 2021-02-21 22:01:48 +01:00
parent fb9880bff4
commit 38da13fea3
2 changed files with 3 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
web/src/elements/buttons/SpinnerButton.ts
View file

@ -6,6 +6,7 @@ import ButtonStyle from "@patternfly/patternfly/components/Button/button.css";
// @ts-ignore // @ts-ignore
import SpinnerStyle from "@patternfly/patternfly/components/Spinner/spinner.css"; import SpinnerStyle from "@patternfly/patternfly/components/Spinner/spinner.css";
import { ColorStyles, PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants"; import { ColorStyles, PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants";
import { SpinnerSize } from "../Spinner";
@customElement("ak-spinner-button") @customElement("ak-spinner-button")
export class SpinnerButton extends LitElement { export class SpinnerButton extends LitElement {
@ -71,15 +72,7 @@ export class SpinnerButton extends LitElement {
> >
${this.isRunning ${this.isRunning
? html` <span class="pf-c-button__progress"> ? html` <span class="pf-c-button__progress">
<span <ak-spinner size=${SpinnerSize.Medium}></ak-spinner>
class="pf-c-spinner pf-m-md"
role="progressbar"
aria-valuetext="Loading..."
>
<span class="pf-c-spinner__clipper"></span>
<span class="pf-c-spinner__lead-ball"></span>
<span class="pf-c-spinner__tail-ball"></span>
</span>
</span>` </span>`
: ""} : ""}
<slot></slot> <slot></slot>

6
web/src/elements/table/Table.ts
View file

@ -134,11 +134,7 @@ export abstract class Table<T> extends LitElement {
<div class="pf-c-empty-state pf-m-sm"> <div class="pf-c-empty-state pf-m-sm">
<div class="pf-c-empty-state__content"> <div class="pf-c-empty-state__content">
<div class="pf-c-empty-state__icon"> <div class="pf-c-empty-state__icon">
<span class="pf-c-spinner" role="progressbar"> <ak-spinner></ak-spinner>
<span class="pf-c-spinner__clipper"></span>
<span class="pf-c-spinner__lead-ball"></span>
<span class="pf-c-spinner__tail-ball"></span>
</span>
</div> </div>
<h2 class="pf-c-title pf-m-lg">${gettext("Loading")}</h2> <h2 class="pf-c-title pf-m-lg">${gettext("Loading")}</h2>
</div> </div>