Adds image to legislation proposals views

app/assets/stylesheets/pages.scss

@@ -10,14 +10,24 @@
 // ----------------------
 
 .jumbo {
+  background: $highlight;
   margin-bottom: $line-height;
   margin-top: rem-calc(-24);
   padding-bottom: $line-height;
   padding-top: $line-height;
 
+  @include breakpoint(medium) {
+    padding: rem-calc(24) 0;
+  }
+
   &.light {
     background: #ecf0f1;
   }
+
+  h1,
+  p {
+    color: $text;
+  }
 }
 
 .lead {

app/assets/stylesheets/participation.scss

@@ -685,7 +685,8 @@
 }
 
 .budget-investments-list .budget-investment,
-.proposals-list .proposal {
+.proposals-list .proposal,
+.legislation-proposals .proposal {
 
   @include breakpoint(medium) {
 

app/views/legislation/proposals/_form.html.erb

@@ -31,6 +31,12 @@
                                    aria: {describedby: "video-url-help-text"} %>
     </div>
 
+    <% if feature?(:allow_images) %>
+      <div class="images small-12 column">
+        <%= render 'images/nested_image', imageable: @proposal, f: f %>
+      </div>
+    <% end %>
+
     <div class="documents small-12 column" data-max-documents="<%= Legislation::Proposal.max_documents_allowed %>">
       <%= render 'documents/nested_documents', documentable: @proposal, f: f %>
     </div>

app/views/legislation/proposals/_proposal.html.erb

@@ -1,11 +1,20 @@
 <div id="<%= dom_id(proposal) %>"
      class="proposal clear <%= ("successful" if proposal.total_votes > Proposal.votes_needed_for_success) %>"
      data-type="proposal">
-  <div class="panel">
+  <div class="panel <%= ('with-image' if proposal.image.present?) %>">
     <div class="icon-successful"></div>
-    <div class="row">
 
-      <div class="small-12 medium-9 column">
+    <% if proposal.image.present? %>
+      <div class="row">
+        <div class="small-12 medium-3 large-2 column text-center">
+          <%= image_tag proposal.image_url(:thumb),
+                        alt: proposal.image.title.unicode_normalize %>
+        </div>
+        <div class="small-12 medium-6 large-7 column margin-top">
+    <% else %>
+      <div class="row">
+        <div class="small-12 medium-9 column">
+    <% end %>
         <div class="proposal-content">
           <% cache [locale_and_user_status(proposal), 'index', proposal, proposal.author] do %>
             <h3><%= link_to proposal.title, legislation_process_proposal_path(proposal.legislation_process_id, proposal) %></h3>

app/views/legislation/proposals/show.html.erb

@@ -39,6 +39,8 @@
 
         </div>
 
+        <%= render_image(@proposal.image, :large, true) if @proposal.image.present? %>
+
         <br>
         <p>
           <%= t("proposals.show.code") %>
@@ -113,9 +115,13 @@
   </div>
 <% end %>
 
-<div class="row">
-  <div class="small-12 column">
-    <%= render "legislation/proposals/filter_subnav" %>
+<div class="additional-content">
+  <div class="filter-subnav">
+    <div class="row">
+      <div class="small-12 column">
+        <%= render "legislation/proposals/filter_subnav" %>
+      </div>
+    </div>
   </div>
 </div>