sufia 4.0.0.rc2 → 4.0.0

data/app/views/generic_files/edit.html.erb

@@ -2,7 +2,7 @@
   <%= render partial: "edit", formats: [:js] %>
 <% end %>
 
-<%= render partial: 'breadcrumbs' %>
+<%= render_breadcrumbs builder: Sufia::BootstrapBreadcrumbsBuilder %>
 <h1 class="lower">Edit <%= @generic_file %></h1>
 
 <div class="row">

data/app/views/generic_files/new.html.erb

@@ -1,29 +1,30 @@
 <h2>Upload</h2>
 <%# using partials rather than inlining, so implementers can add or change stuff on this page without much duplication %>
-<ul class="nav nav-tabs">
-  <li class="active"><a href="#local" data-toggle="tab"><i class="glyphicon glyphicon-folder-open"></i> <%= t('sufia.upload.my_computer.tab_label')%></a></li>
+<ul class="nav nav-tabs" role="tablist" title="Data Source Selectors" id="upload_tabs">
+  <li class="active"  id="computer_tab" title="<%= t('sufia.upload.my_computer.sr_tab_label')+' '+ t('sufia.upload.my_computer.tab_label') %>"><a role="tab" href="#local" data-toggle="tab"><i class="glyphicon glyphicon-folder-open" aria-hidden="true"></i><%= t('sufia.upload.my_computer.tab_label')%></a></li>
   <% if Sufia.config.browse_everything %>
-    <li><a href="#browse_everything" data-toggle="tab"><i class="glyphicon glyphicon-cloud-download"></i> <%= t('sufia.upload.browse_everything.tab_label')%></a></li>
+    <li  id="browse_everything_tab" title="<%= t('sufia.upload.browse_everything.sr_tab_label')+' '+ t('sufia.upload.browse_everything.tab_label') %>" aria-activedescendant="browse_everything_link"><a role="tab" href="#browse_everything" data-toggle="tab" id="browse_everything_link" ><i class="glyphicon glyphicon-cloud-download" aria-hidden="true"></i> <%= t('sufia.upload.browse_everything.tab_label')%></a></li>
   <% end %>
   <% if Sufia.config.enable_local_ingest %>
-    <li><a href="#ingest" data-toggle="tab"><i class="glyphicon glyphicon-hdd"></i> <%= t('sufia.upload.local_ingest.tab_label')%></a></li>
+    <li role="tab" id="local_ingest_tab"><a href="#ingest" data-toggle="tab"><i class="glyphicon glyphicon-hdd" aria-hidden="true"></i> <%= t('sufia.upload.local_ingest.tab_label')%></a></li>
   <% end %>
 </ul>
 
 <div class="tab-content">
-  <div class="tab-pane active" id="local">
+  <div class="tab-pane active" id="local" aria-labelledby="computer_tab" role="tabpanel">
+    <span class="sr-only"><%= t("sufia.upload.my_computer.sr_instructions") %></span>
     <%= render partial: 'multiple_upload' %>
   </div>
 
   <% if Sufia.config.browse_everything %>
-    <div class="tab-pane" id="browse_everything">
+    <div class="tab-pane" id="browse_everything"  aria-labelledby="browse_everything_tab" role="tabpanel">
       <%= render partial: 'browse_everything' %>
     </div>
   <% end %>
 
 
   <% if Sufia.config.enable_local_ingest %>
-    <div class="tab-pane" id="ingest">
+    <div class="tab-pane" id="ingest" aria-labelledby="local_ingest_tab">
       <%= render partial: 'generic_files/local_file_import' %>
     </div>
   <% end %>

data/app/views/generic_files/show.html.erb

@@ -41,7 +41,7 @@
   initialize_audio();
 <% end %>
 
-<%= render partial: 'generic_files/breadcrumbs' %>
+<%= render_breadcrumbs builder: Sufia::BootstrapBreadcrumbsBuilder %>
 <div class="container-fluid">
 <div class="row">
   <div class="col-xs-12 col-sm-4">

data/app/views/generic_files/stats.html.erb

@@ -1,4 +1,4 @@
-<%= render partial: 'generic_files/breadcrumbs' %>
+<%= render_breadcrumbs builder: Sufia::BootstrapBreadcrumbsBuilder %>
 
 <!-- Adapted from jquery-flot examples https://github.com/flot/flot/blob/master/examples/visitors/index.html -->
 <!--[if lte IE 8]><%= javascript_include_tag 'excanvas' %><![endif]-->

