libre.sh/keycloak-scim
3
0
Fork 0
Code Issues 15 Pull requests Releases Packages Activity Actions

added patternfly 5 update password (#26580)

Browse source 
Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
Erik Jan de Wit 2024-02-13 13:51:19 +01:00 committed by GitHub
parent a206fb8268
commit 56b0f9ec03
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 87 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

80
themes/src/main/resources/theme/keycloak.v2/login/login-update-password.ftl Executable file
View file

@ -0,0 +1,80 @@
<#import "pf-5-template.ftl" as layout>
<#import "password-commons.ftl" as passwordCommons>
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('password','password-confirm'); section>
<#if section = "header">
${msg("updatePasswordTitle")}
<#elseif section = "form">
<form id="kc-passwd-update-form" class="${properties.kcFormClass!}" action="${url.loginAction}" method="post">
<div class="${properties.kcFormGroupClass!}">
<label for="password-new" class="${properties.kcLabelClass!}">
<span class="pf-v5-c-form__label-text">
${msg("passwordNew")}
</span>
</label>
<div class="${properties.kcInputGroup!}">
<span class="${properties.kcInputClass!}">
<input type="password" id="password-new" name="password-new" autofocus autocomplete="new-password"
aria-invalid="<#if messagesPerField.existsError('password','password-confirm')>true</#if>"
/>
</span>
<button class="${properties.kcFormPasswordVisibilityButtonClass!}" type="button" aria-label="${msg('showPassword')}"
aria-controls="password-new" data-password-toggle
data-icon-show="${properties.kcFormPasswordVisibilityIconShow!}" data-icon-hide="${properties.kcFormPasswordVisibilityIconHide!}"
data-label-show="${msg('showPassword')}" data-label-hide="${msg('hidePassword')}">
<i class="${properties.kcFormPasswordVisibilityIconShow!}" aria-hidden="true"></i>
</button>
</div>
<#if messagesPerField.existsError('password')>
<span id="input-error-password" class="${properties.kcInputErrorMessageClass!}" aria-live="polite">
${kcSanitize(messagesPerField.get('password'))?no_esc}
</span>
</#if>
</div>
<div class="${properties.kcFormGroupClass!}">
<label for="password-confirm" class="${properties.kcLabelClass!}">
<span class="pf-v5-c-form__label-text">
${msg("passwordConfirm")}
</span>
</label>
<div class="${properties.kcInputGroup!}">
<span class="${properties.kcInputClass!}">
<input type="password" id="password-confirm" name="password-confirm"
autocomplete="new-password"
aria-invalid="<#if messagesPerField.existsError('password-confirm')>true</#if>"
/>
</span>
<button class="${properties.kcFormPasswordVisibilityButtonClass!}" type="button" aria-label="${msg('showPassword')}"
aria-controls="password-confirm" data-password-toggle
data-icon-show="${properties.kcFormPasswordVisibilityIconShow!}" data-icon-hide="${properties.kcFormPasswordVisibilityIconHide!}"
data-label-show="${msg('showPassword')}" data-label-hide="${msg('hidePassword')}">
<i class="${properties.kcFormPasswordVisibilityIconShow!}" aria-hidden="true"></i>
</button>
</div>
<#if messagesPerField.existsError('password-confirm')>
<span id="input-error-password-confirm" class="${properties.kcInputErrorMessageClass!}" aria-live="polite">
${kcSanitize(messagesPerField.get('password-confirm'))?no_esc}
</span>
</#if>
</div>
<div class="${properties.kcFormGroupClass!}">
<@passwordCommons.logoutOtherSessions/>
</div>
<div id="kc-form-buttons" class="${properties.kcFormButtonsClass!} pf-m-action">
<div class="pf-v5-c-form__actions">
<#if isAppInitiatedAction??>
<input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}" />
<button class="${properties.kcButtonClass!} ${properties.kcButtonDefaultClass!} ${properties.kcButtonLargeClass!}" type="submit" name="cancel-aia" value="true" />${msg("doCancel")}</button>
<#else>
<input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}" />
</#if>
</div>
</div>
</form>
<script type="module" src="${url.resourcesPath}/js/passwordVisibility.js"></script>
</#if>
</@layout.registrationLayout>

2
themes/src/main/resources/theme/keycloak.v2/login/login.ftl
View file

@ -6,7 +6,7 @@
<div id="kc-form">
<div id="kc-form-wrapper">
<#if realm.password>
<form id="kc-form-login" class="pf-v5-c-form" onsubmit="login.disabled = true; return true;" action="${url.loginAction}" method="post">
<form id="kc-form-login" class="${properties.kcFormClass!} onsubmit="login.disabled = true; return true;" action="${url.loginAction}" method="post">
<#if !usernameHidden??>
<div class="${properties.kcFormGroupClass!}">
<label for="username" class="${properties.kcLabelClass!}"><#if !realm.loginWithEmailAllowed>${msg("username")}<#elseif !realm.registrationEmailAsUsername>${msg("usernameOrEmail")}<#else>${msg("email")}</#if></label>

6
themes/src/main/resources/theme/keycloak.v2/login/theme.properties
View file

@ -11,6 +11,8 @@ kcInputClass=pf-v5-c-form-control
kcInputGroup=pf-v5-c-input-group
kcInputErrorMessageClass=pf-v5-c-helper-text__item pf-m-error pf-v5-c-form__label-required kc-feedback-text
kcAlertClass=pf-v5-c-alert pf-m-inline
kcAlertTitleClass=pf-v5-c-alert__title
kcFormPasswordVisibilityButtonClass=pf-v5-c-button pf-m-control
kcButtonClass=pf-v5-c-button
@ -20,3 +22,7 @@ kcFormSocialAccountListItmeClass=pf-v5-c-login__main-footer-links-item
kcFormSocialAccountListButtonClass=pf-v5-c-login__main-footer-links-item-link
kcLogoIdP-linkedin-openid-connect=fa fa-linkedin
kcLoginClass=pf-v5-c-login__main
kcFormClass=pf-v5-c-form
kcFormCardClass=card-pf