Merge pull request #616 from alphagov/adjust-publisher-metadata-posit…

…ion-across-formats Make publisher metadata styling consistent
alphagov · Dec 18, 2017 · fe4cc11 · fe4cc11
2 parents 4a0baeb + 5ed4aea
commit fe4cc11
Show file tree

Hide file tree

Showing 10 changed files with 34 additions and 37 deletions.
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -17,6 +17,7 @@
 @import 'helpers/add-title-margin';
 @import "helpers/task-list-title";
 @import "helpers/content-bottom-margin";
+@import "helpers/publisher-metadata-with-logo";
 
 // components
 @import 'components/*';

diff --git a/app/assets/stylesheets/components/_publisher-metadata.scss b/app/assets/stylesheets/components/_publisher-metadata.scss
@@ -1,7 +1,6 @@
 .app-c-publisher-metadata {
   @include responsive-bottom-margin;
   @include core-16;
-  border-top: 1px solid $border-colour;
   padding-top: $gutter-half;
 }
 

diff --git a/app/assets/stylesheets/helpers/_publisher-metadata-with-logo.scss b/app/assets/stylesheets/helpers/_publisher-metadata-with-logo.scss
@@ -0,0 +1,22 @@
+// FIXME: These styles will become ubiquitous as we
+// roll out the combination of metadata + logo across
+// formats so they may ultimately become component styles.
+.metadata-logo-wrapper {
+  @extend %contain-floats;
+  border-top: 1px solid $border-colour;
+  margin-left: $gutter-half;
+  margin-right: $gutter-half;
+
+  .metadata-column {
+    padding-left: 0;
+  }
+
+  .metadata-logo {
+    padding-bottom: $gutter-half;
+    padding-top: $gutter-half;
+
+    @include media(tablet) {
+      float: right;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/views/_publication.scss b/app/assets/stylesheets/views/_publication.scss
@@ -6,36 +6,6 @@
     direction: rtl;
     text-align: start;
   }
-
-  // FIXME: These styles will become ubiquitous as we
-  // roll out the combination of metadata + logo across
-  // formats so they can ultimately become component styles.
-  .metadata-logo-wrapper {
-    @extend %contain-floats;
-    border-top: 1px solid $border-colour;
-    margin-left: $gutter-half;
-    margin-right: $gutter-half;
-
-    .metadata-column {
-      padding-left: 0;
-    }
-
-    // FIXME: This override can be removed once all formats
-    // with the publisher-metadata component are converted
-    // to render metadata + optional logo
-    .app-c-publisher-metadata {
-      border: 0;
-    }
-
-    .metadata-logo {
-      padding-bottom: $gutter-half;
-      padding-top: $gutter-half;
-
-      @include media(tablet) {
-        float: right;
-      }
-    }
-  }
 }
 
 
diff --git a/app/views/content_items/case_study.html.erb b/app/views/content_items/case_study.html.erb
@@ -6,10 +6,11 @@
   <%= render 'shared/translations' %>
   <div class="column-two-thirds">
     <%= render 'govuk_component/lead_paragraph', text: @content_item.description %>
-    <%= render 'components/publisher-metadata', @content_item.publisher_metadata %>
   </div>
 </div>
 
+<%= render 'shared/publisher_metadata_with_logo' %>
+
 <div class="grid-row">
   <div class="column-two-thirds content-bottom-margin">
     <div class="responsive-bottom-margin">

diff --git a/app/views/content_items/fatality_notice.html.erb b/app/views/content_items/fatality_notice.html.erb
@@ -6,10 +6,11 @@
   <%= render 'shared/translations' %>
   <div class="column-two-thirds">
     <%= render 'govuk_component/lead_paragraph', text: @content_item.description %>
-    <%= render 'components/publisher-metadata', @content_item.publisher_metadata %>
   </div>
 </div>
 
+<%= render 'shared/publisher_metadata_with_logo' %>
+
 <div class="grid-row">
   <div class="column-two-thirds content-bottom-margin">
     <div class="responsive-bottom-margin">

diff --git a/app/views/content_items/news_article.html.erb b/app/views/content_items/news_article.html.erb
@@ -7,10 +7,11 @@
   <%= render 'shared/translations' %>
   <div class="column-two-thirds">
     <%= render 'govuk_component/lead_paragraph', text: @content_item.description %>
-    <%= render 'components/publisher-metadata', @content_item.publisher_metadata %>
   </div>
 </div>
 
+<%= render 'shared/publisher_metadata_with_logo' %>
+
 <div class="grid-row">
   <div class="column-two-thirds content-bottom-margin">
     <div class="responsive-bottom-margin">

diff --git a/app/views/content_items/speech.html.erb b/app/views/content_items/speech.html.erb
@@ -7,10 +7,11 @@
   <%= render 'shared/translations' %>
   <div class="column-two-thirds">
     <%= render 'govuk_component/lead_paragraph', text: @content_item.description %>
-    <%= render 'components/publisher-metadata', @content_item.publisher_metadata %>
   </div>
 </div>
 
+<%= render 'shared/publisher_metadata_with_logo' %>
+
 <div class="grid-row">
   <div class="column-two-thirds content-bottom-margin">
     <div class="responsive-bottom-margin">

diff --git a/app/views/content_items/world_location_news_article.html.erb b/app/views/content_items/world_location_news_article.html.erb
@@ -7,10 +7,11 @@
   <%= render 'shared/translations' %>
   <div class="column-two-thirds">
     <%= render 'govuk_component/lead_paragraph', text: @content_item.description %>
-    <%= render 'components/publisher-metadata', @content_item.publisher_metadata %>
   </div>
 </div>
 
+<%= render 'shared/publisher_metadata_with_logo' %>
+
 <div class="grid-row">
   <div class="column-two-thirds content-bottom-margin">
     <div class="responsive-bottom-margin">

diff --git a/app/views/shared/_publisher_metadata_with_logo.html.erb b/app/views/shared/_publisher_metadata_with_logo.html.erb
@@ -1,4 +1,4 @@
-<% render_logo = @content_item.national_statistics? -%>
+<% render_logo = @content_item.try(:national_statistics?) -%>
 <div class="grid-row">
   <div class="metadata-logo-wrapper<%= ' responsive-bottom-margin' if render_logo %>">
     <div class="column-two-thirds metadata-column">