Commit 2ceede235caf38b7d90d495f6ec2e31e634a8438

Authored by Edmar Moretti
1 parent 562d59cd

Ajustes de acessibilidade

admin1/head.php
... ... @@ -182,6 +182,9 @@ body {
182 182 -o-transform: rotate(90deg);
183 183 transform: rotate(90deg);
184 184 }
  185 +.navbar, .navbar.navbar-default {
  186 + background-color: #008579;
  187 +}
185 188 </style>
186 189 </head>
187 190 <script id="iconeAguardeTpl" type="x-tmpl-mustache">
... ...
init/dicionario.js
... ... @@ -360,7 +360,7 @@ g_traducao_init =
360 360 ],
361 361 "31a" : [
362 362 {
363   - pt : "Página da comunidade de usuários no Portal do Software pÚblico Brasileiro.",
  363 + pt : "P&aacute;gina da comunidade de usuários no Portal do Software P&uacute;blico Brasileiro.",
364 364 en : "",
365 365 es : ""
366 366 }
... ...
init/head.php
... ... @@ -106,5 +106,15 @@ hr {
106 106 body{
107 107 background-color: rgb(240,240,240);
108 108 }
  109 +/* conforme regra de acessibilidade */
  110 +.navbar, .navbar.navbar-default, .btn.btn-fab.btn-primary {
  111 + background-color: #008579;
  112 +}
  113 +.alert.alert-danger {
  114 + background-color: #e13023;
  115 +}
  116 +a, a:focus, a:hover {
  117 + color: #008579;
  118 +}
109 119 </style>
110 120 </head>
... ...
init/index.php
... ... @@ -42,17 +42,17 @@ include &quot;head.php&quot;;
42 42 }
43 43 </style>
44 44 <body style="padding-top: 90px;" id="topo">
45   - <a href="#conteudoPrincipal" class="sr-only sr-only-focusable"><span class="well" >Skip to main content</span></a>
  45 + <a href="#conteudoPrincipal" class="sr-only sr-only-focusable"><span class="well" style="background: white; color: #007e72;">Skip to main content</span></a>
46 46 <nav class="navbar navbar-default navbar-fixed-top">
47 47 <div class="container-fluid">
48 48 <div class="navbar-header">
49   - <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
  49 + <button type="button" title="icon-bar" class="navbar-toggle collapsed" data-toggle="collapse"
50 50 data-target="#navbar" aria-expanded="false" aria-controls="navbar">
51 51 <span class="sr-only"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span
52 52 class="icon-bar"></span>
53 53 </button>
54   - <a class="navbar-brand" onclick="$('.cartao').fadeIn(600);" href="#"><?php echo $mensagemInicia;?> <i
55   - class="fa fa-home fa-1x"></i></a>
  54 + <a class="navbar-brand" onclick="$('.cartao').fadeIn(600);" href="#">
  55 + <?php echo $mensagemInicia;?> <i class="material-icons">home</i></a>
56 56 </div>
57 57 <div id="navbar" class="navbar-collapse collapse navbar-responsive-collapse">
58 58 <ul class="nav navbar-nav">
... ... @@ -87,8 +87,8 @@ include &quot;head.php&quot;;
87 87 style="background: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.8);">
88 88 <!-- Template para mensagem do i3Geo -->
89 89 <ul class="list-inline">
90   - <li><img class="pull-left" src='../imagens/i3Geo_bigTransp.png'
91   - style='width: 80px; margin: 5px;' /> <img class="pull-right hidden-xs"
  90 + <li><img class="pull-left" alt="i3Geo Logo" src='../imagens/i3Geo_bigTransp.png'
  91 + style='width: 80px; margin: 5px;' /> <img alt="qrcode site" class="pull-right hidden-xs"
92 92 src='../pacotes/qrcode/php/qr_img.php?host={{{host}}}&d={{{href}}}'
93 93 style='width: 80px; margin: 5px;' />
94 94 <p>{{{jumbotron}}}</p></li>
... ... @@ -98,7 +98,7 @@ include &quot;head.php&quot;;
98 98 </div>
99 99 </nav>
100 100  
101   - <div class="container" id="conteudoPrincipal">
  101 + <div class="container" id="conteudoPrincipal" tabindex="-1">
102 102 <div class="row center-block">
103 103 <!-- Template para criacao dos quadros ver index.js -->
104 104 <div id="botoesTpl" class="hidden">
... ... @@ -114,7 +114,7 @@ include &quot;head.php&quot;;
114 114 </div>
115 115 -->
116 116 <div class="thumbnail" role="button" style="height: 90px;">
117   - <a tabindex="-1" target="{{{target}}}" href="{{{href}}}"> <img tabindex="-1" class="img-rounded {{{img}}}"
  117 + <a tabindex="-1" target="{{{target}}}" href="{{{href}}}"> <img alt="{{{titulo}}}" tabindex="-1" class="img-rounded {{{img}}}"
118 118 style="height: 100%; width: 100%" src="../imagens/branco.gif" />
119 119 </a>
120 120 </div>
... ... @@ -127,17 +127,18 @@ include &quot;head.php&quot;;
127 127 style="padding: 0px; padding-right: 15px; border: 0px; background-color: white;">
128 128 <div class="row center-block">
129 129 <div class="col-xs-6" style="line-height: 3.5; text-align: left;">
130   - <a tabindex="-1" role="button" data-toggle="quadroQrcode" data-url="{{{href}}}"
131   - class="btn btn-primary btn-fab btn-fab-mini" href="#"> <span
132   - class="glyphicon glyphicon-qrcode" aria-hidden="true"></span>
133   - </a>
  130 + <!-- o texto no span e para acessibilidade-->
  131 + <button tabindex="-1" role="button" data-toggle="quadroQrcode" data-url="{{{href}}}"
  132 + class="btn btn-primary btn-fab btn-fab-mini" > <span
  133 + class="glyphicon glyphicon-qrcode" aria-hidden="true">&nbsp;&nbsp;qrcode</span>
  134 + </button>
134 135  
135   - <button tabindex="-1" onclick="favorita(this);return false;" class="btn btn-primary btn-fab btn-fab-mini">
136   - <span data-cookie="{{{img}}}" class="glyphicon glyphicon-star" aria-hidden="true"></span>
  136 + <button tabindex="-1" role="button" onclick="favorita(this);return false;" class="btn btn-primary btn-fab btn-fab-mini">
  137 + <span data-cookie="{{{img}}}" ><i class="material-icons">grade</i></span>
137 138 </button>
138 139 </div>
139 140 <div class="col-xs-6">
140   - <a class="btn btn-primary" href="{{{href}}}" role="button" target="{{{target}}}">
  141 + <a class="btn btn-primary" style="color:#008579;" href="{{{href}}}" role="button" target="{{{target}}}">
141 142 {{{abrir}}} </a>
142 143 </div>
143 144  
... ... @@ -150,14 +151,14 @@ include &quot;head.php&quot;;
150 151  
151 152 </div>
152 153 <div tabindex="-1" class="container-fluid"
153   - style="background-color: rgb(250, 250, 250); margin-top: 10px; padding-top: 10px;">
  154 + style="background-color: #fff; margin-top: 10px; padding-top: 10px;">
154 155 <div class="row text-center hidden">
155 156 <div class="col-lg-12 center-block">
156 157 <a tabindex="-1" rel="license" href="http://creativecommons.org/licenses/GPL/2.0/legalcode.pt" target="_blank"><img
157 158 alt="Licen&ccedil;a Creative Commons" style="border-width: 0"
158 159 src="https://i.creativecommons.org/l/GPL/2.0/88x62.png" /></a><br />O i3Geo est&aacute;
159 160 licenciado com uma Licen&ccedil;a <a tabindex="-1" rel="license"
160   - href="http://creativecommons.org/licenses/GPL/2.0/legalcode.pt" target="_blank">Creative
  161 + href="http://creativecommons.org/licenses/GPL/2.0/legalcode.pt" style="color:#008579;" target="_blank">Creative
161 162 Commons - Licen&ccedil;a P&uacute;blica Geral GNU (&#34;GNU General Public License&#34;)</a>
162 163 </div>
163 164 </div>
... ...
pacotes/bootstrap-accessibility-plugin/plugins/css/bootstrap-accessibility.css
1   -.btn:focus{outline:dotted 2px #000}div.active:focus{outline:dotted 1px #000}a:focus{outline:dotted 1px #000}.close:hover,.close:focus{outline:dotted 1px #000}.nav>li>a:hover,.nav>li>a:focus{outline:dotted 1px #000}.carousel-indicators li,.carousel-indicators li.active{height:18px;width:18px;border-width:2px;position:relative;box-shadow:0px 0px 0px 1px #808080}.carousel-indicators.active li{background-color:rgba(100,149,253,0.6)}.carousel-indicators.active li.active{background-color:white}.carousel-tablist-highlight{display:block;position:absolute;outline:2px solid transparent;background-color:transparent;box-shadow:0px 0px 0px 1px transparent}.carousel-tablist-highlight.focus{outline:2px solid #6495ED;background-color:rgba(0,0,0,0.4)}a.carousel-control:focus{outline:2px solid #6495ED;background-image:linear-gradient(to right, transparent 0px, rgba(0,0,0,0.5) 100%);box-shadow:0px 0px 0px 1px #000000}.carousel-pause-button{position:absolute;top:-30em;left:-300em;display:block}.carousel-pause-button.focus{top:0.5em;left:0.5em}.carousel:hover .carousel-caption,.carousel.contrast .carousel-caption{background-color:rgba(0,0,0,0.5);z-index:10}.alert-success{color:#2d4821}.alert-info{color:#214c62}.alert-warning{color:#6c4a00;background-color:#f9f1c6}.alert-danger{color:#d2322d}.alert-danger:hover{color:#a82824}
  1 +.btn:focus{outline:dotted 2px #000}div.active:focus{outline:dotted 1px #000}a:focus{outline:dotted 1px #000}.close:hover,.close:focus{outline:dotted 1px #000}.nav>li>a:hover,.nav>li>a:focus{outline:dotted 1px #000}.carousel-indicators li,.carousel-indicators li.active{height:18px;width:18px;border-width:2px;position:relative;box-shadow:0px 0px 0px 1px #808080}.carousel-indicators.active li{background-color:rgba(100,149,253,0.6)}.carousel-indicators.active li.active{background-color:white}.carousel-tablist-highlight{display:block;position:absolute;outline:2px solid transparent;background-color:transparent;box-shadow:0px 0px 0px 1px transparent}.carousel-tablist-highlight.focus{outline:2px solid #6495ED;background-color:rgba(0,0,0,0.4)}a.carousel-control:focus{outline:2px solid #6495ED;background-image:linear-gradient(to right, transparent 0px, rgba(0,0,0,0.5) 100%);box-shadow:0px 0px 0px 1px #000000}.carousel-pause-button{position:absolute;top:-30em;left:-300em;display:block}.carousel-pause-button.focus{top:0.5em;left:0.5em}.carousel:hover .carousel-caption,.carousel.contrast .carousel-caption{background-color:rgba(0,0,0,0.5);z-index:10}.alert-success{color:#2d4821}.alert-info{color:#214c62}.alert-warning{color:#6c4a00;background-color:#f9f1c6}.alert-danger{color:#e13023}.alert-danger:hover{color:#a82824}
... ...