Merge pull request #2345 from samvera/i137_collection_show_styling

Public facing collections show page styling
samvera · Sep 24, 2024 · 6041d6c · 6041d6c
2 parents 394fc04 + 033b603
commit 6041d6c
Show file tree

Hide file tree

Showing 5 changed files with 105 additions and 13 deletions.
diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
@@ -27,9 +27,9 @@
 //= require tether
 // Required by Blacklight
 //= require blacklight/blacklight
-//= require blacklight_gallery
 //= require admin_color_select
 //= require blacklight_advanced_search
+//= require blacklight_gallery/default
 
 // Moved the Hyku JS *above* the Hyrax JS to resolve #1187 (following
 // a pattern found in ScholarSphere)
@@ -57,7 +57,6 @@
 //= require jquery.flot.pie
 //= require flot_graph
 //= require statistics_tab_manager
-//= require blacklight_gallery/default
 
 // Required for blacklight range limit
 //= require blacklight_range_limit/range_limit_distro_facets

diff --git a/app/assets/javascripts/blacklight_gallery.js b/app/assets/javascripts/blacklight_gallery.js
diff --git a/app/assets/stylesheets/hyku.scss b/app/assets/stylesheets/hyku.scss
@@ -397,6 +397,11 @@ a.btn.btn-default.restore-default-color.with-color-hint {
       width: 50%;
     }
   }
+
+  // makes hamburger menu visible for mobile
+  .navbar-toggler-icon {
+    display: inline-block !important;
+  }
 }
 
 @media (max-width: 768px) {
@@ -574,6 +579,15 @@ span.constraint-value p, .facet-values p {
   .hyc-bugs .hyc-last-updated,
   .hyc-title {
     padding: 0;
+
+    h1 {
+      color: #000;
+    }
+  }
+
+  .hyc-created-by,
+  .hyc-last-updated {
+    color: #000 !important;
   }
 
   .hyc-item-count {

diff --git a/app/assets/stylesheets/hyrax.scss b/app/assets/stylesheets/hyrax.scss
@@ -22,11 +22,89 @@
 
 // for catalog search result snippets
 .highlight {
-    background: #ffff00;
+  background: #ffff00;
   font-weight: 700;
 }
 
 // to make collection form labels bold
 #collection-edit-controls label.control-label {
   font-weight: bold !important;
 }
+
+/* Collection show page */
+// Contribute back to Hyrax?
+
+// nav search header
+#search-form-header {
+  // adds bootstrap class to element
+  label[for="search-field-header"] {
+    @extend .sr-only;
+  }
+
+  .form-group {
+    justify-content: right;
+  }
+}
+
+.hyc-bugs {
+  margin-top: 10px;
+}
+
+.hyrax-collections-show {
+  .document-metadata {
+    dd {
+      word-break: break-all;
+    }
+  }
+}
+
+#hyc-collection-metadata-total_items,
+#hyc-collection-metadata-creator {
+  align-items: baseline;
+}
+
+// collections gallery view
+#documents {
+
+  // hide the bookmark button
+  .caption-area {
+    input[name="commit"] {
+      display: none;
+    }
+  }
+
+  .document {
+    margin-top: 6px;
+    padding-top: 6px;
+
+    .document-thumbnail {
+      .img-thumbnail {
+        padding: 0.25rem;
+        background-color: #fff;
+        border: 1px solid #dee2e6;
+        border-radius: 0.25rem;
+      }
+    }
+  }
+}
+
+// adds bootstrap class to element
+.documents-gallery {
+  @extend .row-cols-lg-4;
+}
+
+// pagination
+.hyc-bl-pager {
+  .pagination {
+    display: flex;
+  }
+}
+
+@media (max-width: 768px) {
+  .hyc-banner {
+    .hyc-bugs {
+      flex-wrap: wrap;
+    }
+  }
+}
+/* End Collection show page */
diff --git a/app/views/hyrax/collections/show.html.erb b/app/views/hyrax/collections/show.html.erb
@@ -13,13 +13,18 @@
       <% else %>
         <div class="hyc-generic">
       <% end %>
-
-      <div class="hyc-title">
-        <h1><%= markdown(@presenter.title.first) %></h1>
-        <%= @presenter.collection_type_badge %>
-        <%= @presenter.permission_badge %>
+      <div class="d-flex space-between">
+        <div class="hyc-title">
+          <h1><%= markdown(@presenter.title.first) %></h1>
+          <%= @presenter.collection_type_badge %>
+          <%= @presenter.permission_badge %>
+        </div>
+        <div class="hyc-item-count">
+          <%= pluralize(@presenter.total_viewable_items, t('.item_count')) %>
+        </div>
       </div>
 
+
       <% unless @presenter.logo_record.blank? %>
           <div class="hyc-logos">
             <% @presenter.logo_record.each_with_index  do |lr, i| %>
@@ -37,10 +42,7 @@
       <% end %>
 
       <% unless @presenter.total_viewable_items.blank? %>
-          <div class="hyc-bugs">
-            <div class="hyc-item-count">
-              <%= pluralize(@presenter.total_viewable_items, t('.item_count')) %></div>
-
+          <div class="hyc-bugs d-flex space-between">
               <% unless @presenter.creator.blank? %>
                   <div class="hyc-created-by">Created by: <%= @presenter.creator.first %></div>
               <% end %>