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>

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 a52a391..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
@@ -14,14 +14,17 @@
     max-width: 100px;
 }
 
-h3.bib-field-title {
+.bib-field-title {
     font-size: .88rem;
-    font-weight: bold;
+    font-weight: inherit;
     margin: 0;
 }
 
-h4.bib-field-author {
-    font-size: .88rem;
-    font-weight: normal;
-    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 1ea6a97..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
@@ -41,7 +41,7 @@
             <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>
@@ -50,23 +50,16 @@
               
               <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>
-              </h3>
-            </div>
-          </div>
-          <div class="row pt-2">
-            <div class="col-lg-12">
-              <h4 class="bib-field-author">
-              <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>
-              </h4>
+              </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
index 276fd94..7e74d8a 100644 (file)
--- 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
@@ -2,4 +2,14 @@
     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 58a6eeb..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
@@ -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>