web/flows: fix compatibility mode (#4910)

* fix compatibility mode

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* attach stylesheets to document instead of nothing, fix dark theme

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

---------

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens L
2023-03-12 22:19:03 +01:00
committed by GitHub
parent 94f22cffba
commit 56375d7245
4 changed files with 21 additions and 16 deletions

View File

@ -61,9 +61,13 @@ export class AKElement extends LitElement {
protected createRenderRoot(): ShadowRoot | Element {
const root = super.createRenderRoot() as ShadowRoot;
root.adoptedStyleSheets = [...root.adoptedStyleSheets, AKGlobal];
this._initTheme(root);
this._initCustomCSS(root);
let styleRoot: AdoptedStyleSheetsElement = root;
if ("ShadyDOM" in window) {
styleRoot = document;
}
styleRoot.adoptedStyleSheets = [...styleRoot.adoptedStyleSheets, AKGlobal];
this._initTheme(styleRoot);
this._initCustomCSS(styleRoot);
return root;
}
@ -83,7 +87,7 @@ export class AKElement extends LitElement {
this._applyTheme(root, await this.getTheme());
}
private async _initCustomCSS(root: ShadowRoot): Promise<void> {
private async _initCustomCSS(root: AdoptedStyleSheetsElement): Promise<void> {
const sheets = await fetchCustomCSS();
sheets.map((css) => {
if (css === "") {