]> git.ipfire.org Git - thirdparty/bootstrap.git/commitdiff
Derp on type styles a bit more; bring back and fix up more more docs styles
authorMark Otto <otto@github.com>
Wed, 16 Jan 2013 19:38:34 +0000 (11:38 -0800)
committerMark Otto <otto@github.com>
Wed, 16 Jan 2013 19:38:34 +0000 (11:38 -0800)
docs/assets/css/bootstrap.css
docs/assets/css/docs.css
docs/index.html
docs/templates/pages/index.mustache
less/buttons.less
less/type.less

index d425637465537064523548c95bf7ff8c89337e00..e8527cd35ab53343e49508496834d6eb5103fc4b 100644 (file)
@@ -337,7 +337,7 @@ p {
   margin-bottom: 20px;
   font-size: 21px;
   font-weight: 200;
-  line-height: 30px;
+  line-height: 1.25;
 }
 
 small {
@@ -440,26 +440,32 @@ h6 {
 
 h1 {
   font-size: 38.5px;
+  font-size: 4rem;
 }
 
 h2 {
   font-size: 31.5px;
+  font-size: 3rem;
 }
 
 h3 {
   font-size: 24.5px;
+  font-size: 2.5rem;
 }
 
 h4 {
   font-size: 17.5px;
+  font-size: 2rem;
 }
 
 h5 {
   font-size: 14px;
+  font-size: 1.6rem;
 }
 
 h6 {
   font-size: 11.9px;
+  font-size: 1.2rem;
 }
 
 h1 small {
@@ -729,7 +735,7 @@ pre code {
   padding: 6px 12px;
   margin-bottom: 0;
   font-size: 14px;
-  font-weight: bold;
+  font-weight: 500;
   line-height: 20px;
   text-align: center;
   vertical-align: middle;
index 3652cbf3348864c87c33a1847e3c5b127d923cc1..002735b6a63391cb9178ea98668f5877359da066 100644 (file)
@@ -1,18 +1,49 @@
+/*
+ * Bootstrap Documentation
+ * Special styles for presenting Bootstrap's documentation and code examples.
+ */
 
 
-/* Docs =================================================== */
 
+/* Key scaffolding
+-------------------------------------------------- */
+
+body {
+  position: relative; /* For scrollyspy */
+}
+
+/*  */
 body > .container,
 .footer .container {
   padding-left:  15px;
   padding-right: 15px;
 }
 
+
+
+/* Sections
+-------------------------------------------------- */
+
+/* Padding for in-page bookmarks */
+section {
+  padding-top: 30px;
+}
+
+/* Few stylistic typography tweaks */
+section > .page-header,
+section > .lead {
+  color: #5a5a5a;
+}
+section > ul li {
+  margin-bottom: 5px;
+}
+
+
+
 /* Jumbotrons
 -------------------------------------------------- */
 
-/* Base class
-------------------------- */
+/* Base class */
 .bs-docs-jumbotron {
   position: relative;
   margin-bottom: 20px;
@@ -21,35 +52,117 @@ body > .container,
   background-color: #b94a48;
 }
 .bs-docs-jumbotron h1 {
-  margin: 0;
+  font-size: 50px;
 }
-.bs-docs-jumbotron p {
-  margin-bottom: 0;
+
+/* Link styles (used on .masthead-links as well) */
+.bs-docs-jumbotron a {
+  color: #fff;
+  color: rgba(255,255,255,.5);
+  -webkit-transition: all .2s ease-in-out;
+     -moz-transition: all .2s ease-in-out;
+          transition: all .2s ease-in-out;
+}
+.bs-docs-jumbotron a:hover {
+  color: #fff;
 }
 
+/* Download button */
+.bs-docs-jumbotron .btn {
+  padding: 18px 24px;
+  font-size: 21px;
+  color: #b94a48; /* redeclare to override the `.jumbotron a` */
+  background-color: #fff;
+}
+.bs-docs-jumbotron .btn,
+.bs-docs-jumbotron .btn:hover,
+.bs-docs-jumbotron .btn:active {
+  color: #b94a48; /* redeclare to override the `.jumbotron a` */
+  background-color: #fff;
+  border-color: #fff;
+}
 
+/* Masthead (docs home)
+------------------------- */
+.masthead {
+  /*padding: 70px 0 80px;*/
+  color: #fff;
+  text-align: center;
+}
+.masthead h1 {
+  /*font-size: 120px;*/
+  /*line-height: 1;*/
+  /*letter-spacing: -2px;*/
+}
+.masthead p {
+  /*font-size: 40px;
+  font-weight: 200;
+  line-height: 1.25;*/
+}
 
+/* Textual links in masthead */
+.masthead-links {
+  margin: 20px 0;
+  list-style: none;
+}
+.masthead-links li {
+  display: inline;
+  padding: 0 10px;
+  color: rgba(255,255,255,.25);
+}
 
-.bs-docs-example {
-  border: 1px solid #ddd;
-  padding: 14px;
-  margin-bottom: -1px;
+/* Subhead (other pages)
+------------------------- */
+.subhead {
+  text-align: left;
 }
-.bs-docs-example p:last-child,
-.bs-docs-example ul:last-child,
-.bs-docs-example ol:last-child {
-  margin-bottom: 0;
+.subhead h1 {
+  font-size: 60px;
 }
-.bs-docs-example + .prettyprint {
-  margin-top: 0;
+.subhead p {
+  margin-bottom: 20px;
 }
-.prettyprint .linenums {
-  margin-left: 0;
+.subhead .navbar {
+  display: none;
 }
 
 
 
+/* Marketing section of Overview
+-------------------------------------------------- */
+
+.marketing {
+  text-align: center;
+  color: #5a5a5a;
+}
+.marketing h1 {
+  margin: 60px 0 10px;
+  line-height: 1;
+}
+.marketing h2 {
+  margin-bottom: 5px;
+}
+.marketing p {
+  font-size: 16px;
+  line-height: 1.4;
+}
+.marketing .marketing-byline {
+  margin-bottom: 40px;
+  font-size: 21px;
+  font-weight: 300;
+  line-height: 1.25;
+  color: #999;
+}
+.marketing-img {
+  display: block;
+  margin: 30px auto 10px;
+  max-height: 145px;
+}
+
+
 
+/* Special grid styles
+-------------------------------------------------- */
 
 .show-grid [class^="span"] {
   padding-top: 10px;
@@ -61,6 +174,46 @@ body > .container,
 
 
 
+/* Bootstrap code examples
+-------------------------------------------------- */
+
+/* Base class */
+.bs-docs-example {
+  position: relative;
+  padding: 14px;
+  margin-bottom: -1px;
+  border: 1px solid #ddd;
+}
+/* Echo out a label for the example */
+.bs-docs-example:after {
+  content: "Example";
+  position: absolute;
+  top: -1px;
+  left: -1px;
+  padding: 3px 7px;
+  font-size: 12px;
+  font-weight: bold;
+  color: #9da0a4;
+  background-color: #f5f5f5;
+  border: 1px solid #ddd;
+}
+
+/* Tweak display of the examples */
+.bs-docs-example + .prettyprint {
+  margin-top: 0;
+}
+.prettyprint .linenums {
+  margin-left: 0;
+}
+
+/* Tweak content of examples for optimum awesome */
+.bs-docs-example p:last-child,
+.bs-docs-example ul:last-child,
+.bs-docs-example ol:last-child {
+  margin-bottom: 0;
+}
+
+
 
 /* Footer
 -------------------------------------------------- */
index 4f108a89aa093e9cf3e02e127107cc05b8af5eb8..f7e4be02f9f5bda824fd780a5646c90b58cf7410 100644 (file)
@@ -69,7 +69,7 @@
 <div class="bs-docs-jumbotron masthead">
   <div class="container">
     <h1>Bootstrap</h1>
-    <p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
+    <p class="lead">Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
     <p>
       <a href="assets/bootstrap.zip" class="btn btn-large" >Download Bootstrap</a>
     </p>
       </div>
     </div>
 
-    <hr class="soften">
-
     <h1>Built with Bootstrap.</h1>
     <p class="marketing-byline">For even more sites built with Bootstrap, <a href="http://builtwithbootstrap.tumblr.com/" target="_blank">visit the unofficial Tumblr</a> or <a href="./getting-started.html#examples">browse the examples</a>.</p>
     <div class="row example-sites">
index 714ffc5b0be2805a931fbb1f3748c8c0b3f2294f..6de847cc314e60eb0d4ecf0d55b7b855202cd80e 100644 (file)
@@ -1,7 +1,7 @@
 <div class="bs-docs-jumbotron masthead">
   <div class="container">
     <h1>Bootstrap</h1>
-    <p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
+    <p class="lead">Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
     <p>
       <a href="assets/bootstrap.zip" class="btn btn-large" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0']);"{{/production}}>Download Bootstrap</a>
     </p>
@@ -42,8 +42,6 @@
       </div>
     </div>
 
-    <hr class="soften">
-
     <h1>Built with Bootstrap.</h1>
     <p class="marketing-byline">For even more sites built with Bootstrap, <a href="http://builtwithbootstrap.tumblr.com/" target="_blank">visit the unofficial Tumblr</a> or <a href="./getting-started.html#examples">browse the examples</a>.</p>
     <div class="row example-sites">
index 4295d2dcf8fc327382d91fea55f213e86a21f5f6..6c1541a28768c147719dddece0a102760c7fc149 100644 (file)
@@ -12,7 +12,7 @@
   padding: 6px 12px;
   margin-bottom: 0; // For input.btn
   font-size: @font-size-base;
-  font-weight: bold;
+  font-weight: 500;
   line-height: @line-height-base;
   text-align: center;
   vertical-align: middle;
index 7404a6c78cb9f51ecab79d996005b49ef024fc8f..d5d1d8866fb4d8d61d1becfcaa35d91180b437e2 100644 (file)
@@ -13,7 +13,7 @@ p {
   margin-bottom: @line-height-base;
   font-size: @font-size-base * 1.5;
   font-weight: 200;
-  line-height: @line-height-base * 1.5;
+  line-height: 1.25;
 }
 
 
@@ -74,12 +74,12 @@ h6 {
   margin-bottom: @line-height-base / 2;
 }
 
-h1 { font-size: @font-size-base * 2.75; } // ~38px
-h2 { font-size: @font-size-base * 2.25; } // ~32px
-h3 { font-size: @font-size-base * 1.75; } // ~24px
-h4 { font-size: @font-size-base * 1.25; } // ~18px
-h5 { font-size: @font-size-base; }
-h6 { font-size: @font-size-base * 0.85; } // ~12px
+h1 { font-size: @font-size-base * 2.75; font-size: 4rem; } // ~38px
+h2 { font-size: @font-size-base * 2.25; font-size: 3rem; } // ~32px
+h3 { font-size: @font-size-base * 1.75; font-size: 2.5rem; } // ~24px
+h4 { font-size: @font-size-base * 1.25; font-size: 2rem; } // ~18px
+h5 { font-size: @font-size-base; font-size: 1.6rem; }
+h6 { font-size: @font-size-base * 0.85; font-size: 1.2rem; } // ~12px
 
 h1 small { font-size: @font-size-base * 1.75; } // ~24px
 h2 small { font-size: @font-size-base * 1.25; } // ~18px