From 9c73e9cf4eb85e30fdf1194251f34743e02f7477 Mon Sep 17 00:00:00 2001 From: Jens Langhammer Date: Sat, 27 Feb 2021 17:26:20 +0100 Subject: [PATCH] web: fix colourstyles not being included in common_styles # Conflicts: # authentik/events/geo.py # web/src/elements/buttons/TokenCopyButton.ts --- web/src/common/styles.ts | 28 ++++++++++++++++++--- web/src/constants.ts | 23 ----------------- web/src/elements/buttons/SpinnerButton.ts | 3 ++- web/src/elements/buttons/TokenCopyButton.ts | 3 ++- web/src/elements/cards/AggregateCard.ts | 3 +-- web/src/elements/router/RouterOutlet.ts | 2 -- 6 files changed, 30 insertions(+), 32 deletions(-) diff --git a/web/src/common/styles.ts b/web/src/common/styles.ts index 41ec8d363..0480da4a6 100644 --- a/web/src/common/styles.ts +++ b/web/src/common/styles.ts @@ -1,3 +1,4 @@ +import { css, CSSResult } from "lit-element"; // @ts-ignore import PF from "@patternfly/patternfly/patternfly.css"; // @ts-ignore @@ -6,10 +7,31 @@ import PFAddons from "@patternfly/patternfly/patternfly-addons.css"; import FA from "@fortawesome/fontawesome-free/css/fontawesome.css"; // @ts-ignore import AKGlobal from "../authentik.css"; -import { CSSResult } from "lit-element"; // @ts-ignore import CodeMirrorStyle from "codemirror/lib/codemirror.css"; // @ts-ignore import CodeMirrorTheme from "codemirror/theme/monokai.css"; - -export const COMMON_STYLES: CSSResult[] = [PF, PFAddons, FA, AKGlobal, CodeMirrorStyle, CodeMirrorTheme]; +export const ColorStyles = css` + .pf-m-success { + color: var(--pf-global--success-color--100); + } + .pf-c-button.pf-m-success { + color: var(--pf-c-button--m-primary--Color); + background-color: var(--pf-global--success-color--100); + } + .pf-m-warning { + color: var(--pf-global--warning-color--100); + } + .pf-c-button.pf-m-warning { + color: var(--pf-c-button--m-primary--Color); + background-color: var(--pf-global--warning-color--100); + } + .pf-m-danger { + color: var(--pf-global--danger-color--100); + } + .pf-c-button.pf-m-danger { + color: var(--pf-c-button--m-primary--Color); + background-color: var(--pf-global--danger-color--100); + } +`; +export const COMMON_STYLES: CSSResult[] = [PF, PFAddons, FA, AKGlobal, CodeMirrorStyle, CodeMirrorTheme, ColorStyles]; diff --git a/web/src/constants.ts b/web/src/constants.ts index 73871e963..f91ede3be 100644 --- a/web/src/constants.ts +++ b/web/src/constants.ts @@ -5,27 +5,4 @@ export const SUCCESS_CLASS = "pf-m-success"; export const ERROR_CLASS = "pf-m-danger"; export const PROGRESS_CLASS = "pf-m-in-progress"; export const CURRENT_CLASS = "pf-m-current"; -export const ColorStyles = css` - .pf-m-success { - color: var(--pf-global--success-color--100); - } - .pf-c-button.pf-m-success { - color: var(--pf-c-button--m-primary--Color); - background-color: var(--pf-global--success-color--100); - } - .pf-m-warning { - color: var(--pf-global--warning-color--100); - } - .pf-c-button.pf-m-warning { - color: var(--pf-c-button--m-primary--Color); - background-color: var(--pf-global--warning-color--100); - } - .pf-m-danger { - color: var(--pf-global--danger-color--100); - } - .pf-c-button.pf-m-danger { - color: var(--pf-c-button--m-primary--Color); - background-color: var(--pf-global--danger-color--100); - } -`; export const VERSION = "2021.2.5-stable"; diff --git a/web/src/elements/buttons/SpinnerButton.ts b/web/src/elements/buttons/SpinnerButton.ts index 99aca32fa..206aa9442 100644 --- a/web/src/elements/buttons/SpinnerButton.ts +++ b/web/src/elements/buttons/SpinnerButton.ts @@ -5,7 +5,8 @@ import GlobalsStyle from "@patternfly/patternfly/base/patternfly-globals.css"; import ButtonStyle from "@patternfly/patternfly/components/Button/button.css"; // @ts-ignore import SpinnerStyle from "@patternfly/patternfly/components/Spinner/spinner.css"; -import { ColorStyles, PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants"; +import { PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants"; +import { ColorStyles } from "../../common/styles"; @customElement("ak-spinner-button") export class SpinnerButton extends LitElement { diff --git a/web/src/elements/buttons/TokenCopyButton.ts b/web/src/elements/buttons/TokenCopyButton.ts index 5b68818e0..46c7880b0 100644 --- a/web/src/elements/buttons/TokenCopyButton.ts +++ b/web/src/elements/buttons/TokenCopyButton.ts @@ -4,7 +4,8 @@ import GlobalsStyle from "@patternfly/patternfly/base/patternfly-globals.css"; // @ts-ignore import ButtonStyle from "@patternfly/patternfly/components/Button/button.css"; import { tokenByIdentifier } from "../../api/Tokens"; -import { ColorStyles, ERROR_CLASS, PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants"; +import { ERROR_CLASS, PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants"; +import { ColorStyles } from "../../common/styles"; @customElement("ak-token-copy-button") export class TokenCopyButton extends LitElement { diff --git a/web/src/elements/cards/AggregateCard.ts b/web/src/elements/cards/AggregateCard.ts index 4f21daf5f..101114df0 100644 --- a/web/src/elements/cards/AggregateCard.ts +++ b/web/src/elements/cards/AggregateCard.ts @@ -2,7 +2,6 @@ import { gettext } from "django"; import { css, CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element"; import { ifDefined } from "lit-html/directives/if-defined"; import { COMMON_STYLES } from "../../common/styles"; -import { ColorStyles } from "../../constants"; @customElement("ak-aggregate-card") export class AggregateCard extends LitElement { @@ -25,7 +24,7 @@ export class AggregateCard extends LitElement { text-align: center; color: var(--pf-global--Color--100); } - `, ColorStyles]); + `]); } renderInner(): TemplateResult { diff --git a/web/src/elements/router/RouterOutlet.ts b/web/src/elements/router/RouterOutlet.ts index e817ab306..5ce82f2f6 100644 --- a/web/src/elements/router/RouterOutlet.ts +++ b/web/src/elements/router/RouterOutlet.ts @@ -3,7 +3,6 @@ import { css, CSSResult, customElement, html, LitElement, property, TemplateResu import CodeMirrorStyle from "codemirror/lib/codemirror.css"; // @ts-ignore import CodeMirrorTheme from "codemirror/theme/monokai.css"; -import { ColorStyles } from "../../constants"; import { COMMON_STYLES } from "../../common/styles"; import { Route } from "./Route"; import { ROUTES } from "../../routes"; @@ -23,7 +22,6 @@ export class RouterOutlet extends LitElement { return [ CodeMirrorStyle, CodeMirrorTheme, - ColorStyles, css` :host { height: 100vh;