web/elements: fix pagination page button colours in dark mode

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens Langhammer 2023-01-11 00:38:23 +01:00
parent b424c5dd27
commit d6f5b8e421
No known key found for this signature in database

View file

@ -2,7 +2,7 @@ import { AKElement } from "@goauthentik/elements/Base";
import { t } from "@lingui/macro"; import { t } from "@lingui/macro";
import { CSSResult, TemplateResult, html } from "lit"; import { CSSResult, TemplateResult, css, html } from "lit";
import { customElement, property } from "lit/decorators.js"; import { customElement, property } from "lit/decorators.js";
import AKGlobal from "@goauthentik/common/styles/authentik.css"; import AKGlobal from "@goauthentik/common/styles/authentik.css";
@ -33,7 +33,23 @@ export class TablePagination extends AKElement {
}; };
static get styles(): CSSResult[] { static get styles(): CSSResult[] {
return [PFBase, PFButton, PFPagination, AKGlobal]; return [
PFBase,
PFButton,
PFPagination,
AKGlobal,
css`
@media (prefers-color-scheme: dark) {
.pf-c-pagination__nav-control .pf-c-button {
color: var(--pf-c-button--m-plain--disabled--Color);
--pf-c-button--disabled--Color: var(--pf-c-button--m-plain--Color);
}
.pf-c-pagination__nav-control .pf-c-button:disabled {
color: var(--pf-c-button--disabled--Color);
}
}
`,
];
} }
render(): TemplateResult { render(): TemplateResult {