mleku
a2e47d8612
- Auto-focus password input when page loads - Move QR code above password input form (displays after generation) - Move explanation text below the form - Replace ncryptsec text output with clickable QR code button - Add hover/active effects and "Copy to clipboard" tooltip to QR code - Remove redundant copy button and text display Files modified: - package.json (version bump) - projects/chrome/public/manifest.json - projects/chrome/src/app/components/edit-identity/ncryptsec/* - projects/firefox/public/manifest.json - projects/firefox/src/app/components/edit-identity/ncryptsec/* 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
61 lines
1.4 KiB
HTML
61 lines
1.4 KiB
HTML
<div class="header-pane">
|
|
<lib-icon-button
|
|
icon="chevron-left"
|
|
(click)="navigateBack()"
|
|
></lib-icon-button>
|
|
<span>Get ncryptsec</span>
|
|
</div>
|
|
|
|
<!-- QR Code (shown after generation) -->
|
|
@if (ncryptsec) {
|
|
<div class="qr-container">
|
|
<button
|
|
type="button"
|
|
class="qr-button"
|
|
title="Copy to clipboard"
|
|
(click)="copyToClipboard(ncryptsec); toast.show('Copied to clipboard')"
|
|
>
|
|
<img [src]="ncryptsecQr" alt="ncryptsec QR code" class="qr-code" />
|
|
</button>
|
|
</div>
|
|
}
|
|
|
|
<!-- PASSWORD INPUT -->
|
|
<div class="password-section">
|
|
<label for="ncryptsecPasswordInput">Password</label>
|
|
<div class="input-group sam-mt-h">
|
|
<input
|
|
#passwordInput
|
|
id="ncryptsecPasswordInput"
|
|
type="password"
|
|
class="form-control"
|
|
placeholder="Enter encryption password"
|
|
[(ngModel)]="ncryptsecPassword"
|
|
[disabled]="isGenerating"
|
|
(keyup.enter)="generateNcryptsec()"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<button
|
|
class="btn btn-primary generate-btn"
|
|
type="button"
|
|
(click)="generateNcryptsec()"
|
|
[disabled]="!ncryptsecPassword || isGenerating"
|
|
>
|
|
@if (isGenerating) {
|
|
<span class="spinner-border spinner-border-sm" role="status"></span>
|
|
Generating...
|
|
} @else {
|
|
Generate ncryptsec
|
|
}
|
|
</button>
|
|
|
|
|
|
<p class="description">
|
|
Enter a password to encrypt your private key. The resulting ncryptsec can be
|
|
used to securely backup or transfer your key.
|
|
</p>
|
|
|
|
<lib-toast #toast [bottom]="16"></lib-toast>
|