Add basic heading markup

src/popup/settings/excluded-domains.component.html

@@ -3,9 +3,9 @@
         <div class="left">
             <a routerLink="/tabs/settings">{{'cancel' | i18n}}</a>
         </div>
-        <div class="center">
+        <h1 class="center">
             <span class="title">{{'excludedDomains' | i18n}}</span>
-        </div>
+        </h1>
         <div class="right">
             <button type="submit" appBlurClick>{{'save' | i18n}}</button>
         </div>

src/popup/settings/export.component.html

@@ -6,9 +6,9 @@
                 <span>{{'back' | i18n}}</span>
             </a>
         </div>
-        <div class="center">
+        <h1 class="center">
             <span class="title">{{'exportVault' | i18n}}</span>
-        </div>
+        </h1>
         <div class="right">
             <button appBlurClick type="submit" [disabled]="disabledByPolicy">{{'submit' | i18n}}</button>
         </div>

src/popup/settings/folder-add-edit.component.html

@@ -3,9 +3,9 @@
         <div class="left">
             <a routerLink="/folders">{{'cancel' | i18n}}</a>
         </div>
-        <div class="center">
+        <h1 class="center">
             <span class="title">{{title}}</span>
-        </div>
+        </h1>
         <div class="right">
             <button type="submit" appBlurClick [disabled]="form.loading">
                 <span [hidden]="form.loading">{{'save' | i18n}}</span>

src/popup/settings/folders.component.html

@@ -5,9 +5,9 @@
             <span>{{'back' | i18n}}</span>
         </a>
     </div>
-    <div class="center">
+    <h1 class="center">
         <span class="title">{{'folders' | i18n}}</span>
-    </div>
+    </h1>
     <div class="right">
         <button type="button" appBlurClick (click)="addFolder()" appA11yTitle="{{'addFolder' | i18n}}">
             <i class="fa fa-plus fa-lg fa-fw" aria-hidden="true"></i>

src/popup/settings/options.component.html

@@ -5,18 +5,18 @@
             <span>{{'back' | i18n}}</span>
         </a>
     </div>
-    <div class="center">
+    <h1 class="center">
         <span class="title">{{'options' | i18n}}</span>
-    </div>
+    </h1>
     <div class="right"></div>
 </header>
 <content>
     <div class="box">
-        <div class="box-header-expandable" (click)="showGeneral = !showGeneral">
+        <h2 class="box-header-expandable" (click)="showGeneral = !showGeneral">
             General
             <i *ngIf="!showGeneral" class="fa fa-chevron-down fa-sm icon"></i>
             <i *ngIf="showGeneral" class="fa fa-chevron-up fa-sm icon"></i>
-        </div>
+        </h2>
     </div>
     <ng-container *ngIf="showGeneral">
         <div class="box">
@@ -84,11 +84,11 @@
         </div>
     </ng-container>
     <div class="box box-section-divider">
-        <div class="box-header-expandable" (click)="showDisplay = !showDisplay">
+        <h2 class="box-header-expandable" (click)="showDisplay = !showDisplay">
             Display
             <i *ngIf="!showDisplay" class="fa fa-chevron-down fa-sm icon"></i>
             <i *ngIf="showDisplay" class="fa fa-chevron-up fa-sm icon"></i>
-        </div>
+        </h2>
     </div>
     <ng-container *ngIf="showDisplay">
         <div class="box">
@@ -141,11 +141,11 @@
         </div>
     </ng-container>
     <div class="box box-section-divider">
-        <div class="box-header-expandable" (click)="showAutofill = !showAutofill">
+        <h2 class="box-header-expandable" (click)="showAutofill = !showAutofill">
             Autofill
             <i *ngIf="!showAutofill" class="fa fa-chevron-down fa-sm icon"></i>
             <i *ngIf="showAutofill" class="fa fa-chevron-up fa-sm icon"></i>
-        </div>
+        </h2>
     </div>
     <ng-container *ngIf="showAutofill">
         <div class="box">

src/popup/settings/premium.component.html

@@ -5,9 +5,9 @@
             <span>{{'back' | i18n}}</span>
         </a>
     </div>
-    <div class="center">
+    <h1 class="center">
         <span class="title">{{'premiumMembership' | i18n}}</span>
-    </div>
+    </b1>
     <div class="right"></div>
 </header>
 <content>

src/popup/settings/settings.component.html

@@ -2,14 +2,14 @@
     <div class="left">
         <app-pop-out></app-pop-out>
     </div>
-    <div class="center">
+    <h1 class="center">
         <span class="title">{{'settings' | i18n}}</span>
-    </div>
+    </h1>
     <div class="right"></div>
 </header>
 <content>
     <div class="box list">
-        <div class="box-header">{{'manage' | i18n}}</div>
+        <h2 class="box-header">{{'manage' | i18n}}</h2>
         <div class="box-content single-line">
             <a class="box-content-row box-content-row-flex text-default" routerLink="/folders">
                 <div class="row-main">{{'folders' | i18n}}</div>
@@ -26,7 +26,7 @@
         </div>
     </div>
     <div class="box list">
-        <div class="box-header">{{'security' | i18n}}</div>
+        <h2 class="box-header">{{'security' | i18n}}</h2>
         <div class="box-content single-line">
             <app-vault-timeout-input [vaultTimeouts]="vaultTimeouts" [formControl]="vaultTimeout" ngDefaultControl></app-vault-timeout-input>
             <div class="box-content-row display-block" appBoxRow>
@@ -61,7 +61,7 @@
         </div>
     </div>
     <div class="box list">
-        <div class="box-header">{{'account' | i18n}}</div>
+        <h2 class="">{{'account' | i18n}}</h2>
         <div class="box-content single-line">
             <a class="box-content-row" routerLink="/premium">
                 <div class="row-main">
@@ -108,7 +108,7 @@
         </div>
     </div>
     <div class="box list">
-        <div class="box-header">{{'other' | i18n}}</div>
+        <h2 class="box-header">{{'other' | i18n}}</h2>
         <div class="box-content single-line">
             <a class="box-content-row box-content-row-flex text-default" routerLink="/options">
                 <div class="row-main">{{'options' | i18n}}</div>

src/popup/settings/sync.component.html

@@ -5,9 +5,9 @@
             <span>{{'back' | i18n}}</span>
         </a>
     </div>
-    <div class="center">
+    <h1 class="center">
         <span class="title">{{'sync' | i18n}}</span>
-    </div>
+    </h1>
     <div class="right"></div>
 </header>
 <content>