add contribute and footer to home

This commit is contained in:
connors 2014-01-18 15:21:16 -08:00
Родитель 72adf63da2
Коммит c6c5da7eef
3 изменённых файлов: 175 добавлений и 37 удалений

Просмотреть файл

@ -718,6 +718,11 @@ body {
line-height: 34px;
}
.docs-section {
padding-top: 80px;
padding-bottom: 80px;
}
.section-header {
text-align: center;
}
@ -746,9 +751,29 @@ body {
font-weight: 100;
}
.social {
padding: 20px 0 20px;
margin: 0;
list-style: none;
text-align: center;
border-bottom: 1px solid #eee;
background-color: #f9f9f9;
}
.social li {
height: 20px;
display: inline-block;
vertical-align: top;
}
.social [class*="button"] {
padding: 0;
border: 0;
}
.social iframe {
background-color: transparent;
}
.docs-benefits {
padding-top: 80px;
padding-bottom: 80px;
padding-bottom: 0;
text-align: center;
}
@ -780,25 +805,48 @@ body {
color: #777;
}
.social {
padding: 20px 0 20px;
margin: 0;
list-style: none;
.docs-contribute {
padding-top: 40px;
padding-bottom: 40px;
color: #fff;
text-align: center;
border-bottom: 1px solid #eee;
background-color: #f9f9f9;
background-color: #00d1fe;
}
.social li {
height: 20px;
.docs-contribute .link {
display: inline-block;
vertical-align: top;
margin-top: 5px;
color: #fff;
text-decoration: underline;
}
.social [class*="button"] {
padding: 0;
border: 0;
.contribute-heading,
.contribute-text {
margin-top: 0;
}
.social iframe {
background-color: transparent;
.contribute-heading {
margin-bottom: 5px;
font-size: 18px;
font-weight: 500;
}
.contribute-text {
margin-bottom: 0;
color: rgba(255, 255, 255, 0.85);
}
.docs-footer {
padding-top: 20px;
padding-bottom: 20px;
color: rgba(255, 255, 255, 0.7);
text-align: center;
background-color: #254456;
}
.docs-footer .footer-content {
opacity: .7;
}
.docs-footer .footer-content a {
color: #fff;
}
.docs-masthead {

Просмотреть файл

@ -37,7 +37,7 @@ base_url: "./"
</ul>
<!-- Benefits -->
<section class="docs-benefits">
<section class="docs-benefits docs-section">
<div class="container column-group">
<div class="section-header column units-2">
<h2 class="section-heading">Getting started</h2>
@ -84,3 +84,34 @@ base_url: "./"
</div>
</div>
</section>
<section class="docs-contribute docs-section">
<div class="container column-group">
<div class="column units-2 lg-units-4">
<h3 class="contribute-heading">Contribute code</h3>
<p class="contribute-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.</p>
<a class="link" href="#">GitHub project</a>
</div>
<div class="column units-2 lg-units-4">
<h3 class="contribute-heading">Submit an issue</h3>
<p class="contribute-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.</p>
<a class="link" href="#">GitHub issues</a>
</div>
<div class="column units-2 lg-units-4">
<h3 class="contribute-heading">Ask a question</h3>
<p class="contribute-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.</p>
<a class="link" href="#">Google group</a>
</div>
</div>
</section>
<footer class="docs-footer docs-section">
<div class="container column-group">
<div class="column units-2">
<p class="footer-content">Code licensed under the MIT license. Version v2.0.0 was lovingly crafted by <a href="https://twitter.com/connors">Connor Sears</a>.</p>
</div>
</div>
</footer>

Просмотреть файл

@ -108,6 +108,14 @@ body {
font-weight: 100;
line-height: 34px;
}
// Content sections
// --------------------------------------------------
.docs-section {
padding-top: 80px;
padding-bottom: 80px;
}
.section-header {
text-align: center;
@ -134,12 +142,38 @@ body {
font-weight: 100;
}
// Benefits
// Overriding the button styles for the social
// --------------------------------------------------
.social {
padding: 20px 0 20px;
margin: 0;
list-style: none;
text-align: center;
border-bottom: 1px solid #eee;
background-color: #f9f9f9;
li {
height: 20px;
display: inline-block;
vertical-align: top;
}
[class*="button"] {
padding: 0;
border: 0;
}
// Remove after button class changes.
iframe {
background-color: transparent;
}
}
// Benefits
// --------------------------------------------------
.docs-benefits {
padding-top: 80px;
padding-bottom: 80px;
padding-bottom: 0;
text-align: center;
}
.benefit-icon {
@ -170,29 +204,54 @@ body {
}
// Overriding the button styles for the social
// Contribute
// --------------------------------------------------
.social {
padding: 20px 0 20px;
margin: 0;
list-style: none;
.docs-contribute {
padding-top: 40px;
padding-bottom: 40px;
color: #fff;
text-align: center;
border-bottom: 1px solid #eee;
background-color: #f9f9f9;
background-color: #00d1fe;
li {
height: 20px;
.link {
display: inline-block;
vertical-align: top;
margin-top: 5px;
color: #fff;
text-decoration: underline;
}
[class*="button"] {
padding: 0;
border: 0;
}
// Remove after button class changes.
iframe {
background-color: transparent;
}
.contribute-heading,
.contribute-text {
margin-top: 0;
}
.contribute-heading {
margin-bottom: 5px;
font-size: 18px;
font-weight: 500;
}
.contribute-text {
margin-bottom: 0;
color: rgba(255,255,255,.85);
}
// Footer
// --------------------------------------------------
.docs-footer {
padding-top: 20px;
padding-bottom: 20px;
color: rgba(255,255,255,.7);
text-align: center;
background-color: #254456;
.footer-content {
opacity: .7;
a {
color: #fff;
}
}
}