From 9ff763f5f5772ce370b595516a3cac1060f55d95 Mon Sep 17 00:00:00 2001
From: rdrew <rdrew@upei.ca>
Date: Wed, 7 Oct 2026 14:40:37 -0300
Subject: [PATCH] nav resize + css tidy

---
 css/components/islandora_mods.css    | 250 ++++++++++++++-------------
 css/components/islandora_mods.css.bk | 241 ++++++++++++++++++++++++++
 2 files changed, 371 insertions(+), 120 deletions(-)
 create mode 100755 css/components/islandora_mods.css.bk

diff --git a/css/components/islandora_mods.css b/css/components/islandora_mods.css
index 6f7f5ae..98faa90 100755
--- a/css/components/islandora_mods.css
+++ b/css/components/islandora_mods.css
@@ -4,104 +4,127 @@
 .logo-wrapper {
   background: #33333399;
 }
+
 .logo--oliveskspaces h1 {
   border: none;
 }
+
 div#site-header__inner {
   border-right: 1px solid #eee;
 }
 
-/* ==========================================================================
-   Layout
-   ========================================================================== */
-
 /* ==========================================================================
    Grid / Views
    ========================================================================== */
-
 .grid-item {
+  display: flex;
+  gap: 1em;
   margin-bottom: 2em;
-  border: 1px solid #ccc;
   padding: 8px;
+  border: 1px solid #ccc;
   border-radius: 4px;
   box-shadow: 0px 5px 11px -2px rgb(0 0 0 / 39%);
-  display: flex;
-  gap: 1em;
-}
 
