Merge pull request #563 from AyuntamientoMadrid/accessibility

Accessibility
2015-09-28 13:58:25 +02:00
parent 2cbbd10c7b dd7f429104
commit 8382fcba36
24 changed files with 86 additions and 45 deletions
--- a/app/assets/stylesheets/participacion.scss
+++ b/app/assets/stylesheets/participacion.scss
@@ -524,6 +524,10 @@ header {

    &.menu-icon a {
      padding: 0 rem-calc(24);
+
+      span::after {
+        right: 0;
+      }
    }
  }

--- a/app/controllers/pages_controller.rb
+++ b/app/controllers/pages_controller.rb
@@ -1,6 +1,9 @@
 class PagesController < ApplicationController
  skip_authorization_check

+  def accessibility
+  end
+
  def census_terms
  end

--- a/app/views/debates/_form.html.erb
+++ b/app/views/debates/_form.html.erb
@@ -14,7 +14,7 @@

    <div class="small-12 column">
      <%= f.label :tag_list, t("debates.form.tags_label") %>
-      <span class="note"><%= t("debates.form.tags_instructions") %></span>
+      <p class="note"><%= t("debates.form.tags_instructions") %></p>
      <span class="tags">
        <% @featured_tags.each do |tag| %>
          <a class="js-add-tag-link"><%= tag.name %></a>
--- a/app/views/layouts/_footer.html.erb
+++ b/app/views/layouts/_footer.html.erb
@@ -46,7 +46,8 @@
        <%= t("layouts.footer.copyright", year: Time.now.year) %>&nbsp;|&nbsp;
        <%= link_to t("layouts.footer.more_info"), "/more_information" %>&nbsp;|&nbsp;
        <%= link_to t("layouts.footer.privacy"), "/privacy" %>&nbsp;|&nbsp;
-        <%= link_to t("layouts.footer.conditions"), "/conditions" %>
+        <%= link_to t("layouts.footer.conditions"), "/conditions" %>&nbsp;|&nbsp;
+        <%= link_to t("layouts.footer.accessibility"), "/accessibility" %>
      </div>
    </div>
  </div>
--- a/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@ -13,7 +13,7 @@
  <div class="contain-to-grid clear">
    <nav class="top-bar" data-topbar role="navigation">
      <ul class="title-area">
-        <li class="toggle-topbar menu-icon"><a href="#"><span></span></a></li>
+        <li class="toggle-topbar menu-icon"><a href="#"><span><%= t("application.menu")%></span></a></li>
        <li class="name">
          <%= link_to root_path do %>
            <%= image_tag('header_logo_madrid.png', class: 'show-for-medium-up left', size: '96x96') %>
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -26,14 +26,14 @@
      <div class="admin-content small-12 medium-9 column">
        <% if notice %>
          <div data-alert class="alert-box radius success">
-            <a href="#" class="close">&times;</a>
+            <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
            <%= notice %>
          </div>
        <% end %>

        <% if alert %>
          <div data-alert class="alert-box radius alert">
-            <a href="#" class="close">&times;</a>
+            <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
            <%= alert %>
          </div>
        <% end %>
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -44,7 +44,7 @@
      <div class="alert-messages">
        <div class="row">
          <div data-alert class="alert-box success radius">
-            <a href="#" class="close">&times;</a>
+            <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
            <%= notice %>
          </div>
        </div>
@@ -55,7 +55,7 @@
      <div class="alert-messages">
        <div class="row">
          <div data-alert class="alert-box alert radius">
-            <a href="#" class="close">&times;</a>
+            <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
            <%= alert %>
          </div>
        </div>
--- a/app/views/layouts/devise.html.erb
+++ b/app/views/layouts/devise.html.erb
@@ -26,26 +26,30 @@
    </div>

    <div class="row auth">
-    <div class="small-12 medium-8 large-5 column small-centered">
-      <div class="panel">
-        <% if notice %>
-          <div data-alert class="alert-box radius success">
-            <a href="#" class="close">&times;</a>
-              <%= notice %>
-          </div>
-        <% end %>
+      <div class="small-12 medium-8 large-5 column small-centered">
+        <div class="panel">
+          <% if notice %>
+            <div data-alert class="alert-box radius success">
+              <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
+                <%= notice %>
+            </div>
+          <% end %>

