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>
-
+<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'}"
+<eg-staff-banner bannerText="Staff Catalog (Experimental)" i18n-bannerText>
+</eg-staff-banner>
<eg-catalog-search-form #searchForm></eg-catalog-search-form>
+<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>
+<eg-staff-banner bannerText="Staff Catalog (Experimental)" i18n-bannerText>
+</eg-staff-banner>
<eg-catalog-search-form #searchForm></eg-catalog-search-form>
@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>