-.grid-item .image {
-  flex: 0 0 175px; /* don't grow, don't shrink, base width 175px */
-  width: 175px; /* belt-and-suspenders, some browsers want this too */
-  img {
+  .image {
+    flex: 0 0 175px; /* don't grow, don't shrink, base width 175px */
+    width: 175px; /* some browsers want this too */
+
+    img {
+      width: 100%;
+      padding: 4px;
+      border: 1px solid #ccc;
+      background: #ece8e3;
+    }
+  }
+
+  .metadata {
+    flex: 1 1 auto; /* grow to fill remaining space */
+    min-width: 0; /* prevents text/content overflow in the flex item */
+  }
+
+  .views-field-did-image img {
     width: 100%;
-    border: 1px solid #ccc;
-    padding: 4px;
-    background: #ece8e3;
   }
-}
-.grid-item .metadata {
-  flex: 1 1 auto; /* grow to fill remaining space */
-  min-width: 0; /* prevents text/content overflow issues in the flex item */
-}
-.grid-item .views-field-did-image img {
-  width: 100%;
-}
-.grid-item .title {
-  display: block;
-  padding: 0.5em 0;
-  line-height: 1.2;
-  margin: 5px 0 6px 0;
-  font-weight: bold;
-  border-bottom: 1px dotted #574938;
-  overflow-wrap: anywhere;
 
-  a {
-    text-decoration: none;
-    font-family: var(--font-serif);
-    color: var(--color--lmmi-tan);
-    font-size: 1.5rem;
+  .title {
+    display: block;
+    margin: 5px 0 6px 0;
+    padding: 0.5em 0;
+    border-bottom: 1px dotted #574938;
+    font-weight: bold;
+    line-height: 1.2;
+    overflow-wrap: anywhere;
+
+    a {
+      color: var(--color--lmmi-tan);
+      font-family: var(--font-serif);
+      font-size: 1.5rem;
+      text-decoration: none;
+    }
   }
 }
-.metadata .views-field {
-  display: flex;
-  gap: 0.5em;
-}
+
 .views-label,
 .field__label {
-  font-weight: bold;
   font-family: var(--font-sans);
   font-size: var(--font-size-base);
-  /* flex-basis: 7em; */
-  /* width: 6em; */
-  /* display: inline-block; */
+  font-weight: bold;
 }
 
-.views-field.views-field-field-abstract li {
-  list-style-type: none;
+/* Label/value rows inside a result's metadata */
+.metadata {
+  .views-field {
+    display: flex;
+    align-items: flex-start; /* keeps labels at the top of multi-line content */
+    gap: 0.5em;
+  }
+
+  /* Uniform label column */
+  .views-label {
+    --label-width: 5em;
+    flex: 0 0 var(--label-width);
+    min-width: var(--label-width);
+    margin-right: 1em; /* gap before the content */
+    box-sizing: border-box;
+  }
+
+  /* Content fills the rest of the row */
+  .field-content {
+    flex: 1;
+    min-width: 0; /* prevents long text from breaking the flex container */
+  }
 }
 
-/* Ensure the container is a flexbox */
-.metadata .views-field {
-  display: flex;
-  align-items: flex-start; /* Keeps labels aligned to the top of multi-line content */
-  /* margin-bottom: 0.5rem; */ /* Optional: adds spacing between rows */
+.views-field.views-field-field-abstract {
+  line-height: 1.3;
+
+  li {
+    list-style-type: none;
+  }
+
+  .field-content {
+    .label {
+      display: none;
+    }
+
+    p {
+      margin: 0;
+    }
+  }
 }
 
-/* Force uniform width on labels */
-.metadata .views-label {
-  --label-width: 5em;
-  flex: 0 0 var(--label-width); /* Fixed width: No grow, No shrink, 7em basis */
-  min-width: var(--label-width); /* Prevents shrinking below 7em */
-  width: var(--label-width); /* Consistency across older browsers */
-  margin-right: 1em; /* Creates a consistent gap before the content */
-  font-weight: bold; /* Optional styling preference */
-  box-sizing: border-box;
+.collection-view .view-header {
+  margin: 0;
 }
 
-/* Ensure content takes up the remaining space */
-.metadata .field-content {
-  flex: 1; /* Allows content to fill the rest of the row */
-  min-width: 0; /* Prevents long text from breaking the flex container */
+.book-grid .view-header,
+.people-grid .view-header {
+  margin: 0;
+}
+
+.book-grid .view-filters,
+.people-grid .view-filters {
+  margin-block-end: var(--sp2);
 }
 
 /* ==========================================================================
@@ -112,26 +135,35 @@ div#block-oliveskspaces-solrsearchcontentsearchresultspagerforblock {
   margin-bottom: 0;
 }
 
+div#block-oliveskspaces-solrsearchcontentadvancedsearchforblock h2 {
+  line-height: 1;
+}
+
 .facets-widget-links {
+  ul {
+    margin: 0;
+  }
+
   li {
     list-style-type: none;
   }
+
   a {
     text-decoration: none;
   }
+
   .facet-active,
   li:hover {
     background: #fff;
     border-radius: 4px;
   }
-  li.facet-item i.fa-solid.fa-ban {
-    color: darkred;
-  }
+
   .facet-active {
     padding-inline-start: 4px;
   }
-  ul {
-    margin: 0;
+
+  li.facet-item i.fa-solid.fa-ban {
+    color: darkred;
   }
 }
 
@@ -141,101 +173,79 @@ button#toggle-facets {
 
 .facet-wrapper .advanced-search-form {
   input[type="submit"] {
-    padding-inline: 1rem;
     margin-inline-end: 0.5rem;
+    padding-inline: 1rem;
     transition: all 0.3s ease;
   }
+
   input[type="submit"]:focus,
   input[type="submit"]:hover {
     background: #fff;
     box-shadow: 0px 5px 11px -2px rgb(0 0 0 / 39%);
   }
+
   input[type="submit"].advanced-search-form__search:hover,
   input[type="submit"].advanced-search-form__add:hover {
     background: lightgreen;
   }
+
   input[type="submit"].advanced-search-form__reset:hover,
   input[type="submit"].advanced-search-form__remove:hover {
     background: lightpink;
   }
+
   select {
+    min-width: 5.5rem;
     margin-bottom: 1.125rem;
     margin-inline-end: 0.5rem;
     padding-inline-end: 1.5rem;
-    min-width: 5.5rem;
   }
+
   input[type="text"] {
     width: 100%;
   }
 }
 
-/* ==========================================================================
-   Mirador Viewer
-   ========================================================================== */
-span#override-default-display-mode {
-  display: none;
-}
-.mirador16.mirador15 {
-  border-top: 2px solid #004744 !important;
-}
-.mirador28 {
-  display: none;
-}
-
+/* Pager */
 .advanced_search_result_pager .pager__group {
-  background: #f6f7f8;
   background: #e8d4ba6e;
   border-color: #ccc;
-  /* border-color: var(--color--lmmi-tan--75); */
+
+  > *:last-child {
+    margin-right: 1em;
+  }
 }
+
 .pager__link--is-active {
   border-color: #003a37;
 }
-.collection-view .view-header {
-  margin: 0;
-}
-.book-grid .view-header,
-.people-grid .view-header {
-  margin: 0;
-}
 
-.book-grid .view-filters,
-.people-grid .view-filters {
-  margin-block-end: var(--sp2);
+/* ==========================================================================
+   Mirador Viewer
+   ========================================================================== */
+span#override-default-display-mode {
+  display: none;
 }
 
-.book-grid .view-header,
-.people-grid .view-header {
-  margin: 0;
+.mirador16.mirador15 {
+  border-top: 2px solid #004744 !important;
 }
 
-.field--name-field-media-image img {
-  border: 1px solid #ccc;
-  padding: 4px;
+.mirador28 {
+  display: none;
 }
 
+/* ==========================================================================
+   Media & Footer
+   ========================================================================== */
+.field--name-field-media-image img,
 iframe.pdf {
-  border: 1px solid #ccc;
   padding: 4px;
+  border: 1px solid #ccc;
 }
 
 footer hr {
-  border: none;
   height: 2px;
+  border: none;
   background-color: var(--color--lmmi-tan--50);
 }
-div#block-oliveskspaces-solrsearchcontentadvancedsearchforblock h2 {
-  line-height: 1;
-}
-.views-field.views-field-field-abstract .field-content .label {
-  display: none;
-}
-.views-field.views-field-field-abstract .field-content p {
-  margin: 0;
-}
-.views-field.views-field-field-abstract {
-  line-height: 1.3;
-}
-.advanced_search_result_pager .pager__group > *:last-child {
-  margin-right: 1em;
-}
diff --git a/css/components/islandora_mods.css.bk b/css/components/islandora_mods.css.bk
new file mode 100755
index 0000000..6f7f5ae
--- /dev/null
+++ b/css/components/islandora_mods.css.bk
@@ -0,0 +1,241 @@
+/* ==========================================================================
+   Header / Branding
+   ========================================================================== */
+.logo-wrapper {
+  background: #33333399;
+}
+.logo--oliveskspaces h1 {
+  border: none;
+}
+div#site-header__inner {
+  border-right: 1px solid #eee;
+}
+
+/* ==========================================================================
+   Layout
+   ========================================================================== */
+
+/* ==========================================================================
+   Grid / Views
+   ========================================================================== */
+
+.grid-item {
+  margin-bottom: 2em;
+  border: 1px solid #ccc;
+  padding: 8px;
+  border-radius: 4px;
+  box-shadow: 0px 5px 11px -2px rgb(0 0 0 / 39%);
+  display: flex;
+  gap: 1em;
+}
+
+.grid-item .image {
+  flex: 0 0 175px; /* don't grow, don't shrink, base width 175px */
+  width: 175px; /* belt-and-suspenders, some browsers want this too */
+  img {
+    width: 100%;
+    border: 1px solid #ccc;
+    padding: 4px;
+    background: #ece8e3;
+  }
+}
+.grid-item .metadata {
+  flex: 1 1 auto; /* grow to fill remaining space */
+  min-width: 0; /* prevents text/content overflow issues in the flex item */
+}
+.grid-item .views-field-did-image img {
+  width: 100%;
+}
+.grid-item .title {
+  display: block;
+  padding: 0.5em 0;
+  line-height: 1.2;
+  margin: 5px 0 6px 0;
+  font-weight: bold;
+  border-bottom: 1px dotted #574938;
+  overflow-wrap: anywhere;
+
+  a {
+    text-decoration: none;
+    font-family: var(--font-serif);
+    color: var(--color--lmmi-tan);
+    font-size: 1.5rem;
+  }
+}
+.metadata .views-field {
+  display: flex;
+  gap: 0.5em;
+}
+.views-label,
+.field__label {
+  font-weight: bold;
+  font-family: var(--font-sans);
+  font-size: var(--font-size-base);
+  /* flex-basis: 7em; */
+  /* width: 6em; */
+  /* display: inline-block; */
+}
+
+.views-field.views-field-field-abstract li {
+  list-style-type: none;
+}
+
+/* Ensure the container is a flexbox */
+.metadata .views-field {
+  display: flex;
+  align-items: flex-start; /* Keeps labels aligned to the top of multi-line content */
+  /* margin-bottom: 0.5rem; */ /* Optional: adds spacing between rows */
+}
+
+/* Force uniform width on labels */
+.metadata .views-label {
+  --label-width: 5em;
+  flex: 0 0 var(--label-width); /* Fixed width: No grow, No shrink, 7em basis */
+  min-width: var(--label-width); /* Prevents shrinking below 7em */
+  width: var(--label-width); /* Consistency across older browsers */
+  margin-right: 1em; /* Creates a consistent gap before the content */
+  font-weight: bold; /* Optional styling preference */
+  box-sizing: border-box;
+}
+
+/* Ensure content takes up the remaining space */
+.metadata .field-content {
+  flex: 1; /* Allows content to fill the rest of the row */
+  min-width: 0; /* Prevents long text from breaking the flex container */
+}
+
+/* ==========================================================================
+   Search & Facets
+   ========================================================================== */
+div#block-oliveskspaces-solrsearchcontentsearchresultspagerforpage,
+div#block-oliveskspaces-solrsearchcontentsearchresultspagerforblock {
+  margin-bottom: 0;
+}
+
+.facets-widget-links {
+  li {
+    list-style-type: none;
+  }
+  a {
+    text-decoration: none;
+  }
+  .facet-active,
+  li:hover {
+    background: #fff;
+    border-radius: 4px;
+  }
+  li.facet-item i.fa-solid.fa-ban {
+    color: darkred;
+  }
+  .facet-active {
+    padding-inline-start: 4px;
+  }
+  ul {
+    margin: 0;
+  }
+}
+
+button#toggle-facets {
+  background: #013735;
+}
+
+.facet-wrapper .advanced-search-form {
+  input[type="submit"] {
+    padding-inline: 1rem;
+    margin-inline-end: 0.5rem;
+    transition: all 0.3s ease;
+  }
+  input[type="submit"]:focus,
+  input[type="submit"]:hover {
+    background: #fff;
+    box-shadow: 0px 5px 11px -2px rgb(0 0 0 / 39%);
+  }
+  input[type="submit"].advanced-search-form__search:hover,
+  input[type="submit"].advanced-search-form__add:hover {
+    background: lightgreen;
+  }
+  input[type="submit"].advanced-search-form__reset:hover,
+  input[type="submit"].advanced-search-form__remove:hover {
+    background: lightpink;
+  }
+  select {
+    margin-bottom: 1.125rem;
+    margin-inline-end: 0.5rem;
+    padding-inline-end: 1.5rem;
+    min-width: 5.5rem;
+  }
+  input[type="text"] {
+    width: 100%;
+  }
+}
+
+/* ==========================================================================
+   Mirador Viewer
+   ========================================================================== */
+span#override-default-display-mode {
+  display: none;
+}
+.mirador16.mirador15 {
+  border-top: 2px solid #004744 !important;
+}
+.mirador28 {
+  display: none;
+}
+
+.advanced_search_result_pager .pager__group {
+  background: #f6f7f8;
+  background: #e8d4ba6e;
+  border-color: #ccc;
+  /* border-color: var(--color--lmmi-tan--75); */
+}
+.pager__link--is-active {
+  border-color: #003a37;
+}
+.collection-view .view-header {
+  margin: 0;
+}
+.book-grid .view-header,
+.people-grid .view-header {
+  margin: 0;
+}
+
+.book-grid .view-filters,
+.people-grid .view-filters {
+  margin-block-end: var(--sp2);
+}
+
+.book-grid .view-header,
+.people-grid .view-header {
+  margin: 0;
+}
+
+.field--name-field-media-image img {
+  border: 1px solid #ccc;
+  padding: 4px;
+}
+
+iframe.pdf {
+  border: 1px solid #ccc;
+  padding: 4px;
+}
+
+footer hr {
+  border: none;
+  height: 2px;
+  background-color: var(--color--lmmi-tan--50);
+}
+div#block-oliveskspaces-solrsearchcontentadvancedsearchforblock h2 {
+  line-height: 1;
+}
+.views-field.views-field-field-abstract .field-content .label {
+  display: none;
+}
+.views-field.views-field-field-abstract .field-content p {
+  margin: 0;
+}
+.views-field.views-field-field-abstract {
+  line-height: 1.3;
+}
+.advanced_search_result_pager .pager__group > *:last-child {
+  margin-right: 1em;
+}