Skip to content
This repository has been archived by the owner on Feb 13, 2020. It is now read-only.

Commit

Permalink
Restyled & rearranged work show page to improve alignment, usability.…
Browse files Browse the repository at this point in the history
… Partially addresses RDR-270.
  • Loading branch information
seanaery committed Jun 21, 2018
1 parent 3cc25fe commit 0b89819
Show file tree
Hide file tree
Showing 6 changed files with 152 additions and 61 deletions.
88 changes: 88 additions & 0 deletions app/assets/stylesheets/rdr-show.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,101 @@
/* Work Show Page Style Overrides */
/* ============================== */

.work-show-columns {
display: flex;
@media screen and (max-width: $screen-sm-max) {
display: block;
}
& > div {
align-items: stretch;
}
}

dl.work-show {
&.dataset {
border-top: 4px solid #a1b70d;
padding-top: 20px;
margin-top: 20px;
column-count: 2;
column-gap: 20px;
}
& dt {
padding: 0;
margin: 0;
color: #666;
&:not(:first-child) {
margin-top: 15px;
}
}
& dd {
padding: 0;
margin: 0;
& ul {
padding-left: 0;
}
}
}

.contextual-info {
background: #fafafa;
border-left: 2px solid #eee;
padding: 30px 10px;
@media screen and (max-width: $screen-xs-max) {
border-left: none;
}
& .representative-media, .canonical-image {
display: block;
padding: 0.5em 0;
max-width: 150px;
margin: 0 auto;
margin-top: 20px;
box-shadow: 3px 3px 15px #ccc;
}
& h2 {
font-size: 22px;
border-bottom: 1px dotted #ccc;
padding-bottom: 10px;
}
}

.show-actions {
padding: 15px 0;
a.btn {
margin-bottom: 5px;
vertical-align: top;
}
}

.resp-sharing-button__link {
margin: 0;
}

.resp-sharing-button {
padding: 0.2em 0.3em 0em 0.3em;
}

.resp-sharing-button__link[title="Tumblr"], .resp-sharing-button--tumblr {
display: none;
}

.stats-button {
&:before {
content: "\f080";
font-family: "FontAwesome";
padding-right: 0.3em;
};
}

table.related-files {
& tbody > tr > td {
border-top: none;
}
& td.thumbnail {
width: 50px;
padding: 0;
margin: 10px;
}
& .btn {
font-size: 85%;
}
}
7 changes: 6 additions & 1 deletion app/assets/stylesheets/rdr.scss
Original file line number Diff line number Diff line change
Expand Up @@ -53,11 +53,16 @@ body {

#content-wrapper {
background: #fff;
padding: 20px 0;
padding: 15px 30px;
}

.alert {
margin: 0 0 22px 0;
}

.breadcrumb {
background-color: transparent;
padding-left: 0;
}

