LP2009865 Revised search result headings & source order

Revises the hierarchy of headings in the search results. In combination
with the H1 provided in in bug #1994711, the result is now:

h1. Staff Catalog
h2. Search Results (N)
(repeat for each result:)
h3. [Title] [Author]
h2. Facets
(repeat for each facet box:)
h3. [Facet title]

The source order of the results list and facet sidebar have been
swapped. The facets still appear on the left visually, but now fall
after the results in the document.

Signed-off-by: Stephanie Leary <stephanie.leary@equinoxoli.org>
Signed-off-by: Jane Sandberg <js7389@princeton.edu>
Signed-off-by: Galen Charlton <gmc@equinoxOLI.org>

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.css b/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.css
new file mode 100644 (file)
index 0000000..bc382e4
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.css
@@ -0,0 +1,11 @@
+.facet-selected {
+  background-color: #DDD;
+}
+
+.card {
+  width: 100%;
+}
+
+.list-group-item {
+  padding: .5rem .75rem .5rem .75rem
+}
\ No newline at end of file

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.html b/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.html
index 2c2cb14..01f3192 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.html
@@ -1,22 +1,14 @@
-<style>
-  .facet-selected {
-    background-color: #DDD;
-  }
-  .card {
-    width: 100%;
-  }
-  .list-group-item {padding: .5rem .75rem .5rem .75rem}
-</style>
 <div *ngIf="searchContext.result.facetData">
+  <h2 class="sr-only" i18n>Facets</h2>
   <div *ngFor="let facetConf of facetConfig.display">
     <div *ngIf="searchContext.result.facetData[facetConf.facetClass]">
       <div *ngFor="let name of facetConf.facetOrder">
         <div class="row"
           *ngIf="searchContext.result.facetData[facetConf.facetClass][name]">
           <div class="card mb-2">
-            <h4 class="card-header">
+            <h3 class="card-header">
               {{searchContext.result.facetData[facetConf.facetClass][name].cmfLabel}}
-            </h4>
+            </h3>
             <ul class="list-group list-group-flush">
               <li class="list-group-item" 
                 [ngClass]="{'facet-selected' :

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.ts b/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.ts
index aacb27c..4ac47d0 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/facets.component.ts
@@ -17,7 +17,8 @@ export const FACET_CONFIG = {
 
 @Component({
   selector: 'eg-catalog-result-facets',
-  templateUrl: 'facets.component.html'
+  templateUrl: 'facets.component.html',
+  styleUrls: ['./facets.component.css']
 })
 export class ResultFacetsComponent implements OnInit {
 

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.css b/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.css
index 2930138..9566092 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.css
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.css
@@ -13,3 +13,18 @@
     max-height: 158px;
     max-width: 100px;
 }
+
+.bib-field-title {
+    font-size: .88rem;
+    font-weight: inherit;
+    margin: 0;
+}
+
+.bib-title-link {
+    font-weight: bold;
+}
+
+.bib-author-link {
+    font-weight: normal;
+    display: block;
+}
\ No newline at end of file

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.html b/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.html
index fa33c54..b100706 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/record.component.html
@@ -38,30 +38,28 @@
         </ng-container>
         <div class="flex-1 pl-2">
           <div class="row">
-            <div class="col-lg-12 font-weight-bold">
+            <div class="col-lg-12">
+              <h3 class="bib-field-title">
               <ng-container *ngIf="hasMrConstituentRecords(summary)">
-                  <a routerLink="/staff/catalog/search"
+                  <a routerLink="/staff/catalog/search" class="bib-title-link"
                     [queryParams]="appendFromMrParam(summary)">
                     <eg-bib-display-field [summary]="summary" field="title"
                       [usePlaceholder]="true"></eg-bib-display-field>
                   </a>
               </ng-container>
+              
               <ng-container *ngIf="!hasMrConstituentRecords(summary)">
                 <a routerLink="/staff/catalog/record/{{summary.id}}"
-                  [queryParams]="currentParams()">
+                  [queryParams]="currentParams()" class="bib-title-link">
                   <eg-bib-display-field [summary]="summary" field="title"
                     [usePlaceholder]="true"></eg-bib-display-field>
                 </a>
               </ng-container>
-            </div>
-          </div>
-          <div class="row pt-2">
-            <div class="col-lg-12">
-              <a routerLink="/staff/catalog/search"
-                [queryParams]="getAuthorSearchParams(summary)">
-                <eg-bib-display-field [summary]="summary" field="author"
-                  [usePlaceholder]="true"></eg-bib-display-field>
+              
+              <a routerLink="/staff/catalog/search" class="bib-author-link pt-2" [queryParams]="getAuthorSearchParams(summary)">
+                <eg-bib-display-field [summary]="summary" field="author" [usePlaceholder]="true"></eg-bib-display-field>
               </a>
+              </h3>
             </div>
           </div>
           <div class="row pt-2">

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.css b/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.css
new file mode 100644 (file)
index 0000000..7e74d8a
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.css
@@ -0,0 +1,15 @@
+#staff-catalog-results-container h2 {
+    color: #212529;
+    font-size: 1.15rem;
+    font-weight: 500;
+}
+
+/* put the facets first visually */
+
+#eg-catalog-result-facets {
+    order: 1;
+}
+
+#eg-catalog-result-records {
+    order: 2;
+}
\ No newline at end of file

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.html b/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.html
index 5f584a5..4080ab6 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.html
@@ -38,7 +38,7 @@
   <div class="row">
     <div class="col-lg-2" *ngIf="!searchContext.basket">
       <ng-container *ngIf="!searchContext.termSearch.browseEntry">
-        <h3 i18n>Search Results ({{searchContext.result.count}})</h3>
+        <h2 i18n>Search Results ({{searchContext.result.count}})</h2>
       </ng-container>
     </div>
     <div class="col-lg-2" *ngIf="searchContext.basket">
@@ -65,10 +65,7 @@
   </div>
   <div>
     <div class="row mt-2">
-      <div class="col-lg-2" *ngIf="!searchContext.basket">
-        <eg-catalog-result-facets></eg-catalog-result-facets>
-      </div>
-      <div
+      <div id="eg-catalog-result-records"
         [ngClass]="{'col-lg-10': !searchContext.basket, 'col-lg-12': searchContext.basket}">
         <div *ngFor="let summary of searchContext.result.records; let idx = index">
           <div *ngIf="summary">
@@ -79,7 +76,10 @@
         <div class="float-right">
           <eg-catalog-result-pagination></eg-catalog-result-pagination>
         </div>
+      </div>
 
+      <div class="col-lg-2" id="eg-catalog-result-facets" *ngIf="!searchContext.basket">
+        <eg-catalog-result-facets></eg-catalog-result-facets>
       </div>
     </div>
   </div>

diff --git a/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.ts b/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.ts
index f4e42c1..76711e1 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/catalog/result/results.component.ts
@@ -14,7 +14,8 @@ import {ServerStoreService} from '@eg/core/server-store.service';
 
 @Component({
   selector: 'eg-catalog-results',
-  templateUrl: 'results.component.html'
+  templateUrl: 'results.component.html',
+  styleUrls: ['results.component.css']
 })
 export class ResultsComponent implements OnInit, OnDestroy {