fix(docs-infra): ARIA roles used must conform to valid values

Author: timdeschryver

projects/ngrx.io/src/404-body.html

@@ -21,9 +21,9 @@
     </mat-toolbar-row>
   </mat-toolbar>
 
-  <mat-sidenav-container class="sidenav-container mat-drawer-container mat-sidenav-container" role="main">
-    <mat-sidenav-content class="mat-drawer-content mat-sidenav-content">
-      <section class="sidenav-content" role="content">
+  <mat-sidenav-container class="sidenav-container mat-drawer-container mat-sidenav-container">
+    <mat-sidenav-content class="mat-drawer-content mat-sidenav-content" role="main">
+      <section class="sidenav-content">
         <aio-doc-viewer>
           <div class="content">
             <div class="nf-container l-flex-wrap flex-center">

projects/ngrx.io/src/app/app.component.html

@@ -39,7 +39,7 @@
 
 <aio-search-results #searchResultsView *ngIf="showSearchResults" [searchResults]="searchResults | async" (resultSelected)="hideSearchResults()"></aio-search-results>
 
-<mat-sidenav-container class="sidenav-container" [class.starting]="isStarting" [class.has-floating-toc]="hasFloatingToc" role="main">
+<mat-sidenav-container class="sidenav-container" [class.starting]="isStarting" [class.has-floating-toc]="hasFloatingToc">
 
   <mat-sidenav [ngClass]="{'collapsed': !isSideBySide}" #sidenav class="sidenav" [mode]="mode" [opened]="isOpened" (openedChange)="updateHostClasses()">
     <aio-nav-menu *ngIf="!isSideBySide" [nodes]="topMenuNarrowNodes" [currentNode]="currentNodes?.TopBarNarrow" [isWide]="false"></aio-nav-menu>
@@ -50,7 +50,7 @@
     </div> -->
   </mat-sidenav>
 
-  <section class="sidenav-content" [id]="pageId" role="content">
+  <section class="sidenav-content" [id]="pageId" role="main">
     <aio-mode-banner [mode]="deployment.mode" [version]="versionInfo"></aio-mode-banner>
     <aio-doc-viewer [class.no-animations]="isStarting"
         [doc]="currentDocument"