586e2ab23f
- Add Dev Mode toggle to settings that persists in vault metadata - Add test permission prompt button (✨) to all page headers when dev mode enabled - Move devMode and onTestPrompt to NavComponent base class for inheritance - Refactor all home components to extend NavComponent - Simplify permission prompt layout: remove duplicate domain from header - Convert permission descriptions to flowing single paragraphs - Update header-buttons styling for consistent lock/magic button layout Files modified: - projects/common/src/lib/common/nav-component.ts (devMode, onTestPrompt) - projects/common/src/lib/services/storage/types.ts (devMode property) - projects/common/src/lib/services/storage/signer-meta-handler.ts (setDevMode) - projects/common/src/lib/styles/_common.scss (header-buttons styling) - projects/*/src/app/components/home/*/settings.component.* (dev mode UI) - projects/*/src/app/components/home/*/*.component.* (extend NavComponent) - projects/*/public/prompt.html (simplified layout) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
66 lines
1.7 KiB
HTML
66 lines
1.7 KiB
HTML
<div class="sam-text-header">
|
|
<div class="header-buttons">
|
|
<button class="header-btn" title="Lock" (click)="onClickLock()">
|
|
<span class="emoji">🔒</span>
|
|
</button>
|
|
@if (devMode) {
|
|
<button class="header-btn" title="Test Permission Prompt" (click)="onTestPrompt()">
|
|
<span class="emoji">✨</span>
|
|
</button>
|
|
}
|
|
</div>
|
|
<span> Settings </span>
|
|
</div>
|
|
|
|
<div class="vault-buttons">
|
|
<button class="btn btn-primary" (click)="onClickExportVault()">
|
|
Export Vault
|
|
</button>
|
|
<button class="btn btn-primary" (click)="navigate('/vault-import')">
|
|
Import Vault
|
|
</button>
|
|
</div>
|
|
|
|
<lib-nav-item text="💾 Backups" (click)="navigate('/home/backups')"></lib-nav-item>
|
|
<lib-nav-item text="🪵 Logs" (click)="navigate('/home/logs')"></lib-nav-item>
|
|
<lib-nav-item text="💡 Info" (click)="navigate('/home/info')"></lib-nav-item>
|
|
|
|
<div class="dev-mode-row">
|
|
<label class="toggle-label">
|
|
<input type="checkbox" [checked]="devMode" (change)="onToggleDevMode($event)" />
|
|
<span>Dev Mode</span>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="sam-flex-grow"></div>
|
|
|
|
<div class="sync-info">
|
|
<span class="sync-label">SYNC: {{ syncFlow }}</span>
|
|
<p class="sync-note">
|
|
To change sync mode, export your vault, reset the extension,
|
|
and re-import with the desired sync setting.
|
|
</p>
|
|
</div>
|
|
|
|
<button
|
|
class="btn btn-danger"
|
|
(click)="
|
|
confirm.show(
|
|
'Do you really want to reset your extension? Every data will be lost.',
|
|
onResetExtension.bind(this)
|
|
)
|
|
"
|
|
>
|
|
Reset Extension
|
|
</button>
|
|
|
|
<lib-confirm #confirm> </lib-confirm>
|
|
|
|
<input
|
|
#fileInput
|
|
class="file-input"
|
|
type="file"
|
|
(change)="onImportFileChange($event)"
|
|
accept=".json"
|
|
/>
|