data/app/views/generic_files/upload/_form_fields.html.erb

@@ -9,15 +9,15 @@
             <div class="col-md-7">
                 <!-- The fileinput-button span is used to style the file input field as button -->
                 <span class="btn btn-success fileinput-button">
-                    <i class="glyphicon glyphicon-plus"></i>
-                    <span>Select files...</span>
+                    <i class="glyphicon glyphicon-plus" aria-hidden="true"></i>
+                    <span aria-hidden="true">Select files...</span>
                     <input type="file" name="files[]" multiple />
                 </span>
                 <% ua = request.env['HTTP_USER_AGENT'] %>
                 <% if !!(ua =~ /Chrome/) %>
                 <span class="btn btn-success fileinput-button">
-                    <i class="glyphicon glyphicon-plus"></i>
-                    <span>Select folder...</span>
+                    <i class="glyphicon glyphicon-plus"  aria-hidden="true"></i>
+                    <span aria-hidden="true">Select folder...</span>
                     <input type="file" name="files[]" directory webkitdirectory mozdirectory />
                 </span>
                 <% end %>

data/app/views/homepage/_featured_fields.html.erb

@@ -1,18 +1,20 @@
-      <h3>
-        <%= link_to truncate(featured.title_or_label, length: 28, separator: ' '),
-          sufia.generic_file_path(featured), title: featured.title_or_label  %>
-      </h3>
-      <div> 
-        <%= link_to_profile featured.depositor("no depositor value") %>
-      </div>
-      <div> 
-        <%= link_to truncate(featured.label, length: 25),
-            sufia.generic_file_path(featured), title: featured.label %>
-      </div>
-      <div> 
-        <%= link_to_facet_list(featured.resource_type, 'desc_metadata__resource_type', 'no resource specified') %>
-      </div>
-      <div> 
-        <%= link_to_facet_list(featured.tags, 'desc_metadata__tag', 'no keywords specified') %>
-      </div>
-
+<h3>
+  <span class="sr-only">Title</span>
+  <%= link_to truncate(featured.title_or_label, length: 28, separator: ' '), sufia.generic_file_path(featured), title: featured.title_or_label  %>
+</h3>
+<div> 
+  <span class="sr-only">Depositor</span>
+  <%= link_to_profile featured.depositor("no depositor value") %>
+</div>
+<div> 
+  <span class="sr-only">Filename</span>
+  <%= link_to truncate(featured.label, length: 25), sufia.generic_file_path(featured), title: featured.label %>
+</div>
+<div> 
+  <span class="sr-only">File type</span>
+  <%= link_to_facet_list(featured.resource_type, 'desc_metadata__resource_type', 'no resource specified') %>
+</div>
+<div> 
+  <span class="sr-only">Keywords</span>
+  <%= link_to_facet_list(featured.tags, 'desc_metadata__tag', 'no keywords specified') %>
+</div>

data/app/views/homepage/_home_content.html.erb

@@ -1,22 +1,23 @@
 <div class="col-xs-12 col-sm-6">
   <ul id="homeTabs" class="nav nav-tabs">
-    <li><a href="#featured_container" data-toggle="tab"><%= t('sufia.homepage.featured_works') %></a></li>
-    <li><a href="#recently_uploaded" data-toggle="tab">Recently Uploaded</a></li>
+    <li><a href="#featured_container" data-toggle="tab" role="tab" id="featureTab"><%= t('sufia.homepage.featured_works') %></a></li>
+    <li><a href="#recently_uploaded" data-toggle="tab" role="tab" id="recentTab"><%= t('sufia.homepage.recently_uploaded') %></a></li>
   </ul>
   <div class="tab-content">
-    <div class="tab-pane fade in" id="featured_container">
+    <div class="tab-pane fade in" id="featured_container" role="tabpanel" aria-labelledby="featureTab">
       <%= render partial: '/homepage/featured_works' %>
     </div>
-     <div class="tab-pane fade" id="recently_uploaded">
-       <%= render partial: 'recents', locals: { recent_documents: @recent_documents, msg: "No public work has been contributed.", display_thumbs: true, display_access: false } %>
-     </div>
+    <div class="tab-pane fade" id="recently_uploaded" role="tabpanel" aria-labelledby="recentTab">
+      <%= render partial: 'recents', locals: { recent_documents: @recent_documents, msg: t('sufia.homepage.no_public'), display_thumbs: true, display_access: false } %>
+    </div>
   </div>
 </div><!-- /.col-xs-6 -->
 <div class="col-xs-12 col-sm-6">
   <div>
     <%- if blacklight_config.respond_to?(:tag_cloud_field_name) && blacklight_config.tag_cloud_field_name %>
         <div class="row">
