claude_settings/plans/cheerful-churning-hejlsberg.md at bac010a73322afa304d207695315bd320a9b4bf4

Files

root 4277b10f55 Kanbanize Kartenerstellung dokumentiert: Arrival-Rule-Workaround, Board-Struktur

- Neuer Abschnitt "Karten erstellen (Aufgaben-Workflow)" mit Workflow A/B
- Bekannte Struktur erweitert: Workflows, Columns, Lanes für Board 1
- Pitfalls ergänzt: Arrival Rule, Parent-Link API, linkedCards read-only
- Settings und Plans aktualisiert

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

2026-02-05 13:09:09 +01:00

5.5 KiB

Raw Blame History

Status

~~Flaw 1 (Service Unavailable)~~: ERLEDIGT — Ursache war das Files-Plugin, vom User deaktiviert
Flaw 2 (Theme Layout): Offen — CSS-Fix war unvollständig, PatternFly-Overrides fehlen

Problem-Analyse (aus 4 Screenshots)

Screenshot 1 — Username-Eingabe

Logo "egonetix / IT Solutions" + "Log in" Titel LINKS neben der Card, kaum lesbar
Card enthält nur: Username-Feld, Sign In Button, Passkey-Hint

"Passkey Login" Text LINKS, kaum lesbar
Card enthält nur: Username, "Sign in with Passkey" Button, "Try Another Way"

"Select login method" Text LINKS, kaum lesbar
Card enthält: Username, Passkey-Button, Password-Button

Screenshot 4 — Passwort-Eingabe

Mehrere Cards übereinandergestapelt!
Eine Card zeigt "robert.wiegand", eine andere das Passwort-Feld
"Try Another Way" außerhalb beider Cards

Root Cause

PatternFly v5 .pf-v5-c-login__main nutzt intern CSS Grid mit grid-template-areas. Das egonetix CSS setzt display: flex OHNE !important, wodurch PatternFly's Grid gewinnt. Die Kinder (header, body, footer) werden in separate Grid-Areas platziert statt als Flex-Column innerhalb einer Card.

Zusätzlich fehlen Grid-Overrides für .pf-v5-c-login__container und PatternFly-Transparenz-Regeln für Footer und innere Wrapper.

Betroffene Datei

/home/icke/keycloak/themes/egonetix/login/resources/css/egonetix.css auf srvdocker02 (10.0.0.48)

Fix: CSS-Änderungen

Änderung 1 — Layout-Section: PatternFly-Grid killen

Ersetze den bestehenden Layout-Block:

/* === Layout === */
.pf-v5-c-login,
.login-pf {
    background: transparent !important;
    min-height: 100vh;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pf-v5-c-login__container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    grid-template-columns: unset !important;
    grid-template-rows: unset !important;
}

Änderung 2 — Card-Section: `!important` auf alle Display/Grid-Properties

Ersetze den Card-Block:

/* === Card (Glassmorphism) === */
.pf-v5-c-login__main {
    background: var(--ego-card-background) !important;
    backdrop-filter: var(--ego-card-backdrop) !important;
    -webkit-backdrop-filter: var(--ego-card-backdrop) !important;
    border-radius: var(--ego-border-radius) !important;
    box-shadow: var(--ego-card-shadow) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    padding: var(--ego-card-padding) !important;
    width: var(--ego-card-width) !important;
    max-width: 90vw !important;
    margin: 0 auto !important;
    /* Kill PatternFly grid, force flex column */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    grid-template-columns: unset !important;
    grid-template-rows: unset !important;
    grid-template-areas: unset !important;
}

Änderung 3 — Children-Section: Footer + Grid-Area-Overrides hinzufügen

Ersetze den Children-Block (.pf-v5-c-login__main-footer und grid-column/grid-row fehlten):

/* === Children transparent (no double card) === */
.pf-v5-c-login__main-header,
.pf-v5-c-login__main-body,
.pf-v5-c-login__main-footer,
#kc-form,
#kc-content-wrapper,
#kc-form-wrapper,
#kc-header-wrapper {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    width: 100% !important;
    border-radius: 0 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    /* Kill PatternFly grid-area assignments */
    grid-column: unset !important;
    grid-row: unset !important;
}

Änderung 4 — Neue Regel: PatternFly-interne Card-Elemente transparent

Hinzufügen nach Children-Block:

/* === Kill PatternFly card styling inside login === */
.pf-v5-c-login__main .pf-v5-c-card,
.pf-v5-c-login__main .pf-v5-c-card__body,
.pf-v5-c-login__main fieldset,
.pf-v5-c-login__main legend {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
}

Änderung 5 — Page-Title-Regel erweitern

Ersetze den Title-Block mit breiterer Abdeckung:

/* === Page Title === */
#kc-page-title,
.pf-v5-c-login__main-header h1,
.pf-v5-c-login__main-header-desc,
h1#kc-page-title,
h1.pf-v5-c-title {
    text-align: center !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--ego-text-primary) !important;
    margin: 0 0 var(--ego-spacing-lg) 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

Deployment

# 1. CSS lokal editieren und per SCP deployen
scp egonetix.css root@10.0.0.48:/home/icke/keycloak/themes/egonetix/login/resources/css/egonetix.css

# 2. Keycloak neustarten (Theme-Cache leeren)
ssh root@10.0.0.48 'docker restart keycloak'

Verifikation

Alle 4 Seiten im Inkognito-Fenster testen:

Seite	Was prüfen
Username-Eingabe	Logo + "Log in" INNERHALB der Card, zentriert
Passkey Login	"Passkey Login" Titel INNERHALB der Card
Login-Methode wählen	"Select login method" Titel INNERHALB der Card
Passwort-Eingabe	NUR EINE Card, Passwort-Feld darin, kein Stacking
Responsive (Handy)	Card füllt Bildschirm, kein Overflow

5.5 KiB Raw Blame History

Plan: Keycloak Theme CSS Fix — Alle Login-Seiten