From f28bfdaeb96420e898b3e6df8dd4e4d40b9fbb98 Mon Sep 17 00:00:00 2001
From: Jens Langhammer <jens.langhammer@beryju.org>
Date: Thu, 5 Aug 2021 22:04:45 +0200
Subject: [PATCH] web: fix minor styling issues

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
---
 web/src/authentik.css                     | 4 ++++
 web/src/elements/buttons/ActionButton.ts  | 1 +
 web/src/elements/buttons/SpinnerButton.ts | 3 ++-
 web/src/pages/events/RuleListPage.ts      | 6 ++----
 web/src/pages/events/TransportListPage.ts | 1 +
 5 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/web/src/authentik.css b/web/src/authentik.css
index 82ad6f830..118c82c5c 100644
--- a/web/src/authentik.css
+++ b/web/src/authentik.css
@@ -268,6 +268,10 @@ body {
     .pf-c-toggle-group__button:not(.pf-m-selected) {
         background-color: var(--ak-dark-background-light) !important;
     }
+    .pf-c-toggle-group__button.pf-m-selected {
+        color: var(--ak-dark-foreground) !important;
+        background-color: var(--pf-global--primary-color--100) !important;
+    }
     /* inputs help text */
     .pf-c-form__helper-text:not(.pf-m-error) {
         color: var(--ak-dark-foreground);
diff --git a/web/src/elements/buttons/ActionButton.ts b/web/src/elements/buttons/ActionButton.ts
index c17d381a1..2424f8d09 100644
--- a/web/src/elements/buttons/ActionButton.ts
+++ b/web/src/elements/buttons/ActionButton.ts
@@ -5,6 +5,7 @@ import { MessageLevel } from "../messages/Message";
 
 @customElement("ak-action-button")
 export class ActionButton extends SpinnerButton {
+
     @property({ attribute: false })
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     apiRequest: () => Promise<any> = () => {
diff --git a/web/src/elements/buttons/SpinnerButton.ts b/web/src/elements/buttons/SpinnerButton.ts
index ab1e8ad9e..3db155aed 100644
--- a/web/src/elements/buttons/SpinnerButton.ts
+++ b/web/src/elements/buttons/SpinnerButton.ts
@@ -16,6 +16,7 @@ import { ERROR_CLASS, PRIMARY_CLASS, PROGRESS_CLASS, SUCCESS_CLASS } from "../..
 
 @customElement("ak-spinner-button")
 export class SpinnerButton extends LitElement {
+
     @property({ type: Boolean })
     isRunning = false;
 
@@ -79,7 +80,7 @@ export class SpinnerButton extends LitElement {
             }}
         >
             ${this.isRunning
-                ? html` <span class="pf-c-button__progress">
+                ? html`<span class="pf-c-button__progress">
                       <ak-spinner size=${PFSize.Medium}></ak-spinner>
                   </span>`
                 : ""}
diff --git a/web/src/pages/events/RuleListPage.ts b/web/src/pages/events/RuleListPage.ts
index d06e276c0..f21c8bba7 100644
--- a/web/src/pages/events/RuleListPage.ts
+++ b/web/src/pages/events/RuleListPage.ts
@@ -80,7 +80,7 @@ export class RuleListPage extends TablePage<NotificationRule> {
             html`${item.name}`,
             html`${item.severity}`,
             html`${item.groupObj?.name || t`None (rule disabled)`}`,
-            html` <ak-forms-modal>
+            html`<ak-forms-modal>
                 <span slot="submit"> ${t`Update`} </span>
                 <span slot="header"> ${t`Update Notification Rule`} </span>
                 <ak-event-rule-form slot="form" .instancePk=${item.pk}> </ak-event-rule-form>
@@ -112,8 +112,6 @@ export class RuleListPage extends TablePage<NotificationRule> {
                     </p>
                     <ak-bound-policies-list .target=${item.pk}> </ak-bound-policies-list>
                 </div>
-            </td>
-            <td></td>
-            <td></td>`;
+            </td>`;
     }
 }
diff --git a/web/src/pages/events/TransportListPage.ts b/web/src/pages/events/TransportListPage.ts
index 2781e8d35..7fbdb8486 100644
--- a/web/src/pages/events/TransportListPage.ts
+++ b/web/src/pages/events/TransportListPage.ts
@@ -87,6 +87,7 @@ export class TransportListPage extends TablePage<NotificationTransport> {
                     </button>
                 </ak-forms-modal>
                 <ak-action-button
+                    class="pf-m-plain"
                     .apiRequest=${() => {
                     return new EventsApi(DEFAULT_CONFIG).eventsTransportsTestCreate({
                         uuid: item.pk || "",