[ACS-5631] Improved page layout and provide documentation (#3346)

* page layout supports CSS selectors

* migrate to using CSS selectors for page layout

* add docs

projects/aca-content/src/lib/components/favorite-libraries/favorite-libraries.component.html

@@ -1,5 +1,5 @@
 <aca-page-layout>
-  <aca-page-layout-header>
+  <div class="aca-page-layout-header">
     <adf-breadcrumb root="APP.BROWSE.LIBRARIES.MENU.FAVORITE_LIBRARIES.TITLE"> </adf-breadcrumb>
 
     <adf-toolbar class="adf-toolbar--inline">
@@ -7,9 +7,9 @@
         <aca-toolbar-action [actionRef]="entry"></aca-toolbar-action>
       </ng-container>
     </adf-toolbar>
-  </aca-page-layout-header>
+  </div>
 
-  <aca-page-layout-content>
+  <div class="aca-page-layout-content">
     <div class="main-content">
       <adf-document-list
         #documentList
@@ -81,5 +81,5 @@
     <div class="aca-sidebar" *ngIf="infoDrawerOpened$ | async">
       <aca-info-drawer [node]="selection.last"></aca-info-drawer>
     </div>
-  </aca-page-layout-content>
+  </div>
 </aca-page-layout>

projects/aca-content/src/lib/components/favorite-libraries/favorite-libraries.component.ts

@@ -31,8 +31,6 @@ import {
   InfoDrawerComponent,
   PageComponent,
   PageLayoutComponent,
-  PageLayoutContentComponent,
-  PageLayoutHeaderComponent,
   ToolbarActionComponent
 } from '@alfresco/aca-shared';
 import { NavigateLibraryAction } from '@alfresco/aca-shared/store';
@@ -57,9 +55,7 @@ import { DocumentListDirective } from '../../directives/document-list.directive'
     PaginationModule,
     InfoDrawerComponent,
     ToolbarActionComponent,
-    PageLayoutComponent,
-    PageLayoutContentComponent,
-    PageLayoutHeaderComponent
+    PageLayoutComponent
   ],
   templateUrl: './favorite-libraries.component.html',
   encapsulation: ViewEncapsulation.None