-          <h2 class="heading1 pull-left">Explore</h2>
+          <h2 class="heading1 pull-left"><%= t('sufia.homepage.explore') %></h2>
+          <span class="sr-only"><%= t('sufia.homepage.sr_explore') %></span>
           <%= render partial: 'tagcloud', locals: { tag_cloud_field_name: blacklight_config.tag_cloud_field_name } %>
         </div>
     <%- end %>

data/app/views/homepage/_recent_document.html.erb

@@ -9,8 +9,7 @@
       <% end %>
       <td>
         <h3>
-          <%= link_to truncate(recent_document.title_or_label, length: 28, separator: ' '), sufia.generic_file_path(recent_document.noid), title: recent_document.title_or_label  %>
-
+          <span class="sr-only">Title</span><%= link_to truncate(recent_document.title_or_label, length: 28, separator: ' '), sufia.generic_file_path(recent_document.noid), title: recent_document.title_or_label  %>
           <% if display_access %>
               <% if recent_document.registered? %>
                  <span class="label label-info" title="<%=t('sufia.institution_name') %>"><%=t('sufia.institution_name') %></span>
@@ -22,9 +21,9 @@
           <% end %>
         </h3>
         <p>
-          <%= link_to truncate(recent_document.label, length: 25),
+          <span class="sr-only">Filename</span><%= link_to truncate(recent_document.label, length: 25),
               sufia.generic_file_path(recent_document.noid), title: recent_document.label %><br />
-          <%= link_to_facet_list(recent_document.tags, 'desc_metadata__tag', 'no keywords specified').html_safe %>
+          <span class="sr-only">Keywords</span><%= link_to_facet_list(recent_document.tags, 'desc_metadata__tag', 'no keywords specified').html_safe %>
         </p>
       </td>
     </tr>

data/app/views/homepage/_recents.html.erb

@@ -4,9 +4,12 @@
     <% msg = 'You have no documents to display. Contribute some of your documents!' if msg.blank? %>
     <h3><%= msg %></h3>
   <% else %>
-
     <div id="recent_docs">
       <table class="table table-bordered table-striped">
+        <tr>
+          <th scope="col">Depositor</th>
+          <th scope="col">File Details</th>
+        </tr>
         <%= render partial: "recent_document", collection: recent_documents, locals: {display_thumbs: display_thumbs, display_access: display_access} %>
       </table>
     </div>

data/app/views/homepage/_tagcloud.html.erb

@@ -1,7 +1,8 @@
-<a role="button" class="btn btn-default tag-toggle-list">List</a>
-<ul class="tagcloud" data-facet="<%= tag_cloud_field_name %>"></ul>
-<div class="btn-group btn-group-justified tag-sort">
+<a role="button" aria-hidden="true" class="btn btn-default tag-toggle-list">List</a>
+<label for="tag-cloud" class="sr-only">Sort By</label>
+<div id="tag-cloud" class="btn-group btn-group-justified tag-sort">
   <a role="button" class="btn btn-default tag-sort-za">Z-A</a>
   <a role="button" class="btn btn-default tag-sort-az">A-Z</a>
   <a role="button" class="btn btn-default tag-sort-numerical">Rank</a>
-</div>
+</div>
+<ul class="tagcloud" data-facet="<%= tag_cloud_field_name %>"></ul>

data/app/views/kaminari/blacklight_compact/_paginator.html.erb

@@ -0,0 +1,23 @@
+<%# This is copied from blacklight-5.5.3/app/views/kaminari/blacklight_compact/_paginator.html.erb
+so we can add a aria-hidden="true" attribute around it. If that gets added into
+Blacklight, this file can be removed
+-%>
+<% if total_pages > 1 -%>
+  <%# #render checks if total_pages > 1, so we can't put our fallback
+  in here .. -%>
+  <%= paginator.render do -%>
+    <div aria-hidden="true" class="page_links">
+      <%= prev_page_tag %> |
+      <span class="page_entries">
+        <%= page_entries_info %>
+      </span> |
+      <%= next_page_tag %>
+    </div>
+  <% end -%>
+<% else -%>
+    <div aria-hidden="true" class="page_links">
+      <span class="page_entries">
+        <%= page_entries_info %>
+      </span>
+    </div>
+<% end -%>

