Made the game grid accessible

This commit is contained in:
Paulin Jorys 2017-05-21 18:22:28 +02:00
parent 38a7a058ab
commit 053cd9a830
2 changed files with 14 additions and 14 deletions

View File

@ -191,7 +191,7 @@ main {
cursor: pointer;
transition: all .2s ease-in-out;
}
#host-grid .mdl-card:hover, #game-grid .mdl-card:hover {
#host-grid .mdl-card:hover, #host-grid .mdl-card:focus, #host-grid .mdl-card:active, #game-grid .mdl-card:hover, #game-grid .mdl-card:focus, #game-grid .mdl-card:active {
transform: scale(1.1);
}
#host-grid .mdl-card__title {

View File

@ -429,7 +429,7 @@ function showApps(host) {
// to mitigate this we ensure we don't add a duplicate.
// This isn't perfect: there's lots of RTTs before the logic prevents anything
var imageBlob = new Blob([resolvedPromise], {type: "image/png"});
var outerDiv = $("<div>", {class: 'game-container mdl-card mdl-shadow--4dp', id: 'game-'+app.id, backgroundImage: URL.createObjectURL(imageBlob) });
var outerDiv = $("<div>", {class: 'game-container mdl-card mdl-shadow--4dp', id: 'game-'+app.id, backgroundImage: URL.createObjectURL(imageBlob), role: 'link', tabindex: 0, title: app.title, 'aria-label': app.title });
$(outerDiv).append($("<img \>", {src: URL.createObjectURL(imageBlob), id: 'game-'+app.id, name: app.title }));
$(outerDiv).append($("<div>", {class: "game-title", html: $("<span>", {html: app.title} )}));
$("#game-grid").append(outerDiv);