mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-22 14:22:40 +01:00
Recovery seed page improvements
This commit is contained in:
parent
188774f30a
commit
dbf6676115
3 changed files with 47 additions and 43 deletions
|
@ -305,7 +305,7 @@ namespace BTCPayServer.Controllers
|
|||
TempData.SetStatusMessageModel(new StatusMessageModel()
|
||||
{
|
||||
Severity = StatusMessageModel.StatusSeverity.Success,
|
||||
Html = $"Your wallet has been generated. Please store your seed securely!"
|
||||
Html = $"<span class='text-centered'>Your wallet has been generated.</span>"
|
||||
});
|
||||
var vm = new RecoverySeedBackupViewModel()
|
||||
{
|
||||
|
|
|
@ -1145,11 +1145,6 @@ namespace BTCPayServer.Controllers
|
|||
}
|
||||
else
|
||||
{
|
||||
TempData.SetStatusMessageModel(new StatusMessageModel()
|
||||
{
|
||||
Severity = StatusMessageModel.StatusSeverity.Success,
|
||||
Html = $"Please store your seed securely!"
|
||||
});
|
||||
var recoveryVm = new RecoverySeedBackupViewModel()
|
||||
{
|
||||
CryptoCode = walletId.CryptoCode,
|
||||
|
|
|
@ -1,57 +1,66 @@
|
|||
@model RecoverySeedBackupViewModel
|
||||
@{
|
||||
Layout = "_LayoutSimple";
|
||||
ViewData["Title"] = "Save your recovery phrase";
|
||||
ViewData["Title"] = "Your recovery phrase";
|
||||
}
|
||||
|
||||
<div class="row justify-content-md-center">
|
||||
<div class="col-md-9 col-lg-8">
|
||||
<div class="col-lg-10">
|
||||
<partial name="_StatusMessage" />
|
||||
|
||||
<h1 class="text-center text-primary mb-5">@ViewData["Title"]</h1>
|
||||
<div class="d-flex flex-column align-items-center justify-content-center">
|
||||
<span class="fa fa-info-circle align-self-center p-3" style="font-size:4em;"></span>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12 col-sm-2 d-flex align-items-center justify-content-center">
|
||||
<span class="fa fa-warning align-self-center p-3" style="font-size:3.5em;"></span>
|
||||
</div>
|
||||
<div class="col-12 col-sm-10 lead">
|
||||
<p>
|
||||
The words below are called your recovery phrase.
|
||||
Please save these words securely.
|
||||
They will allow you to recover your wallet.
|
||||
</p>
|
||||
@if (!Model.IsStored)
|
||||
{
|
||||
<p class="mt-3 mb-3">The recovery phrase will only be shown before being wiped from the server.</p>
|
||||
}
|
||||
<p class="mt-3 mb-0">
|
||||
Do not photograph or store this in a non air-gapped digital format.
|
||||
Anyone with access to your recovery phrase can steal your funds.
|
||||
</p>
|
||||
@if (!string.IsNullOrEmpty(Model.Passphrase))
|
||||
{
|
||||
<p class="mt-3 mb-0">Please make also sure to store your passphrase.</p>
|
||||
}
|
||||
</div>
|
||||
<h1 class="text-center text-primary mb-5">Secure your recovery phrase</h1>
|
||||
</div>
|
||||
<div class="lead text-center">
|
||||
<p>
|
||||
<span class="d-sm-block">The words below are called your recovery phrase.</span>
|
||||
<span class="d-sm-block"><strong>Write them down on a piece of paper in the exact order.</strong></span>
|
||||
</p>
|
||||
<p style="max-width:32em;margin-left:auto;margin-right:auto;">
|
||||
They are the only backup of your private keys and allow you to restore your wallet.
|
||||
If you lose or write down the recovery phrase incorrectly you will permanently lose access of your funds.
|
||||
Double-check the spelling and position of each recovery phrase word.
|
||||
</p>
|
||||
@if (!Model.IsStored)
|
||||
{
|
||||
<p class="mt-3 mb-3">
|
||||
<strong>
|
||||
The recovery phrase will only be shown before being wiped from the server.
|
||||
</strong>
|
||||
</p>
|
||||
}
|
||||
<p class="mt-3 mb-0">
|
||||
<span class="d-md-block">Do not photograph or store this in a non air-gapped digital format.</span>
|
||||
<span class="d-md-block">Anyone with access to your recovery phrase can steal your funds.</span>
|
||||
</p>
|
||||
@if (!string.IsNullOrEmpty(Model.Passphrase))
|
||||
{
|
||||
<p class="mt-3 mb-0">Please make sure to also write down your passphrase.</p>
|
||||
}
|
||||
</div>
|
||||
<style>
|
||||
|
||||
<ol id="recovery-phrase" data-mnemonic="@Model.Mnemonic" class="my-5 d-flex flex-wrap justify-content-center align-items-center p-0" style="max-width:800px">
|
||||
@@media (min-width: 476px) { ol#recovery-phrase {max-height:16em;} }
|
||||
@@media (min-width: 768px) { ol#recovery-phrase {max-height:12em;} }
|
||||
@@media (min-width: 1200px) { ol#recovery-phrase {max-height:8em;} }
|
||||
form#recovery-confirmation button { position: absolute; bottom:0; left:50%; width:200px; margin-left:-100px; }
|
||||
form#recovery-confirmation button:not([disabled]) { display: none; }
|
||||
form#recovery-confirmation input:checked ~ button[disabled] { display: none; }
|
||||
form#recovery-confirmation input:checked + button:not([disabled]) { display: inline-block; }
|
||||
</style>
|
||||
<ol id="recovery-phrase" data-mnemonic="@Model.Mnemonic" class="my-5 d-flex flex-column flex-wrap justify-content-center align-items-center p-0">
|
||||
@foreach (var word in Model.Words)
|
||||
{
|
||||
<li class="ml-4 p-3 text-secondary" style="flex: 0 1 11em">
|
||||
<li class="ml-4 px-3 py-2 text-secondary" style="flex: 0 1;min-width:10em;">
|
||||
<span class="text-dark h5">@word</span>
|
||||
</li>
|
||||
}
|
||||
</ol>
|
||||
<style>
|
||||
form#recoveryConfirmation button { position: absolute; bottom:0; left:50%; width:200px; margin-left:-100px; }
|
||||
form#recoveryConfirmation button:not([disabled]) { display: none; }
|
||||
form#recoveryConfirmation input:checked ~ button[disabled] { display: none; }
|
||||
form#recoveryConfirmation input:checked + button:not([disabled]) { display: inline-block; }
|
||||
</style>
|
||||
<form id="recoveryConfirmation" action="@Model.ReturnUrl" class="d-flex align-items-center justify-content-center" style="padding-bottom: 80px">
|
||||
<label class="form-check-label lead order-2" for="confirm">I have saved my recovery phrase in a secure location</label>
|
||||
<input type="checkbox" class="mr-3 order-1" id="confirm">
|
||||
<form id="recovery-confirmation" action="@Model.ReturnUrl" class="d-flex align-items-start justify-content-center" style="padding-bottom: 80px">
|
||||
<label class="form-check-label lead order-2" for="confirm">I have written down my recovery phrase and stored it in a secure location</label>
|
||||
<input type="checkbox" class="mt-2 mr-3 order-1" id="confirm">
|
||||
<button type="submit" class="btn btn-primary btn-lg px-5 order-3" id="submit">Done</button>
|
||||
<button type="submit" class="btn btn-primary btn-lg px-5 order-3" disabled>Done</button>
|
||||
</form>
|
||||
|
|
Loading…
Add table
Reference in a new issue