Fix microsite footer (fixes #731) (Closes #732)

This commit is contained in:
Surma 2015-07-06 16:11:25 +01:00 committed by Addy Osmani
parent 81abf26621
commit 9be15f0f0d
3 changed files with 30 additions and 16 deletions

View File

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.3.1 (12002) - http://www.bohemiancoding.com/sketch -->
<title>Shape</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="github_white_24" sketch:type="MSLayerGroup" fill="#FFFFFF">
<g id="Page-1" sketch:type="MSShapeGroup">
<g id="80---Spotlight">
<path d="M0,11 C0,15.8608399 3.1515,19.9831543 7.52288277,21.4373671 C8.07275388,21.538086 8.27350388,21.1983535 8.27350388,20.9083144 C8.27350388,20.6464629 8.2634277,19.7790527 8.25805668,18.8605957 C5.19921875,19.5252578 4.55266799,17.5634765 4.55266799,17.5634765 C4.05182424,16.2932129 3.33141013,15.9548339 3.33141013,15.9548339 C2.33172069,15.2727051 3.40725,15.2861328 3.40725,15.2861328 C4.51167576,15.3626601 5.09312888,16.4194336 5.09312888,16.4194336 C6.07470701,18.100586 7.66856833,17.6145019 8.29430076,17.3325195 C8.39428911,16.6235351 8.67895701,16.1374512 8.99254299,15.8635254 C6.55071487,15.585582 3.982,14.6416015 3.982,10.426625 C3.982,9.22483201 4.41102145,8.24462888 5.11328125,7.47454299 C5.00115431,7.19524612 4.62249214,6.07603902 5.22203513,4.56207813 C5.22203513,4.56207813 6.14453125,4.26666799 8.24729299,5.69000786 C9.12411326,5.44495701 10.0647422,5.32410743 10.9999785,5.32006832 C11.9345488,5.32410743 12.8758223,5.44628902 13.7540176,5.69133987 C15.8527832,4.26666799 16.7766113,4.56341013 16.7766113,4.56341013 C17.3781738,6.07872458 16.9995117,7.19657813 16.8867188,7.47454299 C17.591664,8.24462888 18.017334,9.22485355 18.017334,10.426625 C18.017334,14.6523438 15.4445801,15.582875 12.9940293,15.8554688 C13.3901582,16.1965332 13.7406113,16.8652344 13.7406113,17.8911133 C13.7406113,19.361461 13.7258301,20.5471192 13.7258301,20.909668 C13.7258301,21.2023926 13.9258926,21.544789 14.4831543,21.4373671 C18.851207,19.9804688 22,15.8581543 22,11 C22,4.92529299 17.074707,0 11,0 C4.92529299,0 0,4.92529299 0,11 Z" id="Shape"></path>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -249,20 +249,20 @@ body:not(.about) .mdl-navigation__link.download > button {
font-weight: 500;
text-transform: uppercase;
}
.docs-footer {
.docs-footer.mdl-mini-footer {
flex-direction: column;
align-items: stretch;
justify-content: center;
height: 120px;
}
.docs-footer ul {
.docs-footer.mdl-mini-footer ul {
padding: 0;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.docs-footer ul > a {
.docs-footer.mdl-mini-footer ul > a {
margin: 0 8px;
font-weight: 400;
font-size: 12px;
@ -490,7 +490,7 @@ body:not(.about) .mdl-navigation__link.download > button {
.component-description .mdl-button:first-of-type {
margin-top: 8px;
}
.social-btn {
.docs-footer.mdl-mini-footer .social-btn {
background-position: center;
background-size: contain;
background-repeat: no-repeat;
@ -501,13 +501,15 @@ body:not(.about) .mdl-navigation__link.download > button {
cursor: pointer;
}
.social-btn__twitter {
background-image: url('https://www.gstatic.com/images/icons/material/system/1x/post_twitter_white_24dp.png');
background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_twitter_white_24dp.png');
}
.social-btn__blogger {
background-image: url('https://www.gstatic.com/images/icons/material/system/1x/post_blogger_white_24dp.png');
.social-btn__github {
background-image: url('github_white_24.svg');
width: 22px;
height: 22px;
}
.social-btn__gplus {
background-image: url('https://www.gstatic.com/images/icons/material/system/1x/post_gplus_white_24dp.png');
background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_gplus_white_24dp.png');
}
.subpageheader {
margin-top: 60px;
@ -1208,9 +1210,6 @@ code[class*=language-], pre[class*=language-] {
.social-btn__twitter {
background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_twitter_white_24dp.png');
}
.social-btn__blogger {
background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_blogger_white_24dp.png');
}
.social-btn__gplus {
background-image: url('https://www.gstatic.com/images/icons/material/system/2x/post_gplus_white_24dp.png');
}

View File

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