Merge pull request #1190 from consul/accesibility

Accesibility

app/views/comments/_comment.html.erb

@@ -74,6 +74,7 @@
 
             <% if comment.children.size > 0 %>
               <%= link_to "", class: "js-toggle-children relative", data:  {'id': "#{dom_id(comment)}"} do %>
+                <span class="sr-only"><%= t("shared.show") %></span>
                 <span id="<%= dom_id(comment) %>_children_arrow" class="icon-arrow-down"></span> <%= t("comments.comment.responses", count: comment.children.size) %>
               <% end %>
             <% else %>

app/views/comments/_votes.html.erb

@@ -7,7 +7,9 @@
       <% if can?(:vote, comment) %>
         <%= link_to vote_comment_path(comment, value: 'yes'),
             method: "post", remote: true do %>
-            <span class="icon-angle-up"></span>
+            <span class="icon-angle-up">
+              <span class="sr-only"><%= t('votes.agree') %></span>
+            </span>
         <% end %>
       <% else %>
         <span class="icon-angle-up"></span>
@@ -19,7 +21,9 @@
       <% if can?(:vote, comment) %>
         <%= link_to vote_comment_path(comment, value: 'no'),
             method: "post", remote: true do %>
-            <span class="icon-angle-down"></span>
+            <span class="icon-angle-down">
+              <span class="sr-only"><%= t('votes.disagree') %></span>
+            </span>
         <% end %>
       <% else %>
         <span class="icon-angle-down"></span>

app/views/debates/_votes.html.erb

@@ -3,7 +3,9 @@
   <div class="in-favor inline-block">
     <%= link_to vote_debate_path(debate, value: 'yes'),
         class: "like #{voted_classes[:in_favor]}", title: t('votes.agree'), method: "post", remote: true do %>
-      <span class="icon-like"></span>
+      <span class="icon-like">
+        <span class="sr-only"><%= t('votes.agree') %></span>
+      </span>
       <span class="percentage"><%= votes_percentage('likes', debate) %></span>
     <% end %>
   </div>
@@ -12,7 +14,9 @@
 
   <div class="against inline-block">
     <%= link_to vote_debate_path(debate, value: 'no'), class: "unlike #{voted_classes[:against]}", title: t('votes.disagree'), method: "post", remote: true do %>
-      <span class="icon-unlike"></span>
+      <span class="icon-unlike">
+        <span class="sr-only"><%= t('votes.disagree') %></span>
+      </span>
       <span class="percentage"><%= votes_percentage('dislikes', debate) %></span>
     <% end %>
   </div>

app/views/devise/menu/_login_items.html.erb

@@ -1,6 +1,7 @@
 <% if user_signed_in? %>
   <li>
     <%= link_to notifications_path, class: "notifications", accesskey: "n" do %>
+      <span class="sr-only"><%= t("layouts.header.notifications") %></span>
       <% if current_user.notifications_count > 0 %>
         <span class="icon-circle" aria-hidden="true"></span>
         <span class="icon-notification" aria-hidden="true" title="<%= t('layouts.header.new_notifications', count: current_user.notifications_count).html_safe %>">

app/views/welcome/index.html.erb

@@ -21,24 +21,24 @@
   <main>
     <div class="row text-center margin">
       <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_debate.png", size: "168x168", alt: t("welcome.debates.alt"), title: t("welcome.debates.title")) %>
+        <%= image_tag("icon_home_debate.png", size: "168x168", alt: "", title: t("welcome.debates.title")) %>
         <h2><%= t("welcome.debates.title") %></h2>
         <p><%= t("welcome.debates.description") %></p>
 
       </div>
       <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_proposal.png", size: "168x168", alt: t("welcome.proposal.alt"), title: t("welcome.proposal.title"))  %>
+        <%= image_tag("icon_home_proposal.png", size: "168x168", alt: "", title: t("welcome.proposal.title"))  %>
         <h2><%= t("welcome.proposal.title") %></h2>
         <p><%= t("welcome.proposal.description") %></p>
       </div>
 
       <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_decide.png", size: "168x168", alt: t("welcome.decide.alt"), title: t("welcome.decide.title")) %>
+        <%= image_tag("icon_home_decide.png", size: "168x168", alt: "", title: t("welcome.decide.title")) %>
         <h2><%= t("welcome.decide.title") %></h2>
         <p><%= t("welcome.decide.description") %></p>
       </div>
       <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_do.png", size: "168x168", alt: t("welcome.do.alt"), title: t("welcome.do.title")) %>
+        <%= image_tag("icon_home_do.png", size: "168x168", alt: "", title: t("welcome.do.title")) %>
         <h2><%= t("welcome.do.title") %></h2>
         <p><%= t("welcome.do.description") %></p>
       </div>

config/locales/en.yml

@@ -198,6 +198,7 @@ en:
       more_information: More information
       my_account_link: My account
       my_activity_link: My activity
+      notifications: Notifications
       new_notifications:
         one: You have a new notification
         other: You have %{count} new notifications
@@ -413,6 +414,7 @@ en:
     flag: Flag as inappropriate
     print:
       print_button: Print this info
+    show: Show
     suggest:
       debate:
         found:
@@ -564,19 +566,15 @@ en:
       not_voting_allowed: Voting phase is closed
   welcome:
     debates:
-      alt: Icon debates
       description: For meeting, discussing and sharing the things that matter to us in our city.
       title: Debates
     decide:
-      alt: Icon decide
       description: The public decides if it accepts or rejects the most supported proposals.
       title: You decide
     do:
-      alt: Icon it gets done
       description: If the proposal is accepted by the majority, the City Council accepts it as its own and it gets done.
       title: It gets done
     proposal:
-      alt: Icon propose
       description: Open space for citizen proposals about the kind of city we want to live in.
       title: You propose
     verification:

config/locales/es.yml

@@ -198,6 +198,7 @@ es:
       more_information: Más información
       my_account_link: Mi cuenta
       my_activity_link: Mi actividad
+      notifications: Notificaciones
       new_notifications:
         one: Tienes una nueva notificación
         other: Tienes %{count} notificaciones nuevas
@@ -413,6 +414,7 @@ es:
     flag: Denunciar como inapropiado
     print:
       print_button: Imprimir esta información
+    show: Mostrar
     suggest:
       debate:
         found:
@@ -564,19 +566,15 @@ es:
       not_voting_allowed: El periodo de votación está cerrado.
   welcome:
     debates:
-      alt: Icono debates
       description: Encontrarnos, debatir y compartir lo que nos parece importante en nuestra ciudad.
       title: Debates
     decide:
-      alt: Icono decides
       description: La ciudadanía decide si acepta o rechaza las propuestas más apoyadas.
       title: Decides
     do:
-      alt: Icono se hace
       description: Si la propuesta es aceptada mayoritariamente, el Ayuntamiento la asume como propia y se hace.
       title: Se hace
     proposal:
-      alt: Icono propones
       description: Espacio abierto para propuestas ciudadanas sobre el tipo de ciudad en el que queremos vivir.
       title: Propones
     verification: