8000 Align Keycloak v3 login pages with PatternFly 6 by mabartos · Pull Request #55115 · keycloak/keycloak · GitHub
[go: up one dir, main page]

Skip to content

Align Keycloak v3 login pages with PatternFly 6 - #55115

Open
mabartos wants to merge 2 commits into
keycloak:mainfrom
mabartos:KC-55114
Open

mabartos wants to merge 2 commits into
keycloak:mainfrom
mabartos:KC-55114

Conversation

@mabartos
@mabartos mabartos commented Nov 12, 2026 •
Copy link
Copy Markdown
Member

For instance, new OTP form (instead of "unnamed", there's the localized "Default"):
Screenshot From 2026-11-12 15-16-29

@edewit @kathari00 @vaceksimon Please review

Closes keycloak#55114

Signed-off-by: kathari00 <katharina.eiserfey1@gmail.com>
Signed-off-by: Martin Bartoš <mabartos@redhat.com>
@mabartos
mabartos requested review from a team as code owners November 12, 2026 14:39
Copilot AI balanced review requested due to automatic review settings November 12, 2026 14:39
@mabartos
mabartos marked this pull request as draft November 12, 2026 14:40
Copilot AI left a comment
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🔵 Needs a closer look

The snapshot lacks the bundled PatternFly 6 CSS, so browser validation with the built theme is needed to confirm OTP hit targets and selected states, clipboard expansion styling, and responsive recovery-code buttons.

No open issues 🎉

What changed in this PR

Aligns Keycloak v3 login pages with PatternFly 6 to address the background, OTP selector, and button styling issues reported in #55114.

Changes:

  • Replaces OTP tiles with shared radio-button cards and adds a localized “Default” label for unnamed credentials.
  • Adjusts backgrounds, buttons, alerts, clipboard controls, and supporting layouts.
  • Updates UI page selectors and OTP tests, including coverage that user-provided credential labels remain unchanged.
File Description
themes/​src/​main/​resources/​theme/​keycloak.v3/​login/​theme.properties Updates PatternFly classes and adds OTP card styling mappings.
themes/​src/​main/​resources/​theme/​keycloak.v3/​login/​resources/​css/​styles.css Adjusts background sizing and social-button text wrapping.
themes/​src/​main/​resources/​theme/​base/​login/​otp-credential.ftl Adds shared OTP selection cards with native radio inputs.
themes/​src/​main/​resources/​theme/​base/​login/​messages/​messages_en.properties Adds OTP headings and the default credential label.
themes/​src/​main/​resources/​theme/​base/​login/​login-reset-otp.ftl Uses shared OTP cards and standard action grouping.
themes/​src/​main/​resources/​theme/​base/​login/​login-recovery-authn-code-config.ftl Uses default button widths for recovery-code actions.
themes/​src/​main/​resources/​theme/​base/​login/​login-otp.ftl Adopts OTP cards and removes custom selection JavaScript.
themes/​src/​main/​resources/​theme/​base/​login/​login-oid4vp.ftl Adjusts expired-code messaging layout and link wrapping.
themes/​src/​main/​resources/​theme/​base/​login/​frontchannel-logout.ftl Applies form, list, and full-width button styling.
themes/​src/​main/​resources/​theme/​base/​login/​field.ftl Repositions password errors and revises clipboard markup.
themes/​src/​main/​resources/​theme/​base/​login/​delete-account-confirm.ftl Uses form-specific alert styling with a fallback.
testsuite/​integration-arquillian/​tests/​base/​src/​test/​java/​org/​keycloak/​testsuite/​forms/​LevelOfAssuranceFlowTest.java Updates the expected unnamed OTP label.
testsuite/​integration-arquillian/​tests/​base/​src/​test/​java/​org/​keycloak/​testsuite/​forms/​BrowserFlowTest.java Updates label expectations and tests literal user-label rendering.
testsuite/​integration-arquillian/​tests/​base/​src/​main/​java/​org/​keycloak/​testsuite/​pages/​ResetOtpPage.java Selects OTP credentials through radio labels.
testsuite/​integration-arquillian/​tests/​base/​src/​main/​java/​org/​keycloak/​testsuite/​pages/​LoginTotpPage.java Updates selectors for radio-based OTP cards.
test-framework/​ui/​src/​main/​java/​org/​keycloak/​testframework/​ui/​page/​LoginTotpPage.java Updates framework selectors for the new OTP markup.
services/​src/​main/​java/​org/​keycloak/​forms/​login/​freemarker/​model/​TotpLoginBean.java Preserves raw credential labels for template-level fallback handling.
services/​src/​main/​java/​org/​keycloak/​authentication/​authenticators/​browser/​OTPFormAuthenticator.java Removes the hard-coded unnamed credential label constant.

Review effort: Balanced

edewit
edewit previously approved these changes Nov 12, 2026
…atting

Signed-off-by: Martin Bartoš <mabartos@redhat.com>
@mabartos
mabartos requested a review from edewit November 12, 2026 15:22
@mabartos
mabartos marked this pull request as ready for review November 12, 2026 15:23
Copilot AI balanced review requested due to automatic review settings November 12, 2026 15:23
Copilot AI left a comment
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🔵 Needs a closer look

The selectable-card and clipboard markup depends on PatternFly 6 CSS missing from this checkout, leaving keyboard selection, focus indicators, and responsive layouts pending browser validation.

No open issues 🎉

Review effort: Balanced

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Broken background and styling issues after post-upgrade version

3 participants

0