Add related SDG and targets tags to processes

I'm not sure why we were using squares to style these lists see commit
bbacd4546b) but I don't think it's very important and it breaks
displaying the list of related SDGs.

app/assets/stylesheets/legislation.scss

@@ -71,8 +71,13 @@
 .legislation-text {
   margin-bottom: 1rem;
 
+  > * {
+    @include grid-column-gutter;
+  }
+
   h3 a {
     color: $black;
+    margin-bottom: 1rem;
   }
 }
 

app/assets/stylesheets/legislation_process.scss

@@ -16,21 +16,6 @@
 
 .legislation-hero {
 
-  ul {
-    list-style: none;
-    margin-left: 0;
-
-    li {
-
-      &::before {
-        color: #8aa8be;
-        content: "■";
-        padding-right: $line-height / 4;
-        vertical-align: text-bottom;
-      }
-    }
-  }
-
   .title {
     font-weight: bold;
     text-transform: uppercase;

app/views/legislation/processes/_header_full.html.erb

@@ -3,6 +3,8 @@
   <%= markdown @process.description %>
 <% end %>
 
+<%= render SDG::TagListComponent.new(@process, linkable: false) %>
+
 <% if @process.additional_info.present? %>
   <div id="additional_info" class="is-hidden" data-toggler=".is-hidden">
     <hr>

app/views/legislation/processes/_process.html.erb

@@ -1,9 +1,7 @@
 <div id="<%= dom_id(process) %>" class="legislation clear">
   <div class="column row legislation-text">
     <div class="small-12 medium-8 column">
-      <div class="legislation-text">
-        <h3><%= link_to process.title, process %></h3>
-      </div>
+      <h3><%= link_to process.title, process %></h3>
     </div>
 
     <div class="small-12 medium-4 column">
@@ -17,6 +15,10 @@
     <div class="small-12 medium-11 column end">
       <%= markdown(process.summary.present? ? process.summary : first_paragraph(process.description)) %>
     </div>
+
+    <div class="small-12 medium-11 column end">
+      <%= render SDG::TagListComponent.new(process, limit: 5, linkable: false) %>
+    </div>
   </div>
 
   <% if process.enabled_phases_and_publications_count.positive? %>

spec/system/legislation/processes_spec.rb

@@ -127,6 +127,19 @@ describe "Legislation" do
         expect(page).to have_content("past published")
       end
     end
+
+    scenario "Show SDG tags when feature is enabled", :js do
+      Setting["feature.sdg"] = true
+      Setting["sdg.process.legislation"] = true
+
+      create(:legislation_process, sdg_goals: [SDG::Goal[1]],
+                                   sdg_targets: [SDG::Target["1.1"]])
+
+      visit legislation_processes_path
+
+      expect(page).to have_selector "img[alt='1. No Poverty']"
+      expect(page).to have_content "target 1.1"
+    end
   end
 
   context "process page" do
@@ -210,6 +223,19 @@ describe "Legislation" do
 
         expect(page).to have_current_path new_legislation_process_proposal_path(process)
       end
+
+      scenario "Show SDG tags when feature is enabled", :js do
+        Setting["feature.sdg"] = true
+        Setting["sdg.process.legislation"] = true
+
+        process = create(:legislation_process, sdg_goals: [SDG::Goal[1]],
+                                               sdg_targets: [SDG::Target["1.1"]])
+
+        visit legislation_process_path(process)
+
+        expect(page).to have_selector "img[alt='1. No Poverty']"
+        expect(page).to have_content "target 1.1"
+      end
     end
 
     context "homepage" do