-        <% if alert %>
-          <div data-alert class="alert-box radius warning">
-            <a href="#" class="close">&times;</a>
-              <%= alert %>
-          </div>
-        <% end %>
+          <% if alert %>
+            <div data-alert class="alert-box radius warning">
+              <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
+                <%= alert %>
+            </div>
+          <% end %>

-        <%= yield %>
+          <%= yield %>

+        </div>
      </div>
    </div>
-  </div>
+
+    <div class="footer">
+      <%= render 'layouts/footer' %>
+    </div>
  </body>
 </html>
--- a/app/views/organizations/registrations/new.html.erb
+++ b/app/views/organizations/registrations/new.html.erb
@@ -8,7 +8,7 @@
      <%= f.fields_for :organization do |fo| %>
        <%= fo.text_field :name, autofocus: true, maxlength: Organization.name_max_length, placeholder: t("devise_views.organizations.registrations.new.organization_name_label") %>
        <%= fo.label t("devise_views.organizations.registrations.new.responsible_name_label") %>
-        <span class="note"><%= t("devise_views.organizations.registrations.new.responsible_name_note") %></span>
+        <p class="note"><%= t("devise_views.organizations.registrations.new.responsible_name_note") %></p>
        <%= fo.text_field :responsible_name, maxlength: Organization.responsible_name_max_length, label: false %>
      <% end %>

--- a/app/views/pages/accessibility.html.erb
+++ b/app/views/pages/accessibility.html.erb
@@ -0,0 +1,17 @@
+<div class="page row-full">
+  <div class="row">
+    <div class="text small-12 column">
+      <h1>Accesibilidad</h1>
+      <p>La accesibilidad web se refiere a la posibilidad de acceso a la web y a sus contenidos por todas las personas, independientemente de las discapacidades (físicas, intelectuales o técnicas) que puedan presentar o de las que se deriven del contexto de uso (tecnológicas o ambientales).</p>
+
+      <p>Cuando los sitios web están diseñados pensando en la accesibilidad, todos los usuarios pueden acceder en condiciones de igualdad a los contenidos, por ejemplo:</p>
+
+      <ul>
+        <li>Proporcionando un texto alternativo a las imágenes, los usuarios invidentes o con problemas de visión pueden utilizar lectores especiales para acceder a la información. </li>
+        <li>Cuando los vídeos disponen de subtítulos, los usuarios con dificultades auditivas pueden entenderlos plenamente. </li>
+        <li>Si los contenidos están escritos en un lenguaje sencillo e ilustrados, los usuarios con problemas de aprendizaje están en mejores condiciones de entenderlos.</li>
+        <li>Si el usuario tiene problemas de movilidad y le cuesta usar el ratón, las alternativas con el teclado le ayudan en la navegación.</li>
+      </ul>
+    </div>
+  </div>
+</div>
--- a/app/views/proposals/_form.html.erb
+++ b/app/views/proposals/_form.html.erb
@@ -17,7 +17,7 @@

    <div class="small-12 column">
      <%= f.label :summary, t("proposals.form.proposal_summary") %>
-      <span class="note"><%= t("proposals.form.proposal_summary_note") %></span>
+      <p class="note"><%= t("proposals.form.proposal_summary_note") %></p>
      <%= f.text_area :summary, rows: 4, maxlength: 200, label: false,
                      placeholder: t('proposals.form.proposal_summary') %>
    </div>
@@ -30,7 +30,7 @@

    <div class="small-12 column">
      <%= f.label :video_url, t("proposals.form.proposal_video_url") %>
-      <span class="note"><%= t("proposals.form.proposal_video_url_note") %></span>
+      <p class="note"><%= t("proposals.form.proposal_video_url_note") %></p>
      <%= f.text_field :video_url, placeholder: t("proposals.form.proposal_video_url"), label: false %>
    </div>

@@ -41,7 +41,7 @@

    <div class="small-12 column">
      <%= f.label :tag_list, t("proposals.form.tags_label") %>
-      <span class="note"><%= t("proposals.form.tags_instructions") %></span>
+      <p class="note"><%= t("proposals.form.tags_instructions") %></p>
      <span class="tags">
        <% @featured_tags.each do |tag| %>
          <a class="js-add-tag-link"><%= tag.name %></a>
