From 26ff2effbf282d7646eb8c3d0e075587f3800e2d Mon Sep 17 00:00:00 2001 From: Adabriand Furtado Date: Mon, 19 Sep 2016 22:03:44 -0300 Subject: [PATCH] Accessibility changes - tab navigation and alt text for images --- assets/css/base.css | 24 +++++++++++++++++------- assets/js/main.controller.js | 6 +----- assets/js/ranking/ranking.service.js | 18 +++++++++++++++++- assets/templates/header.html | 30 ++++++++++++++++-------------- assets/templates/sections.html | 136 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------------------------------------------- 5 files changed, 125 insertions(+), 89 deletions(-) diff --git a/assets/css/base.css b/assets/css/base.css index e7349c0..7734125 100644 --- a/assets/css/base.css +++ b/assets/css/base.css @@ -82,9 +82,10 @@ img { bottom: 0; } -.wl-scroll-links span { +.wl-scroll-links a { padding-right: 22px; cursor: pointer; + color: #2d2d2d; } .wl-login-btn-wrapper { @@ -94,14 +95,14 @@ img { } .wl-login-link { - float: right; + float: left; font-weight: bold; color: #33a0d1; padding: 10px 35px 0 0; } .wl-participate-btn { - float: right; + float: left; padding: 9px 12px; } @@ -131,8 +132,14 @@ img { } .wl-sections-link-wrapper .section-link { - padding-left: 20px; + padding: 0 20px 0 0; cursor: pointer; + color: white; +} + +.wl-sections-link-wrapper .section-link:hover, + .wl-sections-link-wrapper .section-link:focus { + background-color: transparent; } /* Sections */ @@ -151,6 +158,7 @@ img { } .wl-section-title .title { + color: white; padding: 5px 0; background-color: #0f78a7; -webkit-border-radius: 6px; @@ -158,6 +166,10 @@ img { border-radius: 6px; } +.wl-section-title a { + text-decoration: none; +} + .wl-section-description { margin-top: 90px; font-size: 14px; @@ -390,10 +402,7 @@ img { /* Signs and Ranking Section */ #wl-signs-and-ranking { - position: relative; - z-index: 1; background: #ffffff; - height: 100vh; } .wl-signs-and-ranking-container { @@ -401,6 +410,7 @@ img { flex-direction: row; flex-wrap: wrap; background: white; + height: 100vh; } .wl-signs-and-ranking-wrapper { diff --git a/assets/js/main.controller.js b/assets/js/main.controller.js index 856fc5c..8168e3c 100644 --- a/assets/js/main.controller.js +++ b/assets/js/main.controller.js @@ -1,9 +1,5 @@ (function () { 'use strict'; - angular.module('wikilibras').controller('wikilibrasCtrl', ['$scope', '$window', '$document', function ($scope, $window) { - $scope.openUrl = function(url) { - $window.open(url, "_self"); - }; - }]); + angular.module('wikilibras').controller('wikilibrasCtrl', ['$scope', function ($scope) {}]); }()); \ No newline at end of file diff --git a/assets/js/ranking/ranking.service.js b/assets/js/ranking/ranking.service.js index 123a359..f7bc163 100644 --- a/assets/js/ranking/ranking.service.js +++ b/assets/js/ranking/ranking.service.js @@ -4,13 +4,29 @@ angular.module('wikilibras.ranking').service("rankingService", ['$http', '$q', function ($http, $q) { var PROJECT_CONF_URL = 'conf/app-conf.json'; var RANKING_ENDPOINT = '/api/leaderboard?limit=20'; + var NUMBER_OF_COLUMNS = 2; + + function splitToChunks(array, chunk) { + if (array && array.length < 1 || chunk === 0) return array; + + var result = []; + for (var i = 0; i < array.length; i += chunk) { + result.push(array.slice(i, i+chunk)); + } + return result; + } return { getRankingData: function() { return $http.get(PROJECT_CONF_URL).then(function(response) { var baseApiUrl = response.data.pybossa_url; return $http.get(baseApiUrl + RANKING_ENDPOINT).then(function(response) { - console.log(response); + + angular.forEach(response.data, function(obj, key) { + response.data[key] = splitToChunks(obj, NUMBER_OF_COLUMNS); + console.log(response.data[key]); + }); + console.log(response.data); return response.data; }); }); diff --git a/assets/templates/header.html b/assets/templates/header.html index c003dfc..1bfa59a 100644 --- a/assets/templates/header.html +++ b/assets/templates/header.html @@ -27,21 +27,23 @@ diff --git a/assets/templates/sections.html b/assets/templates/sections.html index 6c9c50e..b52fc9b 100644 --- a/assets/templates/sections.html +++ b/assets/templates/sections.html @@ -2,7 +2,9 @@
- + + +
@@ -14,11 +16,13 @@
-
o - que - já - produzimos -
+ +
o + que + já + produzimos +
+ >
@@ -27,7 +31,7 @@ O Wikilibras é uma plataforma colaborativa para construção de dicionário em LIBRAS.

- Acompanhe abaixo o progresso alçado pela comunidade WikiLibras. + Acompanhe abaixo o progresso conquistado pela comunidade WikiLibras.

@@ -126,21 +130,23 @@
-
você - pode - colaborar -
+ +
você + pode + colaborar +
+
- + Ícone de envio de vídeos
-
+ enviar video -
+
Grave seu sinal e envie para nossa comunidade.
@@ -152,12 +158,12 @@
- + Ícone de criação de sinais
-
+ criar sinal -
+
Ensine Ícaro, o nosso avatar, a fazer um sinal. @@ -170,12 +176,12 @@
- + Ícone de correção de sinais
-
+ corrigir sinal -
+
O sinal está incorreto? Colabore corrigindo-o. @@ -190,8 +196,10 @@
-
pessoas + +
pessoas colaborando
+
@@ -207,9 +215,11 @@
-
sinais - construídos -
+ +
sinais + construídos +
+

Confira alguns sinais que a comunidade WikiLibras já produziu.

@@ -224,12 +234,33 @@
+
-
ranking - dos colaborandores -
+ +
ranking + dos colaborandores +
+
@@ -262,17 +293,17 @@
-
-
-
+
+
+
- + Estrela de {{user.rank === 1? 'ouro':(user.rank === 2? 'prata': 'bronze')}}
- {{ $index+1 }}. + {{ user.rank }}.
@@ -284,16 +315,16 @@
-
-
+
+
- + Estrela de {{user.rank === 1? 'ouro':(user.rank === 2? 'prata': 'bronze')}}
- {{ $index+1 }}. + {{ user.rank }}.
@@ -305,20 +336,20 @@
-
-
+
+
- + Estrela de {{user.rank === 1? 'ouro':(user.rank === 2? 'prata': 'bronze')}}
- {{ $index+1 }}. + {{ user.rank }}.
- {{ user.fullname }} + {{ user.name }}
@@ -332,7 +363,7 @@
- + Estrela de {{$index === 0? 'ouro':($index === 1? 'prata': 'bronze')}}
{{ $index+1 }}. @@ -350,23 +381,4 @@
- - \ No newline at end of file + \ No newline at end of file -- libgit2 0.21.2