settings.component.html raw

   1  <div class="sam-text-header">
   2    <div class="header-buttons">
   3      <button class="header-btn" title="Lock" (click)="onClickLock()">
   4        <span class="emoji">🔒</span>
   5      </button>
   6      @if (devMode) {
   7        <button class="header-btn" title="Test Permission Prompt" (click)="onTestPrompt()">
   8          <span class="emoji">✨</span>
   9        </button>
  10      }
  11    </div>
  12    <span> Settings </span>
  13  </div>
  14  
  15  <div class="password-row">
  16    <div class="input-group">
  17      <input
  18        #newPasswordInput
  19        type="password"
  20        class="form-control"
  21        placeholder="new password"
  22        [(ngModel)]="newPassword"
  23      />
  24      <button
  25        class="btn"
  26        [class.btn-primary]="!passwordChanged"
  27        [class.btn-success]="passwordChanged"
  28        [disabled]="!newPassword || changingPassword"
  29        (click)="onChangePassword()"
  30      >
  31        {{ changingPassword ? '...' : (passwordChanged ? 'Changed' : 'Change') }}
  32      </button>
  33    </div>
  34  </div>
  35  
  36  <div class="vault-buttons">
  37    <button class="btn btn-primary" (click)="onClickExportVault()">
  38      Export Vault
  39    </button>
  40    <button class="btn btn-primary" (click)="navigate('/vault-import')">
  41      Import Vault
  42    </button>
  43  </div>
  44  
  45  <lib-nav-item text="💾 Backups" (click)="navigate('/home/backups')"></lib-nav-item>
  46  <lib-nav-item text="🪵 Logs" (click)="navigate('/home/logs')"></lib-nav-item>
  47  <lib-nav-item text="💡 Info" (click)="navigate('/home/info')"></lib-nav-item>
  48  
  49  <div class="dev-mode-row">
  50    <label class="toggle-label">
  51      <input type="checkbox" [checked]="devMode" (change)="onToggleDevMode($event)" />
  52      <span>Dev Mode</span>
  53    </label>
  54  </div>
  55  
  56  <div class="sam-flex-grow"></div>
  57  
  58  <button
  59    class="btn btn-danger"
  60    (click)="
  61      confirm.show(
  62        'Do you really want to reset your extension? Every data will be lost.',
  63        onResetExtension.bind(this)
  64      )
  65    "
  66  >
  67    Reset Extension
  68  </button>
  69  
  70  <lib-confirm #confirm> </lib-confirm>
  71