@@ -53,7 +53,7 @@
    <% if current_user.unverified? %>
      <div class="small-12 column">
        <%= f.label :responsible_name, t("proposals.form.proposal_responsible_name") %>
-        <span class="note"><%= t("proposals.form.proposal_responsible_name_note") %></span>
+        <p class="note"><%= t("proposals.form.proposal_responsible_name_note") %></p>
        <%= f.text_field :responsible_name, placeholder: t("proposals.form.proposal_responsible_name"), label: false %>
      </div>
    <% end %>
--- a/app/views/proposals/_proposal.html.erb
+++ b/app/views/proposals/_proposal.html.erb
@@ -39,7 +39,7 @@
            <% end %>
          </p>
          <div class="proposal-description">
-            <%= link_to proposal.summary, proposal %>
+            <p><%= link_to proposal.summary, proposal %></p>
            <div class="truncate"></div>
          </div>
          <%= render "shared/tags", taggable: proposal, limit: 5 %>
--- a/app/views/shared/_errors.html.erb
+++ b/app/views/shared/_errors.html.erb
@@ -1,6 +1,6 @@
 <% if resource.errors.any? %>
  <div id="error_explanation" data-alert class="alert-box alert radius">
-    <a href="#" class="close">&times;</a>
+    <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>

    <strong>
      <%= pluralize resource.errors.count, t("form.error"), t("form.errors") %>
--- a/app/views/simple_captcha/_simple_captcha.erb
+++ b/app/views/simple_captcha/_simple_captcha.erb
@@ -2,7 +2,7 @@
  <%= simple_captcha_options[:image] %>
  <%= simple_captcha_options[:refresh_button] %>

-  <span class="note"><%= simple_captcha_options[:label] %></span>
+  <p class="note"><%= simple_captcha_options[:label] %></p>

  <%= simple_captcha_options[:field] %>
 </div>
--- a/app/views/users/registrations/edit.html.erb
+++ b/app/views/users/registrations/edit.html.erb
@@ -18,7 +18,7 @@

    <div class="small-12 column">
      <%= f.label :password, t("devise_views.users.registrations.edit.password_label") %>
-      <span class="note"><%= t("devise_views.users.registrations.edit.leave_blank") %></span>
+      <p class="note"><%= t("devise_views.users.registrations.edit.leave_blank") %></p>
      <%= f.password_field :password, autocomplete: "off", label: false, placeholder: t("devise_views.users.registrations.edit.password_label") %>
    </div>

@@ -29,7 +29,7 @@

    <div class="small-12 column">
      <%= f.label :current_password, t("devise_views.users.registrations.edit.current_password_label") %>
-      <span class="note"><%= t("devise_views.users.registrations.edit.need_current") %></span>
+      <p class="note"><%= t("devise_views.users.registrations.edit.need_current") %></p>
      <%= f.password_field :current_password, label: false, autocomplete: "off", placeholder:  t("devise_views.users.registrations.edit.current_password_label") %>
    </div>

--- a/app/views/users/registrations/new.html.erb
+++ b/app/views/users/registrations/new.html.erb
@@ -14,7 +14,7 @@
    <div class="small-12 column">

      <%= f.label t("devise_views.users.registrations.new.username_label") %>
-      <span class="note"><%= t("devise_views.users.registrations.new.username_note") %></span>
+      <p class="note"><%= t("devise_views.users.registrations.new.username_note") %></p>
      <%= f.text_field  :username, maxlength: User.username_max_length, placeholder: t("devise_views.users.registrations.new.username_label"), label: false %>

      <%= f.email_field :email,     placeholder: t("devise_views.users.registrations.new.email_label") %>
--- a/app/views/verification/residence/_errors.html.erb
+++ b/app/views/verification/residence/_errors.html.erb
@@ -1,7 +1,7 @@
 <% if @residence.errors[:residence_in_madrid].present? %>

  <div id="error_explanation" data-alert class="alert-box alert radius">
-  	<a href="#" class="close">&times;</a>
+  	<a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
    <%= t("verification.residence.new.error_verifying_census") %>
    <%= mail_to "web.gobiernoabierto@madrid.es" %>
  </div>
