diff --git a/web/src/flow/FlowExecutor.ts b/web/src/flow/FlowExecutor.ts index 638e0c3bdb..3f9472e619 100644 --- a/web/src/flow/FlowExecutor.ts +++ b/web/src/flow/FlowExecutor.ts @@ -1,3 +1,4 @@ +import { ensureCSSStyleSheet } from "@goauthentik/authentik/elements/utils/ensureCSSStyleSheet"; import { DEFAULT_CONFIG } from "@goauthentik/common/api/config"; import { EVENT_FLOW_ADVANCE, @@ -76,6 +77,9 @@ export class FlowExecutor extends Interface implements StageHost { @state() flowInfo?: ContextualFlowInfo; + @state() + frameMode = window !== window.top; + ws: WebsocketClient; static get styles(): CSSResult[] { @@ -140,6 +144,17 @@ export class FlowExecutor extends Interface implements StageHost { :host([theme="dark"]) .pf-c-login.sidebar_right .pf-c-list { color: var(--ak-dark-foreground); } + /* frame design */ + .pf-c-login.frame { + padding: 0; + min-height: initial !important; + } + .pf-c-login.frame .pf-c-login__footer { + flex-grow: 0; + } + .pf-c-login.frame .pf-c-login__footer .pf-c-list { + padding: 0; + } .pf-c-brand { padding-top: calc( var(--pf-c-login__main-footer-links--PaddingTop) + @@ -161,6 +176,19 @@ export class FlowExecutor extends Interface implements StageHost { constructor() { super(); + if (this.frameMode) { + // PatternFly sets html and body to 100% height, which we don't + // want in this case since the iframe should only take the space it needs + document.adoptedStyleSheets = [ + ...document.adoptedStyleSheets, + ensureCSSStyleSheet(css` + body, + html { + height: unset !important; + } + `), + ]; + } this.ws = new WebsocketClient(); if (window.location.search.includes("inspector")) { this.inspectorOpen = true; @@ -482,7 +510,26 @@ export class FlowExecutor extends Interface implements StageHost { } render(): TemplateResult { - return html` + if (this.frameMode) { + return html` + + `; + } + return html`
diff --git a/web/src/flow/stages/RedirectStage.ts b/web/src/flow/stages/RedirectStage.ts index 50e24d9bec..7ddeba7927 100644 --- a/web/src/flow/stages/RedirectStage.ts +++ b/web/src/flow/stages/RedirectStage.ts @@ -12,6 +12,7 @@ import PFTitle from "@patternfly/patternfly/components/Title/title.css"; import PFBase from "@patternfly/patternfly/patternfly-base.css"; import { FlowChallengeResponseRequest, RedirectChallenge } from "@goauthentik/api"; +import { globalAK } from "@goauthentik/authentik/common/global"; @customElement("ak-stage-redirect") export class RedirectStage extends BaseStage { @@ -49,8 +50,25 @@ export class RedirectStage extends BaseStage; readonly brand?: CurrentBrand;