Added theme descriptions, modified messages_en

Descriptions and the title were added to messages_en.properties.
They are displayed to the user in ThemeSettings.tsx via an <EmptyStateBody> class, mimicking the ACR to LoA Mapping styling in GeneralTab.tsx.

Closes #45909

Signed-off-by: Benjamin DeWeese <bdeweesevans@gmail.com>
This commit is contained in:
Benjamin DeWeese 2026-01-30 17:27:14 -05:00
parent 13cf35ded3
commit 4ec9fdc362
2 changed files with 21 additions and 1 deletions

View file

@ -3169,6 +3169,10 @@ generatedCodeTextArea=Generated code textarea
selectAuthScopes=Select authorization scopes
selectResource=Select resource
selectClients=Select clients
themesDescriptionsTitle=Theme descriptions
themesDescriptionKeycloak=Keycloak: High contrast, sharp, utilitarian, basic. (Default for Email)
themesDescriptionKeycloakV2=Keycloak.v2: Cleaner and more modern, v2 supports automatic light/dark mode switching. (Default for Login and Admin)
themesDescriptionKeycloakV3=Keycloak.v3: Refined, v3 is more cohesive and dynamic. (Default for Account)
selectLoginTheme=Select login theme
selectAccountTheme=Select account theme
selectAdminTheme=Select admin theme

View file

@ -1,6 +1,12 @@
import type RealmRepresentation from "@keycloak/keycloak-admin-client/lib/defs/realmRepresentation";
import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { ActionGroup, Button, PageSection } from "@patternfly/react-core";
import {
ActionGroup,
Button,
EmptyStateBody,
FormGroup,
PageSection,
} from "@patternfly/react-core";
import { useEffect } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
@ -47,6 +53,16 @@ export const ThemeSettingsTab = ({ realm, save }: ThemeSettingsTabProps) => {
defaultValue="true"
stringify
/>
<FormGroup
label={t("themesDescriptionsTitle")}
fieldId="themes-description"
>
<EmptyStateBody className="pf-v5-u-font-size-sm pf-v5-u-color-200">
<p>{t("themesDescriptionKeycloak")}</p>
<p>{t("themesDescriptionKeycloakV2")}</p>
<p>{t("themesDescriptionKeycloakV3")}</p>
</EmptyStateBody>
</FormGroup>
<SelectControl
id="kc-login-theme"
name="loginTheme"