web: start implementing admin overview page

web/src/elements/Spinner.ts

@@ -0,0 +1,33 @@
+import { gettext } from "django";
+import { customElement, html, LitElement, property, TemplateResult } from "lit-element";
+// @ts-ignore
+import SpinnerStyle from "@patternfly/patternfly/components/Spinner/spinner.css";
+
+export enum SpinnerSize {
+    Small = "pf-m-sm",
+    Medium = "pf-m-md",
+    Large = "pf-m-lg",
+    XLarge = "pf-m-xl",
+}
+
+@customElement("pb-spinner")
+export class Spinner extends LitElement {
+    @property()
+    size: SpinnerSize = SpinnerSize.Medium;
+
+    static get styles() {
+        return [SpinnerStyle];
+    }
+
+    render(): TemplateResult {
+        return html`<span
+                class="pf-c-spinner ${this.size.toString()}"
+                role="progressbar"
+                aria-valuetext="${gettext("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>`;
+    }
+
+}

web/src/elements/table/Table.ts

@@ -86,8 +86,8 @@ export abstract class Table<T> extends LitElement {
                 <thead>
                     <tr role="row">
                         ${this.columns().map(
-                            (col) => html`<th role="columnheader" scope="col">${gettext(col)}</th>`
-                        )}
+        (col) => html`<th role="columnheader" scope="col">${gettext(col)}</th>`
+    )}
                     </tr>
                 </thead>
                 <tbody role="rowgroup">