data/app/views/my/_action_menu.html.erb

@@ -1,27 +1,30 @@
 <div class="btn-group">
-  <button class="btn btn-sm dropdown-toggle" data-toggle="dropdown">Select an action <span class="caret"></span>
+  <button class="btn btn-sm dropdown-toggle" data-toggle="dropdown" type="button" id="dropdownMenu_<%=noid%>" aria-haspopup="true">
+    <span class="sr-only">Press to </span>
+    Select an action
+    <span class="caret" aria-hidden="true"></span>
   </button>
-  <ul class="dropdown-menu dropdown-menu-right">
-    <li>
-    <%= link_to raw('<i class="glyphicon glyphicon-link over"></i> Single-Use Link to File'), '#',
+  <ul role="menu" class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenu_<%=noid%>">
+    <li role="menuitem" tabindex="-1">
+    <%= link_to raw('<i class="glyphicon glyphicon-link over" aria-hidden="true"></i> Single-Use Link to File'), '#',
       class: "copypaste itemicon itemcode", title: "Single-Use Link to File", id: "copy_link_#{noid}" %>
     </li>
-    <li>
-    <%= link_to raw('<i class="glyphicon glyphicon-pencil"></i> Edit File'), sufia.edit_generic_file_path(noid),
+    <li role="menuitem" tabindex="-1">
+    <%= link_to raw('<i class="glyphicon glyphicon-pencil" aria-hidden="true"></i> Edit File'), sufia.edit_generic_file_path(noid),
       class: 'itemicon itemedit', title: 'Edit File' %>
     </li>
-    <li>
-    <%= link_to raw('<i class="glyphicon glyphicon-download-alt"></i> Download File'), sufia.download_path(noid),
+    <li role="menuitem" tabindex="-1">
+    <%= link_to raw('<i class="glyphicon glyphicon-download-alt" aria-hidden="true"></i> Download File'), sufia.download_path(noid),
       class: 'itemicon itemdownload', title: 'Download File', target: '_new' %>
     </li>
-    <li>
-    <%= link_to raw('<i class="glyphicon glyphicon-trash"></i> Delete File'), sufia.generic_file_path(noid),
+    <li role="menuitem" tabindex="-1">
+    <%= link_to raw('<i class="glyphicon glyphicon-trash" aria-hidden="true"></i> Delete File'), sufia.generic_file_path(noid),
       class: 'itemicon itemtrash', title: 'Delete File', method: :delete, data: {
       confirm: "Deleting a file from #{t('sufia.product_name')} is permanent. Click OK to delete this file from #{t('sufia.product_name')}, or Cancel to cancel this operation" } %>
     </li>
-    <li>
+    <li role="menuitem" tabindex="-1">
       <%= display_trophy_link(@user, noid) do |text| %>
-        <i class='glyphicon glyphicon-star'></i> <%= text %>
+        <i aria-hidden="true" class='glyphicon glyphicon-star'></i> <%= text %>
       <% end %>
     </li>
   </ul>

data/app/views/my/_collection_action_menu.html.erb

@@ -1,13 +1,15 @@
 <div class="btn-group">
-  <button class="btn btn-sm dropdown-toggle" data-toggle="dropdown">Select an action <span class="caret"></span>
+  <button class="btn btn-sm dropdown-toggle" data-toggle="dropdown" type="button" id="dropdownMenu_<%=noid%>" aria-haspopup="true">
+    <span class="sr-only">Press to </span>
+    Select an action <span class="caret" aria-hidden="true"></span>
   </button>
-  <ul class="dropdown-menu dropdown-menu-right">
-   <li>
-   <%= link_to raw('<i class="glyphicon glyphicon-pencil"></i> Edit Collection'), collections.edit_collection_path(noid),
+  <ul role="menu" class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenu_<%=noid%>">
+   <li role="menuitem" tabindex="-1">
+   <%= link_to raw('<i class="glyphicon glyphicon-pencil" aria-hidden="true"></i> Edit Collection'), collections.edit_collection_path(noid),
      class: 'itemicon itemedit', title: 'Edit Collection' %>
    </li>
