web: fix source pages

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-03-17 19:00:57 +01:00
parent bf32cf3265
commit d2bbf2965d
11 changed files with 38 additions and 30 deletions

View file

@ -136,6 +136,9 @@ ak-message {
.pf-c-tabs { .pf-c-tabs {
background-color: var(--ak-dark-background-light); background-color: var(--ak-dark-background-light);
} }
.pf-c-tabs__item.pf-m-current {
--pf-c-tabs__link--after--BorderColor: #fd4b2d;
}
/* tabs, vertical */ /* tabs, vertical */
.pf-c-tabs.pf-m-vertical .pf-c-tabs__link { .pf-c-tabs.pf-m-vertical .pf-c-tabs__link {
background-color: var(--ak-dark-background-light); background-color: var(--ak-dark-background-light);

View file

@ -19,14 +19,14 @@ export class EmptyState extends LitElement {
fullHeight = false; fullHeight = false;
@property() @property()
header: string = ""; header = "";
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFBase, PFEmptyState, PFTitle, AKGlobal]; return [PFBase, PFEmptyState, PFTitle, AKGlobal];
} }
render(): TemplateResult { render(): TemplateResult {
return html`<div class="pf-c-empty-state ${this.fullHeight && 'pf-m-full-height'}"> return html`<div class="pf-c-empty-state ${this.fullHeight && "pf-m-full-height"}">
<div class="pf-c-empty-state__content"> <div class="pf-c-empty-state__content">
${this.loading ? ${this.loading ?
html`<div class="pf-c-empty-state__icon"> html`<div class="pf-c-empty-state__icon">

View file

@ -11,7 +11,7 @@ import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFStack from "@patternfly/patternfly/layouts/Stack/stack.css"; import PFStack from "@patternfly/patternfly/layouts/Stack/stack.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css"; import PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import AKGlobal from "../../authentik.css" import AKGlobal from "../../authentik.css";
import { convertToSlug } from "../../utils"; import { convertToSlug } from "../../utils";
import { SpinnerButton } from "./SpinnerButton"; import { SpinnerButton } from "./SpinnerButton";

View file

@ -4,7 +4,7 @@ import { ifDefined } from "lit-html/directives/if-defined";
import PFBase from "@patternfly/patternfly/patternfly-base.css"; import PFBase from "@patternfly/patternfly/patternfly-base.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css"; import PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFFlex from "@patternfly/patternfly/layouts/Flex/flex.css"; import PFFlex from "@patternfly/patternfly/layouts/Flex/flex.css";
import AKGlobal from "../../authentik.css" import AKGlobal from "../../authentik.css";
@customElement("ak-aggregate-card") @customElement("ak-aggregate-card")
export class AggregateCard extends LitElement { export class AggregateCard extends LitElement {

View file

@ -16,7 +16,7 @@ import "./cards/WorkerStatusCard";
import PFPage from "@patternfly/patternfly/components/Page/page.css"; import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css"; import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css";
import AKGlobal from "../../authentik.css" import AKGlobal from "../../authentik.css";
@customElement("ak-admin-overview") @customElement("ak-admin-overview")
export class AdminOverviewPage extends LitElement { export class AdminOverviewPage extends LitElement {

View file

@ -2,7 +2,7 @@ import { gettext } from "django";
import { CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element"; import { CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element";
import { EventsApi, EventTopPerUser } from "authentik-api"; import { EventsApi, EventTopPerUser } from "authentik-api";
import PFTable from "@patternfly/patternfly/components/Table/table.css"; import PFTable from "@patternfly/patternfly/components/Table/table.css";
import AKGlobal from "../../authentik.css" import AKGlobal from "../../authentik.css";
import "../../elements/Spinner"; import "../../elements/Spinner";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";

View file

@ -10,7 +10,6 @@ import "./ProxyProviderViewPage";
import { Provider, ProvidersApi } from "authentik-api"; import { Provider, ProvidersApi } from "authentik-api";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";
import { ifDefined } from "lit-html/directives/if-defined"; import { ifDefined } from "lit-html/directives/if-defined";
import { gettext } from "django";
@customElement("ak-provider-view") @customElement("ak-provider-view")
export class ProviderViewPage extends LitElement { export class ProviderViewPage extends LitElement {
@ -35,10 +34,7 @@ export class ProviderViewPage extends LitElement {
render(): TemplateResult { render(): TemplateResult {
if (!this.provider) { if (!this.provider) {
return html`<ak-empty-state return html`<ak-empty-state ?loading=${true} ?fullHeight=${true}></ak-empty-state>`;
?loading="${true}"
header=${gettext("Loading")}>
</ak-empty-state>`;
} }
switch (this.provider?.objectType) { switch (this.provider?.objectType) {
case "saml": case "saml":

View file

@ -4,6 +4,13 @@ import { CSSResult, customElement, html, property, TemplateResult } from "lit-el
import PFPage from "@patternfly/patternfly/components/Page/page.css"; import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css"; import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css";
import PFSizing from "@patternfly/patternfly/utilities/Sizing/sizing.css";
import PFFlex from "@patternfly/patternfly/utilities/Flex/flex.css";
import PFDisplay from "@patternfly/patternfly/utilities/Display/display.css";
import AKGlobal from "../../authentik.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
import "../../elements/buttons/ModalButton"; import "../../elements/buttons/ModalButton";
import "../../elements/buttons/SpinnerButton"; import "../../elements/buttons/SpinnerButton";
@ -41,7 +48,7 @@ export class LDAPSourceViewPage extends Page {
source!: LDAPSource; source!: LDAPSource;
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent]; return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal];
} }
constructor() { constructor() {

View file

@ -4,6 +4,13 @@ import { CSSResult, customElement, html, property, TemplateResult } from "lit-el
import PFPage from "@patternfly/patternfly/components/Page/page.css"; import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css"; import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css";
import PFSizing from "@patternfly/patternfly/utilities/Sizing/sizing.css";
import PFFlex from "@patternfly/patternfly/utilities/Flex/flex.css";
import PFDisplay from "@patternfly/patternfly/utilities/Display/display.css";
import AKGlobal from "../../authentik.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
import "../../elements/buttons/ModalButton"; import "../../elements/buttons/ModalButton";
import "../../elements/buttons/SpinnerButton"; import "../../elements/buttons/SpinnerButton";
@ -39,7 +46,7 @@ export class OAuthSourceViewPage extends Page {
source?: OAuthSource; source?: OAuthSource;
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent]; return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal];
} }
constructor() { constructor() {

View file

@ -5,6 +5,13 @@ import { until } from "lit-html/directives/until";
import PFPage from "@patternfly/patternfly/components/Page/page.css"; import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css"; import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css";
import PFSizing from "@patternfly/patternfly/utilities/Sizing/sizing.css";
import PFFlex from "@patternfly/patternfly/utilities/Flex/flex.css";
import PFDisplay from "@patternfly/patternfly/utilities/Display/display.css";
import AKGlobal from "../../authentik.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
import "../../elements/buttons/ModalButton"; import "../../elements/buttons/ModalButton";
import "../../elements/buttons/SpinnerButton"; import "../../elements/buttons/SpinnerButton";
@ -40,7 +47,7 @@ export class SAMLSourceViewPage extends Page {
source?: SAMLSource; source?: SAMLSource;
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent]; return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal];
} }
constructor() { constructor() {

View file

@ -2,13 +2,9 @@ import { css, CSSResult, customElement, html, LitElement, property, TemplateResu
import { Source, SourcesApi } from "authentik-api"; import { Source, SourcesApi } from "authentik-api";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";
import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css";
import PFGallery from "@patternfly/patternfly/layouts/Gallery/gallery.css";
import "../../elements/buttons/ModalButton"; import "../../elements/buttons/ModalButton";
import "../../elements/buttons/SpinnerButton"; import "../../elements/buttons/SpinnerButton";
import { SpinnerSize } from "../../elements/Spinner"; import "../../elements/EmptyState";
import "./LDAPSourceViewPage"; import "./LDAPSourceViewPage";
import "./OAuthSourceViewPage"; import "./OAuthSourceViewPage";
@ -34,24 +30,16 @@ export class SourceViewPage extends LitElement {
source?: Source; source?: Source;
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent].concat(css` return [css`
* { * {
height: 100%; height: 100%;
} }
`); `];
} }
render(): TemplateResult { render(): TemplateResult {
if (!this.source) { if (!this.source) {
return html`<div class="pf-c-empty-state pf-m-full-height"> return html`<ak-empty-state ?loading=${true} ?fullHeight=${true}></ak-empty-state>`;
<div class="pf-c-empty-state__content">
<div class="pf-l-bullseye">
<div class="pf-l-bullseye__item">
<ak-spinner size="${SpinnerSize.XLarge}"></ak-spinner>
</div>
</div>
</div>
</div>`;
} }
switch (this.source?.objectType) { switch (this.source?.objectType) {
case "ldap": case "ldap":