Make footer links accessible (fixes #1337)

This commit is contained in:
Surma 2015-08-10 11:28:21 +01:00
parent 87c48c2241
commit ae736732d6
2 changed files with 18 additions and 7 deletions

View File

@ -490,12 +490,17 @@ body:not(.about) .mdl-navigation__link.download > button {
.component-description .mdl-button:first-of-type { .component-description .mdl-button:first-of-type {
margin-top: 8px; margin-top: 8px;
} }
.docs-footer.mdl-mini-footer .mdl-mini-footer--social-btn {
background-color: transparent;
margin: 0 16px;
width: 24px;
height: 24px;
}
.docs-footer.mdl-mini-footer .social-btn { .docs-footer.mdl-mini-footer .social-btn {
display: block;
background-position: center; background-position: center;
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
background-color: transparent;
margin: 0 16px;
width: 24px; width: 24px;
height: 24px; height: 24px;
cursor: pointer; cursor: pointer;

View File

@ -116,13 +116,19 @@
</section> </section>
<footer class="docs-text-styling docs-footer mdl-mini-footer mdl-color--grey-900"> <footer class="docs-text-styling docs-footer mdl-mini-footer mdl-color--grey-900">
<ul> <ul>
<a href="https://twitter.com/googledesign" class="mdl-mini-footer--social-btn social-btn social-btn__twitter"></a> <li class="mdl-mini-footer--social-btn">
<a href="https://github.com/google/material-design-lite" class="mdl-mini-footer--social-btn social-btn social-btn__github"></a> <a href="https://twitter.com/googledesign" class="social-btn social-btn__twitter" role="button" title="Twitter"></a>
<a href="https://plus.google.com/+googledesign" class="mdl-mini-footer--social-btn social-btn social-btn__gplus"></a> </li>
<li class="mdl-mini-footer--social-btn">
<a href="https://github.com/google/material-design-lite" class="social-btn social-btn__github" role="button" title="GitHub"></a>
</li>
<li class="mdl-mini-footer--social-btn">
<a href="https://plus.google.com/+googledesign" class="social-btn social-btn__gplus" role="button" title="Google+"></a>
</li>
</ul> </ul>
<ul> <ul>
<a class="mdl-color-text--grey-600" href="https://developers.google.com/web/starter-kit/">Web Starter Kit</a> <li><a class="mdl-color-text--grey-600" href="https://developers.google.com/web/starter-kit/">Web Starter Kit</a></li>
<a class="mdl-color-text--grey-600" href="https://github.com/google/material-design-lite/issues">Help</a> <li><a class="mdl-color-text--grey-600" href="https://github.com/google/material-design-lite/issues">Help</a></li>
</ul> </ul>
</footer> </footer>
</main> </main>