-   <li>
-   <%= link_to raw('<i class="glyphicon glyphicon-trash"></i> Delete Collection'), collections.collection_path(noid),
+   <li role="menuitem" tabindex="-1">
+   <%= link_to raw('<i class="glyphicon glyphicon-trash" aria-hidden="true"></i> Delete Collection'), collections.collection_path(noid),
      class: 'itemicon itemtrash', title: 'Delete Collection', method: :delete, data: {
      confirm: "Deleting a collection from #{t('sufia.product_name')} is permanent. Click OK to delete this collection from #{t('sufia.product_name')}, or Cancel to cancel this operation" } %>
    </li>

data/app/views/my/_facets.html.erb

@@ -9,7 +9,7 @@
     </button>
 
   <h4>
-  	<%= t('blacklight.search.facets.title') %>
+  	<%= t('sufia.dashboard.my.filter', type: current_tab.pluralize) %>
   </h4>
     </div>
 

data/app/views/my/_index_partials/_default_group.html.erb

@@ -3,7 +3,7 @@
 <% unless params[:display_type] == 'list' %>
   <thead>
   <tr>
-    <th><%= render_check_all %></th>
+    <th><label for="check_all" class="sr-only"><%= t("sufia.dashboard.my.sr.check_all_label") %></label><%= render_check_all %></th>
     <th>Title</th>
     <th class="sorts-dash"><i id="desc_metadata__date_uploaded_dtsi" class="<%=params[:sort]== "desc_metadata__date_uploaded_dtsi desc" ? 'caret' : params[:sort]== "desc_metadata__date_uploaded_dtsi asc" ? 'caret up' : ''%>"></i>Date Uploaded</th>
     <th>Visibility</th>

data/app/views/my/_index_partials/_list_collections.html.erb

@@ -4,17 +4,23 @@
 on element ids -->
 <% noid = document.noid %>
 <tr id="document_<%= noid %>" class="<%= cycle("","zebra") %>">
-  <td width="3%"></td> 
+  <td width="3%"></td>
   <td width="41%">
     <div class="media">
-      <%= link_to [collections, document], class: "pull-left" do %>
+      <%= link_to [collections, document], class: "pull-left", "aria-hidden" => true do %>
         <span class="glyphicon glyphicon-th collection-icon-small">
       <% end %>
       <div class="media-body">
-        <h4 class="media-heading">
-          <%= link_to document.title_or_label, collections.collection_path(noid), id: "src_copy_link#{noid}" %>
-          <a href="#" class="small" title="Click for more details"><i id="expand_<%= noid %>" class="glyphicon glyphicon-chevron-right"></i></a>
-        </h4>
+        <div class="media-heading">
+          <%= link_to  collections.collection_path(noid), id: "src_copy_link#{noid}" do %>
+              <span class="sr-only"><%= t("sufia.dashboard.my.sr.show_label") %> </span>
+              <%= document.title_or_label %>
+          <% end %>
+          <a href="#" class="small" title="Click for more details">
+            <i id="expand_<%= noid %>" class="glyphicon glyphicon-chevron-right" aria-hidden="true"></i>
+            <span class="sr-only"> <%= "#{t("sufia.dashboard.my.sr.detail_label")} #{document.title_or_label}" %></span>
+          </a>
+        </div>
       </div>
     </div>
   </td>

data/app/views/my/_index_partials/_list_files.html.erb

@@ -1,7 +1,9 @@
 <% noid = document.noid %>
 <tr id="document_<%= noid %>" class="<%= cycle("", "zebra") %>">
   <% gf = GenericFile.load_instance_from_solr(document.id) %>
-  <td><%= batch_edit_select(document) %>&nbsp;
+  <td>
+    <label for="batch_document_<%= document.id %>" class="sr-only"><%=t("sufia.dashboard.my.sr.batch_checkbox")%></label>
+    <%= batch_edit_select(document) %>&nbsp;
     <%# This block is for adding/removing the magic wand while batch updates are processing %>
     <% if gf.processing? %>
         <i class="glyphicon glyphicon-time <%= 'ss-'+gf.batch.noid %>"/>
@@ -11,14 +13,20 @@
   </td>
   <td>
     <div class="media">
-      <%= link_to sufia.generic_file_path(document), class: "pull-left" do %>
+      <%= link_to sufia.generic_file_path(document), class: "pull-left", "aria-hidden" => true do %>
         <%= render_thumbnail_tag document, { class: "hidden-xs file_listing_thumbnail" }, { suppress_link: true } %>
       <% end %>
       <div class="media-body">