.site-footer {
Expand Down
3 changes: 0 additions & 3 deletions app/views/hyrax/base/_show_actions.html.erb
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
<%# NOTE: Overrides Hyrax partial %>
<div class="show-actions">
<% if Hyrax.config.analytics? %>
<%= link_to "Analytics", presenter.stats_path, id: 'stats', class: 'btn btn-default', data: { turbolinks: false } %>
<% end %>
<% if presenter.editor? %>
<%= link_to "Edit", edit_polymorphic_path([main_app, presenter]), class: 'btn btn-default' %>
<%= link_to "Delete", [main_app, presenter], class: 'btn btn-danger', data: { confirm: "Delete this #{presenter.human_readable_type}?" }, method: :delete %>
Expand Down
7 changes: 7 additions & 0 deletions app/views/hyrax/base/_work_title.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<% presenter.title.each_with_index do |title, index| %>
<div class="row">
<div class="col-sm-12">
<h2><%= title %></h2>
</div>
</div>
<% end %>
46 changes: 23 additions & 23 deletions app/views/hyrax/datasets/_attribute_rows.html.erb
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
<%= presenter.attribute_to_html(:creator, render_as: :faceted, label: I18n.t("rdr.show.fields.creator")) %>
<%= presenter.attribute_to_html(:bibliographic_citation, label: I18n.t("rdr.show.fields.bibliographic_citation")) %>
<%= presenter.attribute_to_html(:doi, label: I18n.t("rdr.show.fields.doi")) %>
<%= presenter.attribute_to_html(:subject, render_as: :faceted, label: I18n.t("rdr.show.fields.subject")) %>
<%= presenter.attribute_to_html(:available, render_as: :faceted_date, label: I18n.t("rdr.show.fields.available")) %>
<%= presenter.attribute_to_html(:ark, label: I18n.t("rdr.show.fields.ark")) %>
<%= presenter.attribute_to_html(:alternative, label: I18n.t("rdr.show.fields.alternative")) %>
<%= presenter.attribute_to_html(:contributor, render_as: :faceted, label: I18n.t("rdr.show.fields.contributor")) %>
<%= presenter.attribute_to_html(:replaces, label: I18n.t("rdr.show.fields.replaces")) %>
<%= presenter.attribute_to_html(:is_replaced_by, label: I18n.t("rdr.show.fields.is_replaced_by")) %>
<%= presenter.attribute_to_html(:affiliation, render_as: :faceted, label: I18n.t("rdr.show.fields.affiliation")) %>
<%= presenter.attribute_to_html(:publisher, render_as: :faceted, label: I18n.t("rdr.show.fields.publisher")) %>
<%= presenter.attribute_to_html(:temporal, render_as: :faceted_date, label: I18n.t("rdr.show.fields.temporal")) %>
<%= presenter.attribute_to_html(:based_near_label, label: I18n.t("rdr.show.fields.based_near_label")) %>
<%= presenter.attribute_to_html(:language, render_as: :faceted, label: I18n.t("rdr.show.fields.language")) %>
<%= presenter.attribute_to_html(:resource_type, render_as: :faceted, label: I18n.t("rdr.show.fields.resource_type")) %>
<%= presenter.attribute_to_html(:format, render_as: :faceted, label: I18n.t("rdr.show.fields.format")) %>
<%= presenter.attribute_to_html(:related_url, render_as: :external_link, label: I18n.t("rdr.show.fields.related_url")) %>
<%= presenter.attribute_to_html(:provenance, label: I18n.t("rdr.show.fields.provenance")) %>
<%= presenter.attribute_to_html(:rights_note, label: I18n.t("rdr.show.fields.rights_note")) %>
<%= presenter.attribute_to_html(:funding_agency, label: I18n.t("rdr.show.fields.funding_agency")) %>
<%= presenter.attribute_to_html(:grant_number, label: I18n.t("rdr.show.fields.grant_number")) %>
<%= presenter.attribute_to_html(:contact, label: I18n.t("rdr.show.fields.contact")) %>
<%= presenter.attribute_to_html(:creator, render_as: :faceted, label: I18n.t("rdr.show.fields.creator"), html_dl: true) %>
<%= presenter.attribute_to_html(:bibliographic_citation, label: I18n.t("rdr.show.fields.bibliographic_citation"), html_dl: true) %>
<%= presenter.attribute_to_html(:doi, label: I18n.t("rdr.show.fields.doi"), html_dl: true) %>
<%= presenter.attribute_to_html(:subject, render_as: :faceted, label: I18n.t("rdr.show.fields.subject"), html_dl: true) %>
<%= presenter.attribute_to_html(:available, render_as: :faceted_date, label: I18n.t("rdr.show.fields.available"), html_dl: true) %>
<%= presenter.attribute_to_html(:ark, label: I18n.t("rdr.show.fields.ark"), html_dl: true) %>
<%= presenter.attribute_to_html(:alternative, label: I18n.t("rdr.show.fields.alternative"), html_dl: true) %>
<%= presenter.attribute_to_html(:contributor, render_as: :faceted, label: I18n.t("rdr.show.fields.contributor"), html_dl: true) %>
<%= presenter.attribute_to_html(:replaces, label: I18n.t("rdr.show.fields.replaces"), html_dl: true) %>
<%= presenter.attribute_to_html(:is_replaced_by, label: I18n.t("rdr.show.fields.is_replaced_by"), html_dl: true) %>
<%= presenter.attribute_to_html(:affiliation, render_as: :faceted, label: I18n.t("rdr.show.fields.affiliation"), html_dl: true) %>
<%= presenter.attribute_to_html(:publisher, render_as: :faceted, label: I18n.t("rdr.show.fields.publisher"), html_dl: true) %>
<%= presenter.attribute_to_html(:temporal, render_as: :faceted_date, label: I18n.t("rdr.show.fields.temporal"), html_dl: true) %>
<%= presenter.attribute_to_html(:based_near_label, label: I18n.t("rdr.show.fields.based_near_label"), html_dl: true) %>
<%= presenter.attribute_to_html(:language, render_as: :faceted, label: I18n.t("rdr.show.fields.language"), html_dl: true) %>
<%= presenter.attribute_to_html(:resource_type, render_as: :faceted, label: I18n.t("rdr.show.fields.resource_type"), html_dl: true) %>
<%= presenter.attribute_to_html(:format, render_as: :faceted, label: I18n.t("rdr.show.fields.format"), html_dl: true) %>
<%= presenter.attribute_to_html(:related_url, render_as: :external_link, label: I18n.t("rdr.show.fields.related_url"), html_dl: true) %>
<%= presenter.attribute_to_html(:provenance, label: I18n.t("rdr.show.fields.provenance"), html_dl: true) %>
<%= presenter.attribute_to_html(:rights_note, label: I18n.t("rdr.show.fields.rights_note"), html_dl: true) %>
<%= presenter.attribute_to_html(:funding_agency, label: I18n.t("rdr.show.fields.funding_agency"), html_dl: true) %>
<%= presenter.attribute_to_html(:grant_number, label: I18n.t("rdr.show.fields.grant_number"), html_dl: true) %>
<%= presenter.attribute_to_html(:contact, label: I18n.t("rdr.show.fields.contact"), html_dl: true) %>
62 changes: 28 additions & 34 deletions app/views/hyrax/datasets/show.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -3,44 +3,38 @@
<%= render 'shared/citations' %>

<div class="row work-type">
<div class="col-xs-12">
<%= render 'work_type', presenter: @presenter %>
</div>
<div class="col-xs-12">&nbsp;</div>
<div itemscope itemtype="http://schema.org/CreativeWork" class="col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<%= render 'work_title', presenter: @presenter %>
<%= render 'work_title', presenter: @presenter %>
<%= render "show_actions", presenter: @presenter %>

<div class="row work-show-columns">

<div class="col-sm-9">
<% if @presenter.universal_viewer? %>
<%= render 'representative_media', presenter: @presenter, viewer: true %>
<% end %>
<%= render 'work_description', presenter: @presenter %>
<%= render 'metadata', presenter: @presenter %>
<%= render 'items', presenter: @presenter %>
<%= render 'dataset_versions', presenter: @presenter %>
</div>
<div class="panel-body">
<div class="row">
<%= render 'workflow_actions_widget', presenter: @presenter %>
<% if @presenter.universal_viewer? %>
<div class="col-sm-12">
<%= render 'representative_media', presenter: @presenter, viewer: true %>
</div>
<% end %>
<div class="col-sm-3 text-center">
<%= render 'representative_media', presenter: @presenter, viewer: false unless @presenter.universal_viewer? %>
<%= render 'altmetric_badge', presenter: @presenter %>
<%# TODO: consider in future whether to add this partial back in %>
<%#= render 'citations', presenter: @presenter %>
<%= render 'social_media' %>
</div>
<div class="col-sm-9">
<%= render 'work_description', presenter: @presenter %>
<%= render 'metadata', presenter: @presenter %>
<%= render 'dataset_versions', presenter: @presenter %>
</div>
<div class="col-sm-12">
<%= render 'relationships', presenter: @presenter %>
<%= render 'items', presenter: @presenter %>
<%# TODO: we may consider adding these partials in the future %>
<%# = render 'sharing_with', presenter: @presenter %>
<%# = render 'user_activity', presenter: @presenter %>
</div>
<div class="contextual-info col-sm-3 text-center">
<%= render 'representative_media', presenter: @presenter, viewer: false unless @presenter.universal_viewer? %>
<%= render 'altmetric_badge', presenter: @presenter %>
<%# TODO: consider in future whether to add this partial back in %>
<%#= render 'citations', presenter: @presenter %>
<%= render 'social_media' %>
<%= render 'relationships', presenter: @presenter %>
<div>
<small class="text-muted"><%= @presenter.permission_badge %> <%= @presenter.workflow.badge %></small>
</div>
<% if Hyrax.config.analytics? %>
<%= link_to "Usage Stats", @presenter.stats_path, id: 'stats', class: 'btn btn-default btn-link stats-button', data: { turbolinks: false } %>
<% end %>
</div>
</div>

<%= render 'workflow_actions_widget', presenter: @presenter %>

</div>
</div>

0 comments on commit 0b89819

Please sign in to comment.