Skip to content
GitLab
Commit 0b4efcda authored by Mark Otto's avatar Mark Otto
Browse files

more docs homepage cleanup

parent f8a78d7d
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 79 additions and 38 deletions
+79 -38
docs-assets/css/docs.css
+ 65
- 28
View file @ 0b4efcda
...@@ -235,7 +235,6 @@ body { ...@@ -235,7 +235,6 @@ body {
margin: 0 auto 30px; margin: 0 auto 30px;
} }
.bs-masthead h1 { .bs-masthead h1 {
font-size: 60px;
font-weight: 300; font-weight: 300;
line-height: 1; line-height: 1;
} }
...@@ -265,6 +264,9 @@ body { ...@@ -265,6 +264,9 @@ body {
padding-top: 80px; padding-top: 80px;
padding-bottom: 80px; padding-bottom: 80px;
} }
.bs-masthead h1 {
font-size: 60px;
}
.bs-masthead .lead { .bs-masthead .lead {
font-size: 24px; font-size: 24px;
} }
...@@ -272,8 +274,6 @@ body { ...@@ -272,8 +274,6 @@ body {
@media (min-width: 992px) { @media (min-width: 992px) {
.bs-masthead .lead { .bs-masthead .lead {
margin-left: 12.5%;
margin-right: 12.5%;
font-size: 30px; font-size: 30px;
} }
.bs-masthead .btn-outline { .bs-masthead .btn-outline {
...@@ -309,7 +309,6 @@ body { ...@@ -309,7 +309,6 @@ body {
@media (min-width: 768px) { @media (min-width: 768px) {
.bs-header { .bs-header {
/*font-size: 21px;*/
text-align: left; text-align: left;
} }
.bs-header h1 { .bs-header h1 {
...@@ -375,7 +374,7 @@ body { ...@@ -375,7 +374,7 @@ body {
/* Homepage variation */ /* Homepage variation */
.bs-docs-home .carbonad { .bs-docs-home .carbonad {
margin: 0 -15px 40px !important; margin: 0 -30px -31px !important;
} }
@media (min-width: 480px) { @media (min-width: 480px) {
...@@ -394,9 +393,6 @@ body { ...@@ -394,9 +393,6 @@ body {
.carbonad { .carbonad {
margin: 0 !important; margin: 0 !important;
} }
.bs-docs-home .carbonad {
margin: 0 auto !important;
}
} }
@media (min-width: 992px) { @media (min-width: 992px) {
...@@ -420,8 +416,8 @@ body { ...@@ -420,8 +416,8 @@ body {
*/ */
.bs-featurette { .bs-featurette {
padding-top: 100px; padding-top: 40px;
padding-bottom: 100px; padding-bottom: 40px;
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
color: #555; color: #555;
...@@ -435,33 +431,74 @@ body { ...@@ -435,33 +431,74 @@ body {
} }
.bs-featurette-title { .bs-featurette-title {
font-size: 40px; font-size: 30px;
font-weight: normal; font-weight: normal;
color: #333; color: #333;
margin-bottom: 5px; margin-bottom: 5px;
} }
.bs-featurette .lead { .half-rule {
margin-left: auto; width: 100px;
margin-right: auto; margin: 40px auto;
max-width: 80%;
}
.bs-featurette h3,
.bs-featurette h4 {
color: #333;
font-weight: normal;
} }
.bs-featurette h3 { .bs-featurette h3 {
font-weight: normal;
color: #333;
margin-bottom: 5px; margin-bottom: 5px;
} }
/*.bs-featurette h4 { .bs-featurette-img {
margin-top: 0; display: block;
margin-bottom: 0; margin-bottom: 20px;
color: #333;
} }
*/ .bs-featurette-img:hover {
.half-rule { text-decoration: none;
max-width: 100px; color: #428bca;
margin: 40px auto; }
.bs-featurette-img img {
display: block;
margin-bottom: 15px;
}
/* Featured sites */
.bs-featured-sites {
margin-left: -1px;
margin-right: -1px;
}
.bs-featured-sites .col-sm-3 {
padding-left: 1px;
padding-right: 1px;
}
@media (min-width: 480px) {
.bs-featurette .img-responsive {
margin-top: 30px;
}
}
@media (min-width: 768px) {
.bs-featurette {
padding-top: 100px;
padding-bottom: 100px;
}
.bs-featurette-title {
font-size: 40px;
}
.bs-featurette .lead {
margin-left: auto;
margin-right: auto;
max-width: 80%;
}
.bs-featured-sites .col-sm-3:first-child img {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.bs-featured-sites .col-sm-3:last-child img {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.bs-featurette .img-responsive {
margin-top: 0;
}
} }
......
index.html
+ 14
- 10
View file @ 0b4efcda
...@@ -8,7 +8,7 @@ base_url: "./" ...@@ -8,7 +8,7 @@ base_url: "./"
<div class="container"> <div class="container">
<span class="bs-booticon bs-booticon-lg">B</span> <span class="bs-booticon bs-booticon-lg">B</span>
<h1>Bootstrap</h1> <h1>Bootstrap</h1>
<p class="lead">The most popular front-end framework for building on the web.</p> <p class="lead">The most popular front-end framework for designing and building on the web.</p>
<p class="lead"> <p class="lead">
<a href="{{ site.download_dist }}" class="btn btn-outline btn-lg" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download {{ site.current_version }}']);" data-content="Quickly get started with Bootstrap's precompiled CSS, JavaScript, and fonts.">Download Bootstrap</a> <a href="{{ site.download_dist }}" class="btn btn-outline btn-lg" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download {{ site.current_version }}']);" data-content="Quickly get started with Bootstrap's precompiled CSS, JavaScript, and fonts.">Download Bootstrap</a>
<a href="{{ site.download_source }}" class="btn btn-outline btn-lg" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download {{ site.current_version source }}']);" data-content="Download Bootstrap's LESS, JavaScript, font, and documentation source code.">Download source</a> <a href="{{ site.download_source }}" class="btn btn-outline btn-lg" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download {{ site.current_version source }}']);" data-content="Download Bootstrap's LESS, JavaScript, font, and documentation source code.">Download source</a>
...@@ -57,22 +57,26 @@ base_url: "./" ...@@ -57,22 +57,26 @@ base_url: "./"
<hr class="half-rule"> <hr class="half-rule">
<div class="row"> <div class="row bs-featured-sites">
<div class="col-sm-3"> <div class="col-sm-3">
<img src="http://expo.getbootstrap.com/screenshots/coinbase.jpg" alt="" class="img-responsive img-thumbnail"> <a href="http://expo.getbootstrap.com/" class="bs-featurette-img">
<h4>Coinbase</h4> <img src="http://expo.getbootstrap.com/screenshots/coinbase.jpg" alt="" class="img-responsive">
</a>
</div> </div>
<div class="col-sm-3"> <div class="col-sm-3">
<img src="http://expo.getbootstrap.com/screenshots/localcrime.jpg" alt="" class="img-responsive img-thumbnail"> <a href="http://expo.getbootstrap.com/" class="bs-featurette-img">
<h4>Localcrime</h4> <img src="http://expo.getbootstrap.com/screenshots/localcrime.jpg" alt="" class="img-responsive">
</a>
</div> </div>
<div class="col-sm-3"> <div class="col-sm-3">
<img src="http://expo.getbootstrap.com/screenshots/fortrabbit.jpg" alt="" class="img-responsive img-thumbnail"> <a href="http://expo.getbootstrap.com/" class="bs-featurette-img">
<h4>Fortrabbit</h4> <img src="http://expo.getbootstrap.com/screenshots/fortrabbit.jpg" alt="" class="img-responsive">
</a>
</div> </div>
<div class="col-sm-3"> <div class="col-sm-3">
<img src="http://expo.getbootstrap.com/screenshots/sentry.jpg" alt="" class="img-responsive img-thumbnail"> <a href="http://expo.getbootstrap.com/" class="bs-featurette-img">
<h4>Sentry</h4> <img src="http://expo.getbootstrap.com/screenshots/sentry.jpg" alt="" class="img-responsive">
</a>
</div> </div>
</div> </div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment