some more ui fixes (#32661)
towards: #32522 Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
parent
a14548a7a2
commit
927a02ec5d
14 changed files with 76 additions and 13 deletions
|
@ -5,12 +5,12 @@
|
|||
</div>
|
||||
</#macro>
|
||||
|
||||
<#macro button id name label class="kcButtonPrimaryClass">
|
||||
<button class="${properties[class]}" name="${name}" id="${id}" type="submit">${msg(label)}</button>
|
||||
<#macro button id name label class=["kcButtonPrimaryClass"]>
|
||||
<button class="<#list class as c>${properties[c]} </#list>" name="${name}" id="${id}" type="submit">${msg(label)}</button>
|
||||
</#macro>
|
||||
|
||||
<#macro loginButton>
|
||||
<@buttons.actionGroup>
|
||||
<@buttons.button id="kc-login" name="login" label="doLogIn"/>
|
||||
<@buttons.button id="kc-login" name="login" label="doLogIn" class=["kcButtonPrimaryClass", "kcButtonBlockClass"] />
|
||||
</@buttons.actionGroup>
|
||||
</#macro>
|
|
@ -2,6 +2,7 @@
|
|||
<#import "field.ftl" as field>
|
||||
<#import "password-commons.ftl" as passwordCommons>
|
||||
<@layout.registrationLayout displayRequiredFields=false displayMessage=!messagesPerField.existsError('totp','userLabel'); section>
|
||||
<!-- template: login-config-totp.ftl -->
|
||||
|
||||
<#if section = "header">
|
||||
${msg("loginTotpTitle")}
|
||||
|
|
31
themes/src/main/resources/theme/keycloak.v2/login/login-password.ftl
Executable file
31
themes/src/main/resources/theme/keycloak.v2/login/login-password.ftl
Executable file
|
@ -0,0 +1,31 @@
|
|||
<#import "template.ftl" as layout>
|
||||
<#import "field.ftl" as field>
|
||||
<#import "buttons.ftl" as buttons>
|
||||
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('password'); section>
|
||||
<!-- template: login-password.ftl -->
|
||||
<#if section = "header">
|
||||
${msg("doLogIn")}
|
||||
<#elseif section = "form">
|
||||
<div id="kc-form">
|
||||
<div id="kc-form-wrapper">
|
||||
<form id="kc-form-login" class="${properties.kcFormClass!}" onsubmit="login.disabled = true; return true;" action="${url.loginAction}" method="post">
|
||||
<@field.password name="password" label=msg("password")/>
|
||||
|
||||
<div class="${properties.kcFormGroupClass!} ${properties.kcFormSettingClass!}">
|
||||
<div id="kc-form-options">
|
||||
<div class="${properties.kcFormOptionsWrapperClass!}">
|
||||
<#if realm.resetPasswordAllowed>
|
||||
<span><a tabindex="5"
|
||||
href="${url.loginResetCredentialsUrl}">${msg("doForgotPassword")}</a></span>
|
||||
</#if>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<@buttons.loginButton />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</#if>
|
||||
|
||||
</@layout.registrationLayout>
|
|
@ -1,7 +1,7 @@
|
|||
<#import "template.ftl" as layout>
|
||||
<#import "password-commons.ftl" as passwordCommons>
|
||||
<@layout.registrationLayout; section>
|
||||
|
||||
<!-- template: login-recovery-authn-code-config.ftl -->
|
||||
<#if section = "header">
|
||||
${msg("recovery-code-config-header")}
|
||||
<#elseif section = "form">
|
||||
|
@ -81,7 +81,8 @@
|
|||
/* copy recovery codes */
|
||||
function copyRecoveryCodes() {
|
||||
const tmpTextarea = document.createElement("textarea");
|
||||
document.body.appendChild(parseRecoveryCodeList());
|
||||
tmpTextarea.innerHTML = parseRecoveryCodeList();
|
||||
document.body.appendChild(tmpTextarea);
|
||||
tmpTextarea.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(tmpTextarea);
|
||||
|
@ -104,7 +105,7 @@
|
|||
|
||||
function parseRecoveryCodeList() {
|
||||
const recoveryCodes = document.getElementById("kc-recovery-codes-list").getElementsByTagName("li");
|
||||
const recoveryCodeList = "";
|
||||
let recoveryCodeList = "";
|
||||
|
||||
for (let i = 0; i < recoveryCodes.length; i++) {
|
||||
const recoveryCodeLiElement = recoveryCodes[i].innerText;
|
||||
|
|
|
@ -0,0 +1,15 @@
|
|||
<#import "template.ftl" as layout>
|
||||
<#import "field.ftl" as field>
|
||||
<#import "buttons.ftl" as buttons>
|
||||
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('recoveryCodeInput'); section>
|
||||
<!-- template: login-recovery-authn-code-input.ftl -->
|
||||
<#if section = "header">
|
||||
${msg("auth-recovery-code-header")}
|
||||
<#elseif section = "form">
|
||||
<form id="kc-recovery-code-login-form" class="${properties.kcFormClass!}" action="${url.loginAction}" method="post">
|
||||
<@field.input name="recoveryCodeInput" label=msg("auth-recovery-code-prompt", recoveryAuthnCodesInputBean.codeNumber?c) />
|
||||
|
||||
<@buttons.loginButton />
|
||||
</form>
|
||||
</#if>
|
||||
</@layout.registrationLayout>
|
|
@ -75,6 +75,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<script type="module" src="${url.resourcesPath}/js/passwordVisibility.js"></script>
|
||||
</#if>
|
||||
</@layout.registrationLayout>
|
||||
|
|
|
@ -2,6 +2,8 @@
|
|||
<#import "field.ftl" as field>
|
||||
<#import "buttons.ftl" as buttons>
|
||||
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('username') displayInfo=(realm.password && realm.registrationAllowed && !registrationDisabled??); section>
|
||||
<!-- template: login-username.ftl -->
|
||||
|
||||
<#if section = "header">
|
||||
${msg("loginAccountTitle")}
|
||||
<#elseif section = "form">
|
||||
|
|
|
@ -2,6 +2,8 @@
|
|||
<#import "field.ftl" as field>
|
||||
<#import "buttons.ftl" as buttons>
|
||||
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('username','password') displayInfo=realm.password && realm.registrationAllowed && !registrationDisabled??; section>
|
||||
<!-- template: login.ftl -->
|
||||
|
||||
<#if section = "header">
|
||||
${msg("loginAccountTitle")}
|
||||
<#elseif section = "form">
|
||||
|
@ -30,7 +32,6 @@
|
|||
</#if>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="${url.resourcesPath}/js/passwordVisibility.js"></script>
|
||||
<#elseif section = "info" >
|
||||
<#if realm.password && realm.registrationAllowed && !registrationDisabled??>
|
||||
<div id="kc-registration-container" class="${properties.kcLoginFooterBand!}">
|
||||
|
|
|
@ -3,6 +3,8 @@
|
|||
<#import "user-profile-commons.ftl" as userProfileCommons>
|
||||
<#import "register-commons.ftl" as registerCommons>
|
||||
<@layout.registrationLayout displayMessage=messagesPerField.exists('global') displayRequiredFields=true; section>
|
||||
<!-- template: register.ftl -->
|
||||
|
||||
<#if section = "header">
|
||||
<#if messageHeader??>
|
||||
${kcSanitize(msg("${messageHeader}"))?no_esc}
|
||||
|
@ -44,6 +46,5 @@
|
|||
</div>
|
||||
|
||||
</form>
|
||||
<script type="module" src="${url.resourcesPath}/js/passwordVisibility.js"></script>
|
||||
</#if>
|
||||
</@layout.registrationLayout>
|
||||
|
|
|
@ -80,3 +80,8 @@ div.kc-logo-text span {
|
|||
color: var(--pf-v5-global--Color--light-100) !important;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin-top: var(--pf-v5-global--spacer--sm);
|
||||
margin-bottom: var(--pf-v5-global--spacer--md);
|
||||
}
|
|
@ -1,5 +1,7 @@
|
|||
<#import "template.ftl" as layout>
|
||||
<@layout.registrationLayout displayInfo=false; section>
|
||||
<!-- template: select-authenticator.ftl -->
|
||||
|
||||
<#if section = "header" || section = "show-username">
|
||||
<#if section = "header">
|
||||
${msg("loginChooseAuthenticator")}
|
||||
|
|
|
@ -41,6 +41,7 @@
|
|||
<script src="${script}" type="text/javascript"></script>
|
||||
</#list>
|
||||
</#if>
|
||||
<script type="module" src="${url.resourcesPath}/js/passwordVisibility.js"></script>
|
||||
<script type="module">
|
||||
import { checkCookiesAndSetTimer } from "${url.resourcesPath}/js/authChecker.js";
|
||||
|
||||
|
@ -142,6 +143,7 @@
|
|||
<span class="kc-tooltip-text">${msg("restartLoginTooltip")}</span>
|
||||
</div>
|
||||
</a>
|
||||
<hr />
|
||||
</div>
|
||||
</#if>
|
||||
</#if>
|
||||
|
|
|
@ -25,11 +25,11 @@ kcCheckboxLabelClass=pf-v5-c-check__label
|
|||
kcCheckboxLabelRequiredClass=pf-v5-c-check__label-required
|
||||
|
||||
kcInputRequiredClass=pf-v5-c-form__label-required
|
||||
kcInputErrorMessageClass=pf-v5-c-helper-text__item pf-m-error kc-feedback-text
|
||||
kcInputErrorMessageClass=pf-v5-c-helper-text__item-text pf-m-error kc-feedback-text
|
||||
kcFormControlUtilClass=pf-v5-c-form-control__utilities
|
||||
kcInputErrorIconStatusClass=pf-v5-c-form-control__icon pf-m-status
|
||||
kcInputErrorIconClass=fas fa-exclamation-circle
|
||||
kcAlertClass=pf-v5-c-alert pf-m-inline
|
||||
kcAlertClass=pf-v5-c-alert pf-m-inline pf-v5-u-mb-md
|
||||
kcAlertIconClass=pf-v5-c-alert__icon
|
||||
kcAlertTitleClass=pf-v5-c-alert__title
|
||||
kcAlertDescriptionClass=pf-v5-c-alert__description
|
||||
|
@ -43,7 +43,8 @@ kcPanelMainBodyClass=pf-v5-c-panel__main-body
|
|||
kcListClass=pf-v5-c-list
|
||||
|
||||
kcButtonClass=pf-v5-c-button
|
||||
kcButtonPrimaryClass=pf-v5-c-button pf-m-primary pf-m-block
|
||||
kcButtonPrimaryClass=pf-v5-c-button pf-m-primary
|
||||
kcButtonBlockClass=pf-m-block
|
||||
kcButtonLinkClass=pf-v5-c-button pf-m-link
|
||||
kcCommonLogoIdP=pf-v5-c-login__main-footer-links-item
|
||||
kcFormSocialAccountListClass=pf-v5-c-login__main-footer-links
|
||||
|
@ -69,7 +70,7 @@ kcSelectAuthListItemDescriptionClass=pf-v5-c-data-list__cell pf-m-no-fill select
|
|||
|
||||
kcRecoveryCodesWarning=pf-v5-c-alert pf-m-warning pf-m-inline pf-v5-u-mb-md kc-recovery-codes-warning
|
||||
kcLogin=pf-v5-c-login
|
||||
kcLoginContent=pf-v5-c-login__container
|
||||
kcLoginContainer=pf-v5-c-login__container
|
||||
kcLoginMain=pf-v5-c-login__main
|
||||
kcLoginMainHeader=pf-v5-c-login__main-header
|
||||
kcLoginMainTitle=pf-v5-c-title pf-m-3xl
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
<#import "template.ftl" as layout>
|
||||
<@layout.registrationLayout displayInfo=(realm.registrationAllowed && !registrationDisabled??); section>
|
||||
<!-- template: webauthn-autthenticate.ftl -->
|
||||
|
||||
<#if section = "title">
|
||||
title
|
||||
<#elseif section = "header">
|
||||
|
|
Loading…
Reference in a new issue