mirror of
https://github.com/fleetbase/fleetbase.git
synced 2026-01-08 07:16:49 +00:00
47 lines
2.3 KiB
Handlebars
47 lines
2.3 KiB
Handlebars
<div class="mb-8 text-center">
|
|
<Image src={{@model.logo_url}} @fallbackSrc="/images/fleetbase-logo-svg.svg" alt={{t "app.name"}} width="160" height="56" class="w-40 h-14 mx-auto" />
|
|
<h2 class="text-lg font-extrabold text-gray-900 dark:text-white truncate">
|
|
{{if this.isSent "Verification Code"}}
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="flex px-3 py-2 mb-4 rounded-md shadow-sm bg-green-200">
|
|
<div>
|
|
<FaIcon @icon="check-circle" @size="lg" class="text-green-900 mr-4" />
|
|
</div>
|
|
<p class="flex-1 text-sm text-green-900 dark:text-green-900">
|
|
<strong>{{t "auth.two-fa.verify-code.check-title"}}</strong><br />
|
|
{{t "auth.two-fa.verify-code.check-subtitle"}}
|
|
</p>
|
|
</div>
|
|
|
|
<form class="mt-8" {{on "submit" this.verifyCode}}>
|
|
<div class="flex items-center justify-between my-6">
|
|
<OtpInput @onInputCompleted={{this.handleOtpInput}} @size={{6}} class="w-full" />
|
|
</div>
|
|
|
|
<div id="otp-countdown-container" class="otp-countdown-container flex {{if this.isCodeExpired "flex-col" "flex-row"}} items-center justify-center min-h-12">
|
|
{{#if this.countdownReady}}
|
|
<Countdown @expiry={{this.twoFactorSessionExpiresAfter}} @countdownClass="text-lg" @onCountdownEnd={{this.handleCodeExpired}} />
|
|
{{/if}}
|
|
{{#if this.isCodeExpired}}
|
|
<InfoBlock>
|
|
<div>{{t "auth.two-fa.verify-code.expired-help-text"}}</div>
|
|
<Button @type="primary" @wrapperClass="mt-2" @text={{t "auth.two-fa.verify-code.resend-code"}} @icon="arrow-rotate-right" @onClick={{this.resendCode}} />
|
|
</InfoBlock>
|
|
{{/if}}
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<Button @buttonType="submit" @type="primary" @text={{t "auth.two-fa.verify-code.verify-code"}} @icon="check-circle" @wrapperClass="btn-block" @isLoading={{this.isLoading}} />
|
|
</div>
|
|
|
|
<div class="text-center flex flex-row items-center justify-center space-x-4 mt-3.5">
|
|
<a href="#" class="text-sm text-blue-500 hover:underline inline-block" {{on "click" this.resendCode}}>
|
|
{{t "auth.two-fa.verify-code.resend-code"}}
|
|
</a>
|
|
<a href="#" class="text-sm text-danger hover:underline inline-block" {{on "click" this.cancelTwoFactor}}>
|
|
{{t "auth.two-fa.verify-code.cancel-two-factor"}}
|
|
</a>
|
|
</div>
|
|
</form> |