Adds styles for titles and filters

app/assets/stylesheets/debates.scss

@@ -138,10 +138,6 @@
 // 02. Index
 // - - - - - - - - - - - - - - - - - - - - - - - - -
 
-.featured-debates {
-  margin-top: rem-calc(23);
-}
-
 .debate-featured {
 
   .panel {
@@ -244,7 +240,6 @@
 
 .debates-list {
   margin-bottom: rem-calc(48);
-  margin-top: rem-calc(24);
 }
 
 .debate {

app/assets/stylesheets/participacion.scss

@@ -10,6 +10,7 @@
 // 08. Forms
 // 09. Alerts
 // 10. User account
+// 11. Filters
 //
 
 // 01. Variables
@@ -111,7 +112,6 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 .sidebar {
-  margin-top: rem-calc(24);
   margin-bottom: rem-calc(48);
 }
 
@@ -556,3 +556,36 @@ form {
     }
   }
 }
+
+// 11. Filters
+// - - - - - - - - - - - - - - - - - - - - - - - - -
+
+.filters {
+
+  h2 {
+    display: inline-block;
+    font-size: rem-calc(24);
+    margin: rem-calc(24) 0;
+  }
+
+  select {
+    height: auto;
+    margin: rem-calc(24) rem-calc(6);
+    min-width: rem-calc(180);
+    outline: 0;
+    padding: rem-calc(12);
+    width: auto;
+
+    optgroup {
+      font-size: rem-calc(14);
+    }
+
+    option {
+
+      &:after {
+        content: "a";
+        font-family: "icons";
+      }
+    }
+  }
+}

app/views/debates/index.html.erb

@@ -1,6 +1,67 @@
 <section role="main">
+
+  <!-- Filters -->
+  <div class="filters row">
+    <div class="small-12 column">
+      <h2><%= t("debates.index.showing") %></h2>
+
+      <select class="inline-block">
+        <option value="filter_debates">
+          <%= t("debates.index.filter_debates") %>
+        </option>
+        <option value="filter_initiatives">
+          <%= t("debates.index.filter_initiatives") %>
+        </option>
+        <option value="filter_debates_and_initiatives">
+          <%= t("debates.index.filter_debates_and_initiatives") %>
+        </option>
+      </select>
+
+      <select class="inline-block">
+        <option value="filter_news">
+          <%= t("debates.index.filter_news") %>
+        </option>
+        <option value="filter_votes">
+          <%= t("debates.index.filter_votes") %>
+        </option>
+        <option value="filter_rated">
+          <%= t("debates.index.filter_rated") %>
+        </option>
+      </select>
+    </div>
+  </div>
+  <!-- /. Filters -->
+
+  <!-- Filter topic results -->
+  <div class="filters row">
+    <div class="small-12 column">
+      <h2><%= t("debates.index.showing") %></h2>
+
+      <select class="inline-block">
+        <option value="filter_debates">
+          <%= t("debates.index.filter_debates") %>
+        </option>
+        <option value="filter_initiatives">
+          <%= t("debates.index.filter_initiatives") %>
+        </option>
+        <option value="filter_debates_and_initiatives">
+          <%= t("debates.index.filter_debates_and_initiatives") %>
+        </option>
+      </select>
+
+      <h2><%= t("debates.index.tag") %></h2>
+
+      <select class="inline-block">
+        <option value="">Lista de temas</option>
+      </select>
+
+      <h2>(43)</h2>
+    </div>
+  </div>
+  <!-- /. Filter topic results -->
+
   <div class="row">
-    <div id="debates" class="small-12 medium-9 column debates-list">
+    <div id="debates" class="debates-list small-12 medium-9 column">
       <%= render @debates %>
     </div>
     <div class="small-12 medium-3 column">

app/views/welcome/index.html.erb

@@ -1,5 +1,10 @@
 <section role="main">
-  <div id="featured-debates" class="featured-debates row">
+  <div class="filters row">
+    <div class="small-12 column">
+      <h2><%= t("welcome.featured_debates") %></h2>
+    </div>
+  </div>
+  <div id="featured-debates" class="row">
     <%= render partial: "featured_debate", collection: @featured_debates %>
   </div>
 </section>

config/locales/en.yml

@@ -27,6 +27,14 @@ en:
   debates:
     index:
       create_debate: Create a debate
+      showing: You are seeing
+      tag: with the topic
+      filter_debates: debates
+      filter_initiatives: initiatives
+      filter_debates_and_initiatives: debates and initiatives
+      filter_news: the newest
+      filter_votes: the most voted
+      filter_rated: the best rated
     debate:
       debate: Debate
       comments:
@@ -124,3 +132,5 @@ en:
     default: "You are not authorized to access this page."
     manage:
       all: "You are not authorized to %{action} %{subject}."
+  welcome:
+    featured_debates: Features debates

config/locales/es.yml

@@ -27,6 +27,14 @@ es:
   debates:
     index:
       create_debate: Crea un debate
+      showing: "Estás viendo"
+      tag: "con el tema"
+      filter_debates: debates
+      filter_initiatives: iniciativas
+      filter_debates_and_initiatives: debates e iniciativas
+      filter_news: "más nuevos"
+      filter_votes: "más votados"
+      filter_rated: mejor valorados
     debate:
       debate: Debate
       comments:
@@ -122,17 +130,7 @@ es:
       subject: Alguien ha respondido a tu comentario
   unauthorized:
     default: "No tienes permiso para acceder a esta página."
-    index:
-      all: "No tienes permiso para listar %{subject}"
-    show:
-      all: "No tienes permiso para ver %{subject}"
-    edit:
-      all: "No tienes permiso para editar %{subject}"
-    update:
-      all: "No tienes permiso para modificar %{subject}"
-    create:
-      all: "No tienes permiso para crear %{subject}"
-    delete:
-      all: "No tienes permiso para borrar %{subject}"
     manage:
       all: "No tienes permiso para realizar la acción '%{action}' sobre %{subject}."
+  welcome:
+    featured_debates: Debates destacados