adding homepage social buttons

This commit is contained in:
Mark Otto 2012-07-06 10:10:56 -07:00
parent cd6915cdb4
commit 095e052606
3 changed files with 51 additions and 9 deletions

View File

@ -147,7 +147,7 @@ hr.soften {
font-size: 12px; font-size: 12px;
} }
.quick-links { .quick-links {
min-height: 30px; height: 20px;
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style: none; list-style: none;
@ -157,15 +157,10 @@ hr.soften {
min-height: 0; min-height: 0;
} }
.quick-links li { .quick-links li {
display: inline; display: inline-block;
margin: 0 8px; margin: 0 8px;
color: #999; color: #999;
} line-height: 1;
.quick-links .github-btn,
.quick-links .tweet-btn,
.quick-links .follow-btn {
position: relative;
top: 5px;
} }
@ -774,7 +769,7 @@ form.bs-docs-example {
border-radius: 6px; border-radius: 6px;
} }
.jumbo { .jumbo {
padding: 100px 0; padding: 80px 0;
margin: -60px 0 60px; margin: -60px 0 60px;
background-color: #222; background-color: #222;
color: #fff; color: #fff;
@ -859,6 +854,15 @@ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9cabc', end
} }
.jumbo-buttons {
padding: 20px 0;
margin-top: -60px;
text-align: center;
background-color: #f5f5f5;
border-top: 1px solid #fff;
border-bottom: 1px solid #ddd;
}
@media (max-width: 480px) { @media (max-width: 480px) {
body { body {

View File

@ -83,6 +83,25 @@
</div> </div>
</div> </div>
<div class="jumbo-buttons">
<div class="bs-docs-container">
<ul class="quick-links">
<li>
<iframe class="github-btn" src="http://markdotto.github.com/github-buttons/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="112px" height="20px"></iframe>
</li>
<li>
<iframe class="github-btn" src="http://markdotto.github.com/github-buttons/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="98px" height="20px"></iframe>
</li>
<li class="follow-btn">
<a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
</li>
<li class="tweet-btn">
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twitter.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
</li>
</ul>
</div>
</div>
<div class="bs-docs-container"> <div class="bs-docs-container">

View File

@ -13,6 +13,25 @@
</div> </div>
</div> </div>
<div class="jumbo-buttons">
<div class="bs-docs-container">
<ul class="quick-links">
<li>
<iframe class="github-btn" src="http://markdotto.github.com/github-buttons/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="112px" height="20px"></iframe>
</li>
<li>
<iframe class="github-btn" src="http://markdotto.github.com/github-buttons/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="98px" height="20px"></iframe>
</li>
<li class="follow-btn">
<a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">{{_i}}Follow @twbootstrap{{/i}}</a>
</li>
<li class="tweet-btn">
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twitter.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
</li>
</ul>
</div>
</div>
<div class="bs-docs-container"> <div class="bs-docs-container">