mail/src/tpl/privatekey-upload.html

53 lines
2.2 KiB
HTML

<div class="lightbox__body" ng-controller="PrivateKeyUploadCtrl">
<header class="lightbox__header">
<h2>Setup Key Sync</h2>
<button class="lightbox__close" wo-touch="state.privateKeyUpload.toggle(false)" data-action="lightbox-close">
<svg><use xlink:href="#icon-close" /><title>Close</title></svg>
</button>
</header>
<div class="lightbox__content">
<div ng-show="step === 1">
<p class="typo-paragraph">
Your keychain code can be used to securely backup and sync your PGP key between devices.
This feature is experimental and not recommended for production use.
<a href="https://blog.whiteout.io/2014/07/07/secure-pgp-key-sync-a-proposal/" target="_blank">Learn more</a>.
</p>
<p class="typo-paragraph">
<code class="typo-code">{{displayedCode}}</code>
</p>
<p class="typo-paragraph">
Please write down your keychain code and keep it in a safe place. Whiteout Networks cannot recover a lost code.
</p>
</div>
<div ng-show="step === 2">
<p class="typo-paragraph">Please confirm the keychain code you have written down.</p>
<form class="form">
<input type="text" class="input-text" ng-model="inputCode" wo-input-code wo-focus-me="step === 2"
required pattern="([a-zA-Z0-9\-]*)" placeholder="0000-0000-0000-0000-0000-0000"
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">
</form>
</div>
<div ng-show="step === 3">
<p class="typo-paragraph">Please enter a memorable name for this device e.g. “MacBook Work”.</p>
<form class="form">
<input type="text" class="input-text" ng-model="deviceName" placeholder="Device name" wo-focus-me="step === 3">
</form>
</div>
<div ng-show="step === 4">
<div class="spinner-block spinner-block--standalone">
<span class="spinner spinner--big"></span>
</div>
</div>
</div>
<footer class="lightbox__controls">
<button ng-show="step > 1 && step < 4" class="btn btn--secondary" wo-touch="goBack()">Go back</button>
<button ng-show="step < 4" class="btn" wo-touch="goForward()">Continue</button>
</footer>
</div>