LP1474874: Consistent page headers in the Angular client
authorJane Sandberg <sandbej@linnbenton.edu>
Fri, 7 Jun 2019 01:15:56 +0000 (18:15 -0700)
committerJason Boyer <JBoyer@equinoxinitiative.org>
Fri, 24 Jul 2020 13:16:47 +0000 (09:16 -0400)
This commit ensures that each screen in the Angular staff client uses
the <eg-staff-banner> component to better orient its users.

This commit also gives the eg-staff-banner some <h1> semantics, per
WebAIM's guidance: "Pages should be structured in a hierarchical manner,
generally with one 1st degree headings (<h1>) being the most important
(usually page titles or main content heading)" -- https://webaim.org/techniques/semanticstructure/

To test:

1) Go to [your-server]/eg2/en-US/staff/catalog/search
2) Confirm that there is a header that gives the page title at the top
of the page.
3) Go to an Angular Vandelay page.
4) Confirm that you see a similar header as in step 2.
5) Go to an Angular Administration page.
6) repeat step 4.

Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
Signed-off-by: Jason Boyer <JBoyer@equinoxinitiative.org>
Open-ILS/src/eg2/src/app/staff/cat/vandelay/vandelay.component.html
Open-ILS/src/eg2/src/app/staff/catalog/browse.component.html
Open-ILS/src/eg2/src/app/staff/catalog/catalog.component.html
Open-ILS/src/eg2/src/app/staff/catalog/cnbrowse.component.html
Open-ILS/src/eg2/src/app/staff/share/staff-banner.component.ts

index a81472d..1a48cac 100644 (file)
@@ -1,4 +1,5 @@
-
+<eg-staff-banner bannerText="MARC Batch Import/Export" i18n-bannerText>
+</eg-staff-banner>
 <ul class="nav nav-pills nav-fill pb-4">
   <li class="nav-item">
     <a class="nav-link" [ngClass]="{active: tab=='export'}" 
index 175104b..00a3f92 100644 (file)
@@ -1,3 +1,5 @@
+<eg-staff-banner bannerText="Staff Catalog (Experimental)" i18n-bannerText>
+</eg-staff-banner>
 
 <eg-catalog-search-form #searchForm></eg-catalog-search-form>
 
index 1596454..af1d604 100644 (file)
@@ -1,3 +1,5 @@
+<eg-staff-banner bannerText="Staff Catalog (Experimental)" i18n-bannerText>
+</eg-staff-banner>
 <!-- search form sits atop every catalog page -->
 <eg-catalog-search-form></eg-catalog-search-form>
 
index 9be00ff..eca35ca 100644 (file)
@@ -1,3 +1,5 @@
+<eg-staff-banner bannerText="Staff Catalog (Experimental)" i18n-bannerText>
+</eg-staff-banner>
 
 <eg-catalog-search-form #searchForm></eg-catalog-search-form>
 
index 1274086..a45e276 100644 (file)
@@ -3,7 +3,7 @@ import {Component, OnInit, Input} from '@angular/core';
 @Component({
   selector: 'eg-staff-banner',
   template: `
-    <div class="lead alert alert-primary text-center pt-1 pb-1" role="alert">
+    <div class="lead alert alert-primary text-center pt-1 pb-1">
       <eg-title i18n-prefix [prefix]="bannerText"></eg-title>
        <span>{{bannerText}}</span>
     </div>