-        <h4 class="media-heading">
-          <%= link_to document.title_or_label, sufia.generic_file_path(noid), id: "src_copy_link#{noid}", class: "#{'document-title' if document.title_or_label == document.label}" %>
-          <a href="#" class="small" title="Click for more details"><i id="expand_<%= noid %>" class="glyphicon glyphicon-chevron-right"></i></a>
-        </h4>
+        <div class="media-heading">
+          <%= link_to  sufia.generic_file_path(noid), id: "src_copy_link#{noid}", class: "#{'document-title' if document.title_or_label == document.label}" do %>
+              <span class="sr-only"><%= t("sufia.dashboard.my.sr.show_label") %> </span>
+              <%= document.title_or_label %>
+          <% end %>
+          <a href="#" class="small" title="Click for more details">
+            <i id="expand_<%= noid %>" class="glyphicon glyphicon-chevron-right"  aria-hidden="true"></i>
+            <span class="sr-only"> <%= "#{t("sufia.dashboard.my.sr.detail_label")} #{document.title_or_label}" %></span>
+          </a>
+        </div>
         <%= render_collection_list(gf) %>
       </div>
     </div>

data/app/views/my/index.html.erb

@@ -1,3 +1,4 @@
+<% current_tab = @selected_tab.to_s %>
 <% content_for :head do %>
     <%= auto_discovery_link_tag(:rss, sufia.url_for(params.merge(format: 'rss')), title: "RSS for results") %>
     <%= auto_discovery_link_tag(:atom, sufia.url_for(params.merge(format: 'atom')), title: "Atom for results") %>
@@ -7,9 +8,12 @@
   <%= render partial: 'scripts', formats: [:js] %>
 <% end %>
 
-<% @page_title = application_name + " Dashboard" %>
+<% @page_title = "#{current_tab.capitalize} listing" %>
+
 
 <ul class="nav nav-tabs" id="my_nav">
+  <h1 class="sr-only">Listing Navigation Bar</h1>
+  <span class="sr-only">You are currently listing your <%= current_tab.pluralize %> .  You have <%= @response.docs.count %> <%= current_tab.pluralize(@response.docs.count)%> </span>
   <li class="<%= "active" if @selected_tab == :files %>">
     <%= link_to t('sufia.dashboard.my.files'), sufia.dashboard_files_path %>
   </li>
@@ -26,12 +30,13 @@
 
 <%= render 'search_header' %>
 
+<h1 class="sr-only"><%=@page_title %></h1>
 <%= render partial: 'document_list' %>
 
 <% content_for :sidebar do %>
   <%= link_to t("sufia.dashboard.upload"), sufia.new_generic_file_path, class: "btn btn-primary" %>
   <%= link_to t("sufia.dashboard.create_collection"), collections.new_collection_path, id: "hydra-collection-add", class: "btn btn-primary" %>
-  <%= render partial: 'facets' %>
+  <%= render partial: 'facets', locals: {current_tab: current_tab} %>
 <% end %>
 
 <%= render 'results_pagination' %>

data/app/views/records/edit_fields/_suffix.html.erb

@@ -4,7 +4,6 @@
             <%= add_field(key) %>
           <% end %>
             &nbsp;
-          <%= help_icon(key) %>
           <%= render partial: "records/rights_modal" if key == "rights" %>
         <% else %>
           <%= subtract_field(key) %>

data/app/views/shared/_attributes.html.erb

@@ -1,26 +1,26 @@
       <table class="table">
         <tr>
-          <th><h4>Title:</h4></th>
+          <th><span class="attribute-label h4">Title:</span></th>
           <td><%= work.title %></td>
         </tr>
         <tr>
-          <th><h4>Depositor:<h4></div>
+          <th><span class="attribute-label h4">Depositor:</span></div>
           <td><%= link_to_profile work.depositor("no depositor value") %></td>
         </tr>
         <tr>
-          <th><h4>Creator:</h4></th>
+          <th><span class="attribute-label h4">Creator:</span></th>
           <td><%= work.creator %></td>
         </tr>
         <tr>
-          <th><h4>Description:</h4></th>
+          <th><span class="attribute-label h4">Description:</span></th>
           <td><%= iconify_auto_link(work.description) %></th>
         </tr>
         <tr>
-          <th><h4>Keywords:</h4></th>
+          <th><span class="attribute-label h4">Keywords:</span></th>
           <td><%= work.tags.join(', ') %></td>
         </tr>
         <tr>
-          <th><h4>Date Uploaded:</h4></th>
+          <th><span class="attribute-label h4">Date Uploaded:</span></th>
           <td><%= work.date_uploaded %></td>
         </tr>
       </table>