Merge pull request #1385 from consul/polls-design

polls design

app/assets/stylesheets/participation.scss

@@ -1322,8 +1322,19 @@ ul.ballot-list {
     color: $brand;
   }
 
-  .callout.warning a {
+  .callout {
-    color: $color-warning;
+
+    &.warning a {
+      color: $color-warning;
+    }
+
+    &.primary a {
+      color: $color-info;
+    }
+
+    &.alert a {
+      color: $color-alert;
+    }
   }
 
   .info {
@@ -1361,9 +1372,13 @@ ul.ballot-list {
   .dates {
     color: $text-medium;
     font-size: $small-font-size;
+
+    @include breakpoint(medium) {
+      float: right;
+    }
   }
 
-  h3 a {
+  h4 a {
     color: $text;
   }
 }
@@ -1372,6 +1387,12 @@ h2.questions-callout {
   font-size: $base-font-size;
 }
 
+h3.section-title-divider {
+  border-bottom: 2px solid $brand;
+  color: $brand;
+  margin-bottom: $line-height;
+}
+
 .poll-question {
   padding: 0 $line-height;
 

app/views/polls/_poll_group.html.erb

@@ -0,0 +1,23 @@
+<% poll_group.each do |poll| %>
+  <div class="poll">
+    <div class="row">
+      <div class="small-12 column">
+        <div class="dates"><%= poll_dates(poll) %></div>
+        <h4 class="inline-block"><%= link_to poll.name, poll %></h4>
+        <ul>
+          <% poll.questions.each do |question| %>
+            <li><%= link_to question.title, question_path(question) %></li>
+          <% end %>
+        </ul>
+        <ul class="no-bullet margin-top tags">
+          <% poll.geozones.each do |g| %>
+            <li class="inline-block"><span><%= g.name %></span></li>
+          <% end %>
+        </ul>
+      </div>
+      <div class="small-12 column">
+        <%= link_to t("polls.index.participate_button"), poll, class: "button" %>
+      </div>
+    </div>
+  </div>
+<% end %>

app/views/polls/index.html.erb

@@ -15,27 +15,16 @@
   </div>
 
   <div class="small-12 medium-9 column margin-top">
-    <% @polls.each do |poll| %>
+    <% polls_by_geozone_restriction = @polls.group_by(&:geozone_restricted) %>
-      <div class="poll">
+
-        <div class="row">
+    <% if polls_by_geozone_restriction[false].present? %>
-          <div class="small-12 column">
+      <h3 class="section-title-divider"><%= t("polls.index.no_geozone_restricted") %></h3>
-            <h3><%= link_to poll.name, poll %></h3>
+      <%= render partial: 'poll_group', locals: {poll_group: polls_by_geozone_restriction[false]} %>
-            <p class="dates"><%= poll_dates(poll) %></p>
+    <% end %>
-            <ul class="no-bullet margin-top tags">
+
-              <% poll.geozones.each do |g| %>
+    <% if polls_by_geozone_restriction[true].present? %>
-                <li class="inline-block"><span><%= g.name %></span></li>
+      <h3 class="section-title-divider"><%= t("polls.index.geozone_restricted") %></h3>
-              <% end %>
+      <%= render partial: 'poll_group', locals: {poll_group: polls_by_geozone_restriction[true]} %>
-            </ul>
-          </div>
-          <div class="small-12 column">
-            <% if can? :answer, poll %>
-              <%= link_to t("polls.index.participate_button"), poll, class: "button" %>
-            <% else %>
-              <%= link_to t("polls.index.view_button"), poll %>
-            <% end %>
-          </div>
-        </div>
-      </div>
     <% end %>
 
     <%= paginate @polls %>

config/locales/en.yml

@@ -403,7 +403,8 @@ en:
         expired: "Expired"
       title: "Polls"
       participate_button: "Participate in this poll"
-      view_button: "View details about this poll"
+      no_geozone_restricted: "All city"
+      geozone_restricted: "Districts"
     show:
       dates_title: "Participation dates"
       cant_answer_not_logged_in: "You must %{signin} or %{signup} to participate."

config/locales/es.yml

@@ -403,7 +403,8 @@ es:
         expired: "Terminadas"
       title: "Votaciones"
       participate_button: "Participar en esta votación"
-      view_button: "Ver detalles de la votación"
+      no_geozone_restricted: "Toda la ciudad"
+      geozone_restricted: "Distritos"
     show:
       dates_title: "Fechas de participación"
       cant_answer_not_logged_in: "Necesitas %{signin} o %{signup} para participar."

spec/features/polls/polls_spec.rb

@@ -11,7 +11,7 @@ feature 'Polls' do
 
       polls.each do |poll|
         expect(page).to have_content(poll.name)
-        expect(page).to have_link("View details about this poll")
+        expect(page).to have_link("Participate in this poll")
       end
     end