search grid

css/components/islandora_mods.css

@@ -1,28 +1,44 @@
 /* ==========================================================================
    Search & Facets
    ========================================================================== */
+
+/* --------------------------------------------------------------------------
+   Search results pager
+   -------------------------------------------------------------------------- */
 div#block-oliveskspaces-solrsearchcontentsearchresultspagerforpage {
   margin-bottom: 0;
 }
 
+div#block-olivescraipe-solrsearchcontentsearchresultspagerforpage {
+  margin: 1em;
+}
+
+/* --------------------------------------------------------------------------
+   Facets
+   -------------------------------------------------------------------------- */
 .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;
   }
@@ -32,36 +48,62 @@ button#toggle-facets {
   background: #013735;
 }
 
+/* --------------------------------------------------------------------------
+   Advanced search form
+   -------------------------------------------------------------------------- */
 .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%;
   }
 }
 
+/* --------------------------------------------------------------------------
+   Search view layout
+   -------------------------------------------------------------------------- */
+.search-view .view-header {
+  margin: 0;
+}
+
+.search-view .view-filters {
+  margin-block-end: var(--sp2);
+}
+
+span#override-default-display-mode {
+  display: none;
+}
+
+/* --------------------------------------------------------------------------
+   Grid view
+   -------------------------------------------------------------------------- */
 .view-grid > .view-content {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
@@ -74,22 +116,10 @@ button#toggle-facets {
     grid-template-columns: repeat(1, 1fr);
   }
 }
-.search-view .view-header {
-  margin: 0;
-}
-
-.search-view .view-filters {
-  margin-block-end: var(--sp2);
-}
-
-div#block-olivescraipe-solrsearchcontentsearchresultspagerforpage {
-  margin: 1em;
-}
-
-span#override-default-display-mode {
-  display: none;
-}
 
+/* --------------------------------------------------------------------------
+   Grid items
+   -------------------------------------------------------------------------- */
 .grid-item {
   border: 1px solid #ccc;
   padding: 8px;
@@ -99,7 +129,40 @@ span#override-default-display-mode {
 
 .grid-item__image {
   margin: 0;
+
   img {
     width: 100%;
   }
 }
+
+.grid-item .views-field {
+  font-size: 0.9rem;
+  line-height: 1.4;
+
+  .views-label {
+    font-weight: bold;
+  }
+}
+
+.views-field-dc-title {
+  line-height: 1.3;
+  border-bottom: 1px dotted #bbb;
+  padding-bottom: 5px;
+  margin-bottom: 5px;
+  font-size: 1em !important;
+
+  a {
+    font-family: var(--font-serif);
+    font-weight: bold;
+    text-decoration: none;
+    font-size: 1em !important;
+  }
+}
+
+.views-field.views-field-dgi-image-discovery {
+  margin-bottom: 0.5em;
+
+  img {
+    border: 1px solid #ccc;
+  }
+}

css/components/islandora_mods.css.bk

@@ -0,0 +1,105 @@
+/* ==========================================================================
+   Search & Facets
+   ========================================================================== */
+div#block-oliveskspaces-solrsearchcontentsearchresultspagerforpage {
+  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%;
+  }
+}
+
+.view-grid > .view-content {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  /*margin: 0.47214rem 0 0.47214rem 2.61803rem;*/
+}
+
+@media only screen and (max-width: 600px) {
+  .view-grid > .view-content {
+    display: grid;
+    grid-template-columns: repeat(1, 1fr);
+  }
+}
+.search-view .view-header {
+  margin: 0;
+}
+
+.search-view .view-filters {
+  margin-block-end: var(--sp2);
+}
+
+div#block-olivescraipe-solrsearchcontentsearchresultspagerforpage {
+  margin: 1em;
+}
+
+span#override-default-display-mode {
+  display: none;
+}
+
+.grid-item {
+  border: 1px solid #ccc;
+  padding: 8px;
+  border-radius: 4px;
+  box-shadow: 0px 5px 11px -2px rgb(0 0 0 / 39%);
+}
+
+.grid-item__image {
+  margin: 0;
+  img {
+    width: 100%;
+  }
+}