Skip to content

Commit

Permalink
fix: aligned template with keycloak otp screen
Browse files Browse the repository at this point in the history
  • Loading branch information
TheSlimvReal committed Oct 18, 2023
1 parent 2e5b62d commit fd90265
Showing 1 changed file with 36 additions and 20 deletions.
56 changes: 36 additions & 20 deletions src/main/resources/theme-resources/templates/email-code-form.ftl
Original file line number Diff line number Diff line change
@@ -1,27 +1,43 @@
<#import "template.ftl" as layout>
<@layout.registrationLayout displayInfo=true; section>
<#if section = "title">
Access Code Form
<#elseif section = "header">
Access Code Form
<#elseif section = "form">
<p>Enter access code</p>
<form action="${url.loginAction}" class="${properties.kcFormClass!}" id="kc-u2f-login-form" method="post">
<@layout.registrationLayout displayMessage=!messagesPerField.existsError('emailCode'); section>
<#if section="header">
${msg("doLogIn")}
<#elseif section="form">
<form id="kc-otp-login-form" class="${properties.kcFormClass!}" action="${url.loginAction}"
method="post">

<div class="${properties.kcFormGroupClass!}">
<label for="emailCode">Access Code</label>
<input id="emailCode" name="emailCode" type="text" inputmode="numeric" pattern="[0-9]*"/>
</div>
<div class="${properties.kcLabelWrapperClass!}">
<label for="emailCode" class="${properties.kcLabelClass!}">${msg("loginOtpOneTime")}</label>
</div>

<div class="${properties.kcInputWrapperClass!}">
<input id="emailCode" name="emailCode" autocomplete="off" type="text" class="${properties.kcInputClass!}"
autofocus aria-invalid="<#if messagesPerField.existsError('emailCode')>true</#if>"/>

<input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}"
type="submit" value="${msg("doSubmit")}"/>
<#if messagesPerField.existsError('emailCode')>
<span id="input-error-otp-code" class="${properties.kcInputErrorMessageClass!}"
aria-live="polite">
${kcSanitize(messagesPerField.get('emailCode'))?no_esc}
</span>
</#if>
</div>
</div>

<input name="resend"
class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}"
type="submit" value="${msg("resendCode")}"/>
<div class="${properties.kcFormGroupClass!}">
<div id="kc-form-options" class="${properties.kcFormOptionsClass!}">
<div class="${properties.kcFormOptionsWrapperClass!}">
</div>
</div>

<input name="cancel"
class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}"
type="submit" value="${msg("doCancel")}"/>
<div id="kc-form-buttons">
<div class="${properties.kcFormButtonsWrapperClass!}">
<input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}" name="login" type="submit" value="${msg("doSubmit")}" />
<input class="${properties.kcButtonClass!} ${properties.kcButtonDefaultClass!} ${properties.kcButtonLargeClass!}" name="resend" type="submit" value="${msg("resendCode")}"/>
<input class="${properties.kcButtonClass!} ${properties.kcButtonDefaultClass!} ${properties.kcButtonLargeClass!}" name="cancel" type="submit" value="${msg("doCancel")}"/>
</div>
</div>
</div>
</form>
</#if>
</@layout.registrationLayout>
</@layout.registrationLayout>

0 comments on commit fd90265

Please sign in to comment.