--- a/app/views/verification/sms/edit.html.erb
+++ b/app/views/verification/sms/edit.html.erb
@@ -27,7 +27,7 @@
    <%= form_for @sms, as: "sms", url: sms_path, method: :put do |f| %>
      <% if @error %>
        <div data-alert class="alert-box alert radius">
-          <a href="#" class="close">&times;</a>
+          <a href="#" class="close" title="<%= t("application.close") %>">&times;</a>
          <%= @error %>
        </div>
      <% end %>
--- a/app/views/welcome/index.html.erb
+++ b/app/views/welcome/index.html.erb
@@ -2,25 +2,25 @@
  <section role="main">
    <div class="row text-center">
      <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_debate.svg") %>
-        <h2><%= t("welcome.debates.title") %></h2>
+        <%= image_tag("icon_home_debate.svg", size: "168x168") %>
+        <h3><%= t("welcome.debates.title") %></h3>
        <p><%= t("welcome.debates.description") %></p>

      </div>
      <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_proposal.svg") %>
-        <h2><%= t("welcome.proposal.title") %></h2>
+        <%= image_tag("icon_home_proposal.svg", size: "168x168") %>
+        <h3><%= t("welcome.proposal.title") %></h3>
        <p><%= t("welcome.proposal.description") %></p>
      </div>

      <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_decide.svg") %>
-        <h2><%= t("welcome.decide.title") %></h2>
+        <%= image_tag("icon_home_decide.svg", size: "168x168") %>
+        <h3><%= t("welcome.decide.title") %></h3>
        <p><%= t("welcome.decide.description") %></p>
      </div>
      <div class="small-12 medium-3 column">
-        <%= image_tag("icon_home_done.svg") %>
-        <h2><%= t("welcome.do.title") %></h2>
+        <%= image_tag("icon_home_done.svg", size: "168x168") %>
+        <h3><%= t("welcome.do.title") %></h3>
        <p><%= t("welcome.do.description") %></p>
      </div>
    </div>
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -48,6 +48,7 @@ en:
      privacy: "Privacy Policy"
      conditions: "Terms of use"
      more_info: "More information"
+      accessibility: "Accessibility"
    application:
      ie_title: "This site is not optimized for your browser"
      ie:
@@ -69,6 +70,8 @@ en:
  application:
    alert:
      only_beta_testers: "Sorry only Beta Testers are allowed access at the moment"
+    close: "Close"
+    menu: "Menu"
  debates:
    index:
      start_debate: Start a debate
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -48,6 +48,7 @@ es:
      privacy: "Política de privacidad"
      conditions: "Condiciones de uso"
      more_info: "Más información"
+      accessibility: "Accesibilidad"
    application:
      ie_title: "Esta web no está optimizada para tu navegador"
      ie:
@@ -69,6 +70,8 @@ es:
  application:
    alert:
      only_beta_testers: "Lo sentimos sólo los usuarios de pruebas tienen acceso de momento"
+    close: "Cerrar"
+    menu: "Menú"
  debates:
    index:
      start_debate: Empieza un debate
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -230,5 +230,6 @@ Rails.application.routes.draw do
  get "/participation_facts", to: "pages#participation_facts"
  get "/participation_world", to: "pages#participation_world"
  get "/blog", to: "pages#blog"
+  get "/accessibility", to: "pages#accessibility"

 end
--- a/doc/style-guide.html
+++ b/doc/style-guide.html
@@ -344,7 +344,7 @@ form input[type]:not([type=submit]) {
        <div class="small-12 medium-8 small-centered column">
          <form>
            <label>Nombre</label>
-            <span class="note">Mensaje de información para rellenar el campo</span>
+            <p class="note">Mensaje de información para rellenar el campo</p>
            <input type="text">
            <label>Apellidos</label>
            <input type="text">
--- a/spec/controllers/pages_controller_spec.rb
+++ b/spec/controllers/pages_controller_spec.rb
@@ -66,6 +66,11 @@ describe PagesController do
      get :blog
      expect(response).to be_redirect
    end
+
+    it 'should include a accessibility page' do
+      get :accessibility
+      expect(response).to be_ok
+    end
  end

 end