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 {
background-color: var(--ak-dark-background-light);
}
.pf-c-tabs__item.pf-m-current {
--pf-c-tabs__link--after--BorderColor: #fd4b2d;
}
/* tabs, vertical */
.pf-c-tabs.pf-m-vertical .pf-c-tabs__link {
background-color: var(--ak-dark-background-light);

View file

@ -19,14 +19,14 @@ export class EmptyState extends LitElement {
fullHeight = false;
@property()
header: string = "";
header = "";
static get styles(): CSSResult[] {
return [PFBase, PFEmptyState, PFTitle, AKGlobal];
}
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">
${this.loading ?
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 PFCard from "@patternfly/patternfly/components/Card/card.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 { 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 PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFFlex from "@patternfly/patternfly/layouts/Flex/flex.css";
import AKGlobal from "../../authentik.css"
import AKGlobal from "../../authentik.css";
@customElement("ak-aggregate-card")
export class AggregateCard extends LitElement {

View file

@ -16,7 +16,7 @@ import "./cards/WorkerStatusCard";
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 AKGlobal from "../../authentik.css"
import AKGlobal from "../../authentik.css";
@customElement("ak-admin-overview")
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 { EventsApi, EventTopPerUser } from "authentik-api";
import PFTable from "@patternfly/patternfly/components/Table/table.css";
import AKGlobal from "../../authentik.css"
import AKGlobal from "../../authentik.css";
import "../../elements/Spinner";
import { DEFAULT_CONFIG } from "../../api/Config";

View file

@ -10,7 +10,6 @@ import "./ProxyProviderViewPage";
import { Provider, ProvidersApi } from "authentik-api";
import { DEFAULT_CONFIG } from "../../api/Config";
import { ifDefined } from "lit-html/directives/if-defined";
import { gettext } from "django";
@customElement("ak-provider-view")
export class ProviderViewPage extends LitElement {
@ -35,10 +34,7 @@ export class ProviderViewPage extends LitElement {
render(): TemplateResult {
if (!this.provider) {
return html`<ak-empty-state
?loading="${true}"
header=${gettext("Loading")}>
</ak-empty-state>`;
return html`<ak-empty-state ?loading=${true} ?fullHeight=${true}></ak-empty-state>`;
}
switch (this.provider?.objectType) {
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 PFContent from "@patternfly/patternfly/components/Content/content.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/SpinnerButton";
@ -41,7 +48,7 @@ export class LDAPSourceViewPage extends Page {
source!: LDAPSource;
static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent];
return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal];
}
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 PFContent from "@patternfly/patternfly/components/Content/content.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/SpinnerButton";
@ -39,7 +46,7 @@ export class OAuthSourceViewPage extends Page {
source?: OAuthSource;
static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent];
return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal];
}
constructor() {

View file

@ -5,6 +5,13 @@ import { until } from "lit-html/directives/until";
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 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/SpinnerButton";
@ -40,7 +47,7 @@ export class SAMLSourceViewPage extends Page {
source?: SAMLSource;
static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent];
return [PFBase, PFPage, PFFlex, PFDisplay, PFGallery, PFContent, PFCard, PFDescriptionList, PFSizing, AKGlobal];
}
constructor() {

View file

@ -2,13 +2,9 @@ import { css, CSSResult, customElement, html, LitElement, property, TemplateResu
import { Source, SourcesApi } from "authentik-api";
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/SpinnerButton";
import { SpinnerSize } from "../../elements/Spinner";
import "../../elements/EmptyState";
import "./LDAPSourceViewPage";
import "./OAuthSourceViewPage";
@ -34,24 +30,16 @@ export class SourceViewPage extends LitElement {
source?: Source;
static get styles(): CSSResult[] {
return [PFPage, PFGallery, PFContent].concat(css`
return [css`
* {
height: 100%;
}
`);
`];
}
render(): TemplateResult {
if (!this.source) {
return html`<div class="pf-c-empty-state pf-m-full-height">
<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>`;
return html`<ak-empty-state ?loading=${true} ?fullHeight=${true}></ak-empty-state>`;
}
switch (this.source?.objectType) {
case "ldap":