Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/twbs/bootstrap.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorfat <jacobthornton@gmail.com>2013-02-08 10:13:13 +0400
committerfat <jacobthornton@gmail.com>2013-02-08 10:13:13 +0400
commit8c7f9c66a7d12f47f50618ef420868fe836d0c33 (patch)
tree552f251d1637a1749c34fcdbb3390653d2fdb8ae /docs/examples
parentee91afba63bc6e9687397b9052858fca242c2ff5 (diff)
parentc4d47fb1ea45ed2fc3cf382d087ed87b87c69288 (diff)
Merge branch '2.3.0-wip'v2.3.0
Diffstat (limited to 'docs/examples')
-rw-r--r--docs/examples/carousel.html12
-rw-r--r--docs/examples/fluid.html19
-rw-r--r--docs/examples/hero.html10
-rw-r--r--docs/examples/justified-nav.html (renamed from docs/examples/marketing-alternate.html)6
-rw-r--r--docs/examples/marketing-narrow.html4
-rw-r--r--docs/examples/signin.html2
-rw-r--r--docs/examples/starter-template.html6
-rw-r--r--docs/examples/sticky-footer-navbar.html161
-rw-r--r--docs/examples/sticky-footer.html3
9 files changed, 199 insertions, 24 deletions
diff --git a/docs/examples/carousel.html b/docs/examples/carousel.html
index 0958103fc6..81d1a28a18 100644
--- a/docs/examples/carousel.html
+++ b/docs/examples/carousel.html
@@ -68,7 +68,7 @@
- /* CUSTOMIZE THE NAVBAR
+ /* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
/* Carousel base class */
@@ -88,6 +88,7 @@
text-shadow: 0 1px 1px rgba(0,0,0,.4);
background-color: transparent;
border: 0;
+ z-index: 10;
}
.carousel .item {
@@ -254,7 +255,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -278,11 +279,11 @@
<div class="navbar navbar-inverse">
<div class="navbar-inner">
<!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
- <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
- </a>
+ </button>
<a class="brand" href="#">Project name</a>
<!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
<div class="nav-collapse collapse">
@@ -417,7 +418,7 @@
<!-- FOOTER -->
<footer>
<p class="pull-right"><a href="#">Back to top</a></p>
- <p>&copy; 2012 Company, Inc. &middot; <a href="#">Privacy</a> &middot; <a href="#">Terms</a></p>
+ <p>&copy; 2013 Company, Inc. &middot; <a href="#">Privacy</a> &middot; <a href="#">Terms</a></p>
</footer>
</div><!-- /.container -->
@@ -448,5 +449,6 @@
})
}(window.jQuery)
</script>
+ <script src="../assets/js/holder/holder.js"></script>
</body>
</html>
diff --git a/docs/examples/fluid.html b/docs/examples/fluid.html
index 4ca2920efd..502062a273 100644
--- a/docs/examples/fluid.html
+++ b/docs/examples/fluid.html
@@ -17,12 +17,21 @@
.sidebar-nav {
padding: 9px 0;
}
+
+ @media (max-width: 980px) {
+ /* Enable use of floated navbar text */
+ .navbar-text.pull-right {
+ float: none;
+ padding-left: 5px;
+ padding-right: 5px;
+ }
+ }
</style>
<link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -38,11 +47,11 @@
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
- <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
- </a>
+ </button>
<a class="brand" href="#">Project name</a>
<div class="nav-collapse collapse">
<p class="navbar-text pull-right">
@@ -86,7 +95,7 @@
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
- <p><a class="btn btn-primary btn-large">Learn more &raquo;</a></p>
+ <p><a href="#" class="btn btn-primary btn-large">Learn more &raquo;</a></p>
</div>
<div class="row-fluid">
<div class="span4">
@@ -128,7 +137,7 @@
<hr>
<footer>
- <p>&copy; Company 2012</p>
+ <p>&copy; Company 2013</p>
</footer>
</div><!--/.fluid-container-->
diff --git a/docs/examples/hero.html b/docs/examples/hero.html
index f0a5e17093..6fb7a2c4e0 100644
--- a/docs/examples/hero.html
+++ b/docs/examples/hero.html
@@ -19,7 +19,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -35,11 +35,11 @@
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
- <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
- </a>
+ </button>
<a class="brand" href="#">Project name</a>
<div class="nav-collapse collapse">
<ul class="nav">
@@ -75,7 +75,7 @@
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
- <p><a class="btn btn-primary btn-large">Learn more &raquo;</a></p>
+ <p><a href="#" class="btn btn-primary btn-large">Learn more &raquo;</a></p>
</div>
<!-- Example row of columns -->
@@ -100,7 +100,7 @@
<hr>
<footer>
- <p>&copy; Company 2012</p>
+ <p>&copy; Company 2013</p>
</footer>
</div> <!-- /container -->
diff --git a/docs/examples/marketing-alternate.html b/docs/examples/justified-nav.html
index 8cbeb02a25..ef8f8d4286 100644
--- a/docs/examples/marketing-alternate.html
+++ b/docs/examples/justified-nav.html
@@ -57,6 +57,8 @@
}
.navbar .nav {
margin: 0;
+ display: table;
+ width: 100%;
}
.navbar .nav li {
display: table-cell;
@@ -82,7 +84,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -146,7 +148,7 @@
<hr>
<div class="footer">
- <p>&copy; Company 2012</p>
+ <p>&copy; Company 2013</p>
</div>
</div> <!-- /container -->
diff --git a/docs/examples/marketing-narrow.html b/docs/examples/marketing-narrow.html
index 9ce1cd5bc6..f6f5d16851 100644
--- a/docs/examples/marketing-narrow.html
+++ b/docs/examples/marketing-narrow.html
@@ -50,7 +50,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -111,7 +111,7 @@
<hr>
<div class="footer">
- <p>&copy; Company 2012</p>
+ <p>&copy; Company 2013</p>
</div>
</div> <!-- /container -->
diff --git a/docs/examples/signin.html b/docs/examples/signin.html
index 17578483a3..031052789d 100644
--- a/docs/examples/signin.html
+++ b/docs/examples/signin.html
@@ -46,7 +46,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
diff --git a/docs/examples/starter-template.html b/docs/examples/starter-template.html
index 93ba809e38..29c47a89c9 100644
--- a/docs/examples/starter-template.html
+++ b/docs/examples/starter-template.html
@@ -18,7 +18,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -34,11 +34,11 @@
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
- <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
- </a>
+ </button>
<a class="brand" href="#">Project name</a>
<div class="nav-collapse collapse">
<ul class="nav">
diff --git a/docs/examples/sticky-footer-navbar.html b/docs/examples/sticky-footer-navbar.html
new file mode 100644
index 0000000000..a9027c8c28
--- /dev/null
+++ b/docs/examples/sticky-footer-navbar.html
@@ -0,0 +1,161 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Sticky footer &middot; Twitter Bootstrap</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <!-- CSS -->
+ <link href="../assets/css/bootstrap.css" rel="stylesheet">
+ <style type="text/css">
+
+ /* Sticky footer styles
+ -------------------------------------------------- */
+
+ html,
+ body {
+ height: 100%;
+ /* The html and body elements cannot have any padding or margin. */
+ }
+
+ /* Wrapper for page content to push down footer */
+ #wrap {
+ min-height: 100%;
+ height: auto !important;
+ height: 100%;
+ /* Negative indent footer by it's height */
+ margin: 0 auto -60px;
+ }
+
+ /* Set the fixed height of the footer here */
+ #push,
+ #footer {
+ height: 60px;
+ }
+ #footer {
+ background-color: #f5f5f5;
+ }
+
+ /* Lastly, apply responsive CSS fixes as necessary */
+ @media (max-width: 767px) {
+ #footer {
+ margin-left: -20px;
+ margin-right: -20px;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+ }
+
+
+
+ /* Custom page CSS
+ -------------------------------------------------- */
+ /* Not required for template or sticky footer method. */
+
+ #wrap > .container {
+ padding-top: 60px;
+ }
+ .container .credit {
+ margin: 20px 0;
+ }
+
+ code {
+ font-size: 80%;
+ }
+
+ </style>
+ <link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
+
+ <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
+ <!--[if lt IE 9]>
+ <script src="../assets/js/html5shiv.js"></script>
+ <![endif]-->
+
+ <!-- Fav and touch icons -->
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
+ <link rel="shortcut icon" href="../assets/ico/favicon.png">
+ </head>
+
+ <body>
+
+
+ <!-- Part 1: Wrap all page content here -->
+ <div id="wrap">
+
+ <!-- Fixed navbar -->
+ <div class="navbar navbar-fixed-top">
+ <div class="navbar-inner">
+ <div class="container">
+ <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="brand" href="#">Project name</a>
+ <div class="nav-collapse collapse">
+ <ul class="nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="nav-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!--/.nav-collapse -->
+ </div>
+ </div>
+ </div>
+
+ <!-- Begin page content -->
+ <div class="container">
+ <div class="page-header">
+ <h1>Sticky footer with fixed navbar</h1>
+ </div>
+ <p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added within <code>#wrap</code> with <code>padding-top: 60px;</code> on the <code>.container</code>.</p>
+ <p>Back to <a href="./sticky-footer.html">the sticky footer</a> minus the navbar.</p>
+ </div>
+
+ <div id="push"></div>
+ </div>
+
+ <div id="footer">
+ <div class="container">
+ <p class="muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
+ </div>
+ </div>
+
+
+
+ <!-- Le javascript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../assets/js/jquery.js"></script>
+ <script src="../assets/js/bootstrap-transition.js"></script>
+ <script src="../assets/js/bootstrap-alert.js"></script>
+ <script src="../assets/js/bootstrap-modal.js"></script>
+ <script src="../assets/js/bootstrap-dropdown.js"></script>
+ <script src="../assets/js/bootstrap-scrollspy.js"></script>
+ <script src="../assets/js/bootstrap-tab.js"></script>
+ <script src="../assets/js/bootstrap-tooltip.js"></script>
+ <script src="../assets/js/bootstrap-popover.js"></script>
+ <script src="../assets/js/bootstrap-button.js"></script>
+ <script src="../assets/js/bootstrap-collapse.js"></script>
+ <script src="../assets/js/bootstrap-carousel.js"></script>
+ <script src="../assets/js/bootstrap-typeahead.js"></script>
+
+ </body>
+</html>
diff --git a/docs/examples/sticky-footer.html b/docs/examples/sticky-footer.html
index 1c9c36149e..d307d79387 100644
--- a/docs/examples/sticky-footer.html
+++ b/docs/examples/sticky-footer.html
@@ -67,7 +67,7 @@
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
- <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <script src="../assets/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
@@ -90,6 +90,7 @@
<h1>Sticky footer</h1>
</div>
<p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
+ <p>Use <a href="./sticky-footer-navbar.html">the sticky footer</a> with a fixed navbar if need be, too.</p>
</div>
<div id="push"></div>