From b7b4fd5c82ea321da3d7858e223eb6adcd225672 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 24 Jul 2012 01:53:32 -0700 Subject: [PATCH] wrap footer in bs docs canvas for scrolling doodad --- docs/base-css.html | 74 +++--- docs/components.html | 74 +++--- docs/customize.html | 74 +++--- docs/extend.html | 250 +++++++++--------- docs/getting-started.html | 74 +++--- docs/index.html | 74 +++--- docs/javascript.html | 74 +++--- docs/scaffolding.html | 74 +++--- docs/templates/layout.mustache | 73 ++--- docs/templates/pages/base-css.mustache | 2 +- docs/templates/pages/components.mustache | 2 +- docs/templates/pages/customize.mustache | 2 +- docs/templates/pages/extend.mustache | 180 ++++++------- docs/templates/pages/getting-started.mustache | 2 +- docs/templates/pages/index.mustache | 2 +- docs/templates/pages/javascript.mustache | 2 +- docs/templates/pages/scaffolding.mustache | 2 +- docs/upgrading.html | 73 ++--- 18 files changed, 565 insertions(+), 543 deletions(-) diff --git a/docs/base-css.html b/docs/base-css.html index 5987abc532..9aa0120833 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1757,48 +1757,50 @@ For example, <code>section</code> should be wrapped as inline. - - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/components.html b/docs/components.html index 8198de37f6..181a8cbfcd 100644 --- a/docs/components.html +++ b/docs/components.html @@ -2158,48 +2158,50 @@ class="clearfix" - - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/customize.html b/docs/customize.html index 5c81f54f25..44e216f08f 100644 --- a/docs/customize.html +++ b/docs/customize.html @@ -429,48 +429,50 @@ - - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/extend.html b/docs/extend.html index 38006289c1..973e081758 100644 --- a/docs/extend.html +++ b/docs/extend.html @@ -78,109 +78,110 @@
-
+
+
- -
-
- -
-
- - - - -
-
-

Built with LESS

-
- - LESS CSS -

Bootstrap is made with LESS at its core, a dynamic stylesheet language created by our good friend, Alexis Sellier. It makes developing systems-based CSS faster, easier, and more fun.

- -

Why LESS?

-

One of Bootstrap's creators wrote a quick blog post about this, summarized here:

-
    -
  • Bootstrap compiles faster ~6x faster with Less compared to Sass
    • -
  • Less is written in JavaScript, making it easier to us to dive in and patch compared to Ruby with Sass.
    • -
  • Less is more; we want to feel like we're writing CSS and making Bootstrap approachable to all.
    • + +
    +
    + - -

    What's included?

    -

    As an extension of CSS, LESS includes variables, mixins for reusable snippets of code, operations for simple math, nesting, and even color functions.

    - -

    Learn more

    -

    Visit the official website at http://lesscss.org to learn more.

    -
+
+
- -
-
-

Compiling Bootstrap with Less

-
+ +
+
+

Built with LESS

+
-

Since our CSS is written with Less and utilizes variables and mixins, it needs to be compiled for final production implementation. Here's how.

+ LESS CSS +

Bootstrap is made with LESS at its core, a dynamic stylesheet language created by our good friend, Alexis Sellier. It makes developing systems-based CSS faster, easier, and more fun.

-
- Note: If you're submitting a pull request to GitHub with modified CSS, you must recompile the CSS via any of these methods. -
+

Why LESS?

+

One of Bootstrap's creators wrote a quick blog post about this, summarized here:

+
    +
  • Bootstrap compiles faster ~6x faster with Less compared to Sass
    • +
  • Less is written in JavaScript, making it easier to us to dive in and patch compared to Ruby with Sass.
    • +
  • Less is more; we want to feel like we're writing CSS and making Bootstrap approachable to all.
    • +
-

Tools for compiling

+

What's included?

+

As an extension of CSS, LESS includes variables, mixins for reusable snippets of code, operations for simple math, nesting, and even color functions.

-

Node with makefile

-

Install the LESS command line compiler, JSHint, Recess, and uglify-js globally with npm by running the following command:

- 
$ npm install -g less jshint recess uglify-js
-

Once installed just run make from the root of your bootstrap directory and you're all set.

-

Additionally, if you have watchr installed, you may run make watch to have bootstrap automatically rebuilt every time you edit a file in the bootstrap lib (this isn't required, just a convenience method).

+

Learn more

+

Visit the official website at http://lesscss.org to learn more.

+
-

Command line

-

Install the LESS command line tool via Node and run the following command:

- 
$ lessc ./less/bootstrap.less > bootstrap.css
-

Be sure to include --compress in that command if you're trying to save some bytes!

-

Javascript

-

Download the latest Less.js and include the path to it (and Bootstrap) in the <head>.

+ + +
+
+

Compiling Bootstrap with Less

+
+ +

Since our CSS is written with Less and utilizes variables and mixins, it needs to be compiled for final production implementation. Here's how.

+ +
+ Note: If you're submitting a pull request to GitHub with modified CSS, you must recompile the CSS via any of these methods. +
+ +

Tools for compiling

+ +

Node with makefile

+

Install the LESS command line compiler, JSHint, Recess, and uglify-js globally with npm by running the following command:

+ 
$ npm install -g less jshint recess uglify-js
+

Once installed just run make from the root of your bootstrap directory and you're all set.

+

Additionally, if you have watchr installed, you may run make watch to have bootstrap automatically rebuilt every time you edit a file in the bootstrap lib (this isn't required, just a convenience method).

+ +

Command line

+

Install the LESS command line tool via Node and run the following command:

+ 
$ lessc ./less/bootstrap.less > bootstrap.css
+

Be sure to include --compress in that command if you're trying to save some bytes!

+ +

Javascript

+

Download the latest Less.js and include the path to it (and Bootstrap) in the <head>.

 <link rel="stylesheet/less" href="/path/to/bootstrap.less">
 <script src="/path/to/less.js"></script>
-

To recompile the .less files, just save them and reload your page. Less.js compiles them and stores them in local storage.

+

To recompile the .less files, just save them and reload your page. Less.js compiles them and stores them in local storage.

-

Unofficial Mac app

-

The unofficial Mac app watches directories of .less files and compiles the code to local files after every save of a watched .less file. If you like, you can toggle preferences in the app for automatic minifying and which directory the compiled files end up in.

+

Unofficial Mac app

+

The unofficial Mac app watches directories of .less files and compiles the code to local files after every save of a watched .less file. If you like, you can toggle preferences in the app for automatic minifying and which directory the compiled files end up in.

-

More apps

-

Crunch

-

Crunch is a great looking LESS editor and compiler built on Adobe Air.

-

CodeKit

-

Created by the same guy as the unofficial Mac app, CodeKit is a Mac app that compiles LESS, SASS, Stylus, and CoffeeScript.

-

Simpless

-

Mac, Linux, and Windows app for drag and drop compiling of LESS files. Plus, the source code is on GitHub.

+

More apps

+

Crunch

+

Crunch is a great looking LESS editor and compiler built on Adobe Air.

+

CodeKit

+

Created by the same guy as the unofficial Mac app, CodeKit is a Mac app that compiles LESS, SASS, Stylus, and CoffeeScript.

+

Simpless

+

Mac, Linux, and Windows app for drag and drop compiling of LESS files. Plus, the source code is on GitHub.

-
+
- -
-
-

Use as static assets

-
-

Quickly start any web project by dropping in the compiled or minified CSS and JS. Layer on custom styles separately for easy upgrades and maintenance moving forward.

+ +
+
+

Use as static assets

+
+

Quickly start any web project by dropping in the compiled or minified CSS and JS. Layer on custom styles separately for easy upgrades and maintenance moving forward.

-

Setup file structure

-

Download the latest compiled Bootstrap and place into your project. For example, you might have something like this:

+

Setup file structure

+

Download the latest compiled Bootstrap and place into your project. For example, you might have something like this:

   app/
   ├── layouts/
@@ -195,8 +196,8 @@
       └── glyphicons-halflings-white.png
-

Utilize starter template

-

Copy the following base HTML to get started.

+

Utilize starter template

+

Copy the following base HTML to get started.

 <html>
   <head>
@@ -212,8 +213,8 @@
 </html>
-

Layer on custom code

-

Work in your custom CSS, JS, and more as necessary to make Bootstrap your own with your own separate CSS and JS files.

+

Layer on custom code

+

Work in your custom CSS, JS, and more as necessary to make Bootstrap your own with your own separate CSS and JS files.

 <html>
   <head>
@@ -233,57 +234,58 @@
 </html>
-
- - +
+
+
-
+ + + + - - + + + + + + + + + + + + + + + + + + + +
- - - - - - - - - - - - - - - - - - - - diff --git a/docs/getting-started.html b/docs/getting-started.html index eb854e111b..5bf5225beb 100644 --- a/docs/getting-started.html +++ b/docs/getting-started.html @@ -287,48 +287,50 @@
- - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/index.html b/docs/index.html index b3f687846c..fd8218580c 100644 --- a/docs/index.html +++ b/docs/index.html @@ -161,48 +161,50 @@ - - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/javascript.html b/docs/javascript.html index 001f974fc0..5dc54fc49c 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -1795,48 +1795,50 @@ $('[data-spy="affix"]').each(function () { - - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/scaffolding.html b/docs/scaffolding.html index c36aa6d59d..7912088457 100644 --- a/docs/scaffolding.html +++ b/docs/scaffolding.html @@ -541,48 +541,50 @@ - - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/templates/layout.mustache b/docs/templates/layout.mustache index 23e84e64ca..4c69e9fc5e 100644 --- a/docs/templates/layout.mustache +++ b/docs/templates/layout.mustache @@ -85,44 +85,47 @@ - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + {{! /.bs-docs-canvas }} + {{#production}} -
-
- -
-
- - - - -
-
-

{{_i}}Built with LESS{{/i}}

-
- - LESS CSS -

{{_i}}Bootstrap is made with LESS at its core, a dynamic stylesheet language created by our good friend, Alexis Sellier. It makes developing systems-based CSS faster, easier, and more fun.{{/i}}

- -

{{_i}}Why LESS?{{/i}}

-

{{_i}}One of Bootstrap's creators wrote a quick blog post about this, summarized here:{{/i}}

-
    -
  • {{_i}}Bootstrap compiles faster ~6x faster with Less compared to Sass{{/i}}
    • -
  • {{_i}}Less is written in JavaScript, making it easier to us to dive in and patch compared to Ruby with Sass.{{/i}}
    • -
  • {{_i}}Less is more; we want to feel like we're writing CSS and making Bootstrap approachable to all.{{/i}}
    • + +
    +
    + - -

    {{_i}}What's included?{{/i}}

    -

    {{_i}}As an extension of CSS, LESS includes variables, mixins for reusable snippets of code, operations for simple math, nesting, and even color functions.{{/i}}

    - -

    {{_i}}Learn more{{/i}}

    -

    {{_i}}Visit the official website at http://lesscss.org to learn more.{{/i}}

    -
+
+
- -
-
-

{{_i}}Compiling Bootstrap with Less{{/i}}

-
+ +
+
+

{{_i}}Built with LESS{{/i}}

+
-

{{_i}}Since our CSS is written with Less and utilizes variables and mixins, it needs to be compiled for final production implementation. Here's how.{{/i}}

+ LESS CSS +

{{_i}}Bootstrap is made with LESS at its core, a dynamic stylesheet language created by our good friend, Alexis Sellier. It makes developing systems-based CSS faster, easier, and more fun.{{/i}}

-
- {{_i}}Note: If you're submitting a pull request to GitHub with modified CSS, you must recompile the CSS via any of these methods.{{/i}} -
+

{{_i}}Why LESS?{{/i}}

+

{{_i}}One of Bootstrap's creators wrote a quick blog post about this, summarized here:{{/i}}

+
    +
  • {{_i}}Bootstrap compiles faster ~6x faster with Less compared to Sass{{/i}}
    • +
  • {{_i}}Less is written in JavaScript, making it easier to us to dive in and patch compared to Ruby with Sass.{{/i}}
    • +
  • {{_i}}Less is more; we want to feel like we're writing CSS and making Bootstrap approachable to all.{{/i}}
    • +
-

{{_i}}Tools for compiling{{/i}}

+

{{_i}}What's included?{{/i}}

+

{{_i}}As an extension of CSS, LESS includes variables, mixins for reusable snippets of code, operations for simple math, nesting, and even color functions.{{/i}}

-

{{_i}}Node with makefile{{/i}}

-

{{_i}}Install the LESS command line compiler, JSHint, Recess, and uglify-js globally with npm by running the following command:{{/i}}

- 
$ npm install -g less jshint recess uglify-js
-

{{_i}}Once installed just run make from the root of your bootstrap directory and you're all set.{{/i}}

-

{{_i}}Additionally, if you have watchr installed, you may run make watch to have bootstrap automatically rebuilt every time you edit a file in the bootstrap lib (this isn't required, just a convenience method).{{/i}}

+

{{_i}}Learn more{{/i}}

+

{{_i}}Visit the official website at http://lesscss.org to learn more.{{/i}}

+
-

{{_i}}Command line{{/i}}

-

{{_i}}Install the LESS command line tool via Node and run the following command:{{/i}}

- 
$ lessc ./less/bootstrap.less > bootstrap.css
-

{{_i}}Be sure to include --compress in that command if you're trying to save some bytes!{{/i}}

-

{{_i}}Javascript{{/i}}

-

{{_i}}Download the latest Less.js and include the path to it (and Bootstrap) in the <head>.{{/i}}

+ + +
+
+

{{_i}}Compiling Bootstrap with Less{{/i}}

+
+ +

{{_i}}Since our CSS is written with Less and utilizes variables and mixins, it needs to be compiled for final production implementation. Here's how.{{/i}}

+ +
+ {{_i}}Note: If you're submitting a pull request to GitHub with modified CSS, you must recompile the CSS via any of these methods.{{/i}} +
+ +

{{_i}}Tools for compiling{{/i}}

+ +

{{_i}}Node with makefile{{/i}}

+

{{_i}}Install the LESS command line compiler, JSHint, Recess, and uglify-js globally with npm by running the following command:{{/i}}

+ 
$ npm install -g less jshint recess uglify-js
+

{{_i}}Once installed just run make from the root of your bootstrap directory and you're all set.{{/i}}

+

{{_i}}Additionally, if you have watchr installed, you may run make watch to have bootstrap automatically rebuilt every time you edit a file in the bootstrap lib (this isn't required, just a convenience method).{{/i}}

+ +

{{_i}}Command line{{/i}}

+

{{_i}}Install the LESS command line tool via Node and run the following command:{{/i}}

+ 
$ lessc ./less/bootstrap.less > bootstrap.css
+

{{_i}}Be sure to include --compress in that command if you're trying to save some bytes!{{/i}}

+ +

{{_i}}Javascript{{/i}}

+

{{_i}}Download the latest Less.js and include the path to it (and Bootstrap) in the <head>.{{/i}}

 <link rel="stylesheet/less" href="/path/to/bootstrap.less">
 <script src="/path/to/less.js"></script>
-

{{_i}}To recompile the .less files, just save them and reload your page. Less.js compiles them and stores them in local storage.{{/i}}

+

{{_i}}To recompile the .less files, just save them and reload your page. Less.js compiles them and stores them in local storage.{{/i}}

-

{{_i}}Unofficial Mac app{{/i}}

-

{{_i}}The unofficial Mac app watches directories of .less files and compiles the code to local files after every save of a watched .less file. If you like, you can toggle preferences in the app for automatic minifying and which directory the compiled files end up in.{{/i}}

+

{{_i}}Unofficial Mac app{{/i}}

+

{{_i}}The unofficial Mac app watches directories of .less files and compiles the code to local files after every save of a watched .less file. If you like, you can toggle preferences in the app for automatic minifying and which directory the compiled files end up in.{{/i}}

-

{{_i}}More apps{{/i}}

-

Crunch

-

{{_i}}Crunch is a great looking LESS editor and compiler built on Adobe Air.{{/i}}

-

CodeKit

-

{{_i}}Created by the same guy as the unofficial Mac app, CodeKit is a Mac app that compiles LESS, SASS, Stylus, and CoffeeScript.{{/i}}

-

Simpless

-

{{_i}}Mac, Linux, and Windows app for drag and drop compiling of LESS files. Plus, the source code is on GitHub.{{/i}}

+

{{_i}}More apps{{/i}}

+

Crunch

+

{{_i}}Crunch is a great looking LESS editor and compiler built on Adobe Air.{{/i}}

+

CodeKit

+

{{_i}}Created by the same guy as the unofficial Mac app, CodeKit is a Mac app that compiles LESS, SASS, Stylus, and CoffeeScript.{{/i}}

+

Simpless

+

{{_i}}Mac, Linux, and Windows app for drag and drop compiling of LESS files. Plus, the source code is on GitHub.{{/i}}

-
+
- -
-
-

{{_i}}Use as static assets{{/i}}

-
-

{{_i}}Quickly start any web project by dropping in the compiled or minified CSS and JS. Layer on custom styles separately for easy upgrades and maintenance moving forward.{{/i}}

+ +
+
+

{{_i}}Use as static assets{{/i}}

+
+

{{_i}}Quickly start any web project by dropping in the compiled or minified CSS and JS. Layer on custom styles separately for easy upgrades and maintenance moving forward.{{/i}}

-

{{_i}}Setup file structure{{/i}}

-

{{_i}}Download the latest compiled Bootstrap and place into your project. For example, you might have something like this:{{/i}}

+

{{_i}}Setup file structure{{/i}}

+

{{_i}}Download the latest compiled Bootstrap and place into your project. For example, you might have something like this:{{/i}}

   app/
   ├── layouts/
@@ -124,8 +125,8 @@
       └── glyphicons-halflings-white.png
-

{{_i}}Utilize starter template{{/i}}

-

{{_i}}Copy the following base HTML to get started.{{/i}}

+

{{_i}}Utilize starter template{{/i}}

+

{{_i}}Copy the following base HTML to get started.{{/i}}

 <html>
   <head>
@@ -141,8 +142,8 @@
 </html>
-

{{_i}}Layer on custom code{{/i}}

-

{{_i}}Work in your custom CSS, JS, and more as necessary to make Bootstrap your own with your own separate CSS and JS files.{{/i}}

+

{{_i}}Layer on custom code{{/i}}

+

{{_i}}Work in your custom CSS, JS, and more as necessary to make Bootstrap your own with your own separate CSS and JS files.{{/i}}

 <html>
   <head>
@@ -162,12 +163,11 @@
 </html>
-
+
+
{{! /span9 }} +
{{! row}} + {{! /.container }} - {{! /span9 }} - {{! row}} - - -{{! /container }} +{{! /.bs-docs-canvas closes in footer }} diff --git a/docs/templates/pages/getting-started.mustache b/docs/templates/pages/getting-started.mustache index 4a4c976c50..d177bca5f1 100644 --- a/docs/templates/pages/getting-started.mustache +++ b/docs/templates/pages/getting-started.mustache @@ -216,4 +216,4 @@ {{! /.container }} -{{! /.bs-docs-canvas }} +{{! /.bs-docs-canvas closes in footer }} diff --git a/docs/templates/pages/index.mustache b/docs/templates/pages/index.mustache index acb3f4c6f8..e18bc92546 100644 --- a/docs/templates/pages/index.mustache +++ b/docs/templates/pages/index.mustache @@ -90,4 +90,4 @@ {{! /.container }} -{{! /.bs-docs-canvas }} +{{! /.bs-docs-canvas closes in footer }} diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache index d63bdae4ec..e072f05b95 100644 --- a/docs/templates/pages/javascript.mustache +++ b/docs/templates/pages/javascript.mustache @@ -1725,4 +1725,4 @@ $('[data-spy="affix"]').each(function () { {{! /.container }} -{{! /.bs-docs-canvas }} +{{! /.bs-docs-canvas closes in footer }} diff --git a/docs/templates/pages/scaffolding.mustache b/docs/templates/pages/scaffolding.mustache index ff5af7c0c0..2ceaf0e4b2 100644 --- a/docs/templates/pages/scaffolding.mustache +++ b/docs/templates/pages/scaffolding.mustache @@ -474,4 +474,4 @@ {{! /.container }} -{{! /.bs-docs-canvas }} +{{! /.bs-docs-canvas closes in footer }} diff --git a/docs/upgrading.html b/docs/upgrading.html index 373fee4749..3ebd66ef5c 100644 --- a/docs/upgrading.html +++ b/docs/upgrading.html @@ -266,44 +266,47 @@ - - + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + +