Misc Cleanup (#1242)

* Updated the wording for Read in incognito, as 'in' was redundant

* Added icons to the middle tabs for a mobile compaitible view

* Fixed up the code for side nav to make the display much cleaner

* Added icons to tabs

* Styling polishing

- Making pagination spacing uniform
- Fixing onresize event
- Making cards center justification on mobile only
- fixing vertical alignment for companion bar icons
- Fixing Issue where drawer buttons would sometimes not be visible.
- Fixed vertical alignment issue with filter button

* Fixing orientation change event

* added fixed position to drawer

- fixes styling issues

* added total pages to series modal

* Downgraded ExCSS package to a version that doesn't die on @page query selectors.

* Cleaned up some code and wrote some bug markers in typeahead

* Removed some padding top on companion bar

* Aligned the top margin for card detail layout and series detail

* Use a temp close button on book reader until new code is ready.

Co-authored-by: Robbie Davis <robbie@therobbiedavis.com>

UI/Web/src/app/library-detail/library-detail.component.html

@@ -7,7 +7,12 @@
     <div main>
         <ul ngbNav #nav="ngbNav" [(activeId)]="active" class="nav nav-pills" style="flex-wrap: nowrap;">
             <li *ngFor="let tab of tabs" [ngbNavItem]="tab">
-              <a ngbNavLink>{{tab.title | sentenceCase}}</a>
+              <a ngbNavLink>
+                  <span class="d-none d-sm-flex align-items-center"><i class="fa {{tab.icon}} me-1" style="padding-right: 5px;" aria-hidden="true"></i> {{tab.title | sentenceCase}}</span>
+                  <span class="d-flex d-sm-none">
+                      <i class="fa {{tab.icon}}" aria-hidden="true"></i>
+                  </span>
+              </a>
               <ng-template ngbNavContent>
                 <ng-container *ngIf="tab.title === 'Recommended'">
                   <app-library-recommended [libraryId]="libraryId"></app-library-recommended>

UI/Web/src/app/library-detail/library-detail.component.scss

@@ -8,4 +8,4 @@
     width: 600px;
     height: 100%;
     overflow-y: auto;
-  }
+}

UI/Web/src/app/library-detail/library-detail.component.ts

@@ -39,9 +39,9 @@ export class LibraryDetailComponent implements OnInit, OnDestroy {
   filterActive: boolean = false;
   filterActiveCheck!: SeriesFilter;
 
-  tabs: Array<{title: string, fragment: string}> = [
-    {title: 'Library', fragment: ''},
-    {title: 'Recommended', fragment: 'recomended'},
+  tabs: Array<{title: string, fragment: string, icon: string}> = [
+    {title: 'Library', fragment: '', icon: 'fa-landmark'},
+    {title: 'Recommended', fragment: 'recomended', icon: 'fa-award'},
   ];
   active = this.tabs[0];