btcpayserver/BTCPayServer/Views/UIManage/EnableAuthenticator.cshtml
d11n 77fba4aee3
Add more translations (#6302)
* Newlines

* Dashboard

* Add more translations

* Moar

* Remove   from translated texts

* Dictionary controller translations

* Batch 1 of controller updates

* Batch 2 of controller updates

* Component translations

* Batch 3 of controller updates

* Fixes
2024-10-17 22:51:40 +09:00

85 lines
4.1 KiB
Text

@model EnableAuthenticatorViewModel
@{
ViewData.SetActivePage(ManageNavPages.TwoFactorAuthentication, "Enable Authenticator App");
}
<div class="sticky-header">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a asp-action="TwoFactorAuthentication" text-translate="true">Two Factor Authentication</a>
</li>
<li class="breadcrumb-item active" aria-current="page" text-translate="true">@ViewData["Title"]</li>
</ol>
<h2 text-translate="true">@ViewData["Title"]</h2>
</nav>
</div>
<partial name="_StatusMessage" />
<p class="my-3" text-translate="true">To use an authenticator app go through the following steps:</p>
<div class="col-xl-8 col-xxl-constrain">
<ol class="ps-3">
<li class="mb-5">
<div class="mb-2" text-translate="true">Download a two-factor authenticator app like …</div>
<ul>
<li>
Authy for
<a href="https://play.google.com/store/apps/details?id=com.authy.authy" rel="noreferrer noopener">Android</a> or
<a href="https://apps.apple.com/us/app/authy/id494168017" rel="noreferrer noopener">iOS</a>
</li>
<li>
Microsoft Authenticator for
<a href="https://play.google.com/store/apps/details?id=com.azure.authenticator" rel="noreferrer noopener">Android</a> or
<a href="https://apps.apple.com/us/app/microsoft-authenticator/id983156458" rel="noreferrer noopener">iOS</a>
</li>
<li>
Google Authenticator for
<a href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2&amp;hl=en" rel="noreferrer noopener">Android</a> or
<a href="https://apps.apple.com/us/app/google-authenticator/id388497605" rel="noreferrer noopener">iOS</a>
</li>
</ul>
</li>
<li class="mb-5">
<p class="mb-2" text-translate="true">Scan the QR Code or enter the following key into your two-factor authenticator app:</p>
<div class="input-group input-group-sm mb-4">
<input readonly class="form-control font-monospace" value="@Model.SharedKey" id="SharedKey" style="max-width:20rem">
<button type="button" class="btn btn-outline-secondary" data-clipboard-target="#SharedKey">
<vc:icon symbol="actions-copy" />
</button>
</div>
<div id="qrCode"></div>
<div id="qrCodeData" data-url="@Model.AuthenticatorUri"></div>
</li>
<li>
<p>
<span text-translate="true">Your two-factor authenticator app will provide you with a unique code.</span>
<br/>
<span text-translate="true">Enter the code in the confirmation box below.</span>
</p>
<form method="post">
<input asp-for="AuthenticatorUri" type="hidden" />
<input asp-for="SharedKey" type="hidden" />
<div class="form-group">
<label asp-for="Code" class="form-label" text-translate="true">Verification Code</label>
<input asp-for="Code" class="form-control" autocomplete="off" autofocus style="width:14ch"/>
<span asp-validation-for="Code" class="text-danger"></span>
</div>
<button type="submit" class="btn btn-primary mt-2" text-translate="true">Verify</button>
<div asp-validation-summary="ModelOnly"></div>
</form>
</li>
</ol>
</div>
@section PageFootContent {
<partial name="_ValidationScriptsPartial" />
<script src="~/js/qrcode.js" asp-append-version="true"></script>
<script>
new QRCode(document.getElementById("qrCode"), {
text: @Safe.Json(Model.AuthenticatorUri),
width: 200,
height: 200,
useSVG: true,
correctLevel : QRCode.CorrectLevel.M
});
$("#qrCode > img").css({ "margin": "auto" });
</script>
}