mirror of
https://github.com/twbs/bootstrap.git
synced 2025-02-20 17:54:23 +01:00
Start using some includes; test out some pygments highlighting
This commit is contained in:
Mark Otto
parent
b12ff91d48
commit
d709dba284
@ -1,8 +1,6 @@
|
||||
markdown: rdiscount
|
||||
permalink: pretty
|
||||
pygments: true
|
||||
paginate: 5
|
||||
|
||||
source: ./docs
|
||||
destination: ./_gh_pages
|
||||
auto: true
|
||||
|
||||
35
docs/_includes/colophon.html
Normal file
35
docs/_includes/colophon.html
Normal file
@ -0,0 +1,35 @@
|
||||
<!-- Footer
|
||||
================================================== -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
|
||||
<div class="bs-docs-social">
|
||||
<ul class="bs-docs-social-buttons">
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
|
||||
</li>
|
||||
<li class="follow-btn">
|
||||
<a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
|
||||
</li>
|
||||
<li class="tweet-btn">
|
||||
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twitter.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<p>Designed and built with all the love in the world by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.</p>
|
||||
<p>Code licensed under <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
|
||||
<p><a href="http://glyphicons.com">Glyphicons Free</a> licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
|
||||
<ul class="footer-links">
|
||||
<li><a href="http://blog.getbootstrap.com">Blog</a></li>
|
||||
<li class="muted">·</li>
|
||||
<li><a href="https://github.com/twitter/bootstrap/issues?state=open">Issues</a></li>
|
||||
<li class="muted">·</li>
|
||||
<li><a href="https://github.com/twitter/bootstrap/blob/master/CHANGELOG.md">Changelog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</footer>
|
||||
39
docs/_includes/footer.html
Normal file
39
docs/_includes/footer.html
Normal file
@ -0,0 +1,39 @@
|
||||
<!-- Bootstrap core 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>
|
||||
<script src="/assets/js/bootstrap-affix.js"></script>
|
||||
|
||||
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
|
||||
<script src="/assets/js/holder/holder.js"></script>
|
||||
<script src="/assets/js/google-code-prettify/prettify.js"></script>
|
||||
|
||||
<script src="/assets/js/application.js"></script>
|
||||
|
||||
<!-- Analytics
|
||||
================================================== -->
|
||||
<script>
|
||||
var _gauges = _gauges || [];
|
||||
(function() {
|
||||
var t = document.createElement('script');
|
||||
t.type = 'text/javascript';
|
||||
t.async = true;
|
||||
t.id = 'gauges-tracker';
|
||||
t.setAttribute('data-site-id', '4f0dc9fef5a1f55508000013');
|
||||
t.src = '//secure.gaug.es/track.js';
|
||||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(t, s);
|
||||
})();
|
||||
</script>
|
||||
44
docs/_includes/header.html
Normal file
44
docs/_includes/header.html
Normal file
@ -0,0 +1,44 @@
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<title>
|
||||
{% if page.title == "Bootstrap" %}
|
||||
{{ page.title }}
|
||||
{% else if %}
|
||||
{{ page.title }} · Bootstrap
|
||||
{% endif %}
|
||||
</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link href="/assets/css/bootstrap.css" rel="stylesheet">
|
||||
|
||||
<!-- Documentation extras -->
|
||||
<link href="/assets/css/docs.css" rel="stylesheet">
|
||||
<link href="/assets/css/pygments_monokai.css" rel="stylesheet">
|
||||
<link href="/assets/js/google-code-prettify/prettify.css" rel="stylesheet">
|
||||
|
||||
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="/assets/js/html5shiv.js"></script>
|
||||
<script src="/assets/js/respond/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<!-- Favicons -->
|
||||
<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">
|
||||
|
||||
<script type="text/javascript">
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-146052-10']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
8
docs/_includes/masthead.html
Normal file
8
docs/_includes/masthead.html
Normal file
@ -0,0 +1,8 @@
|
||||
{% raw %}
|
||||
<header class="bs-docs-jumbotron subhead">
|
||||
<div class="container">
|
||||
<h1>{{ page.title }}</h1>
|
||||
<p class="lead">{{ page.description }}</p>
|
||||
</div>
|
||||
</header>
|
||||
{% endraw %}
|
||||
37
docs/_includes/navbar.html
Normal file
37
docs/_includes/navbar.html
Normal file
@ -0,0 +1,37 @@
|
||||
<!-- Navbar
|
||||
================================================== -->
|
||||
<div class="navbar navbar-inverse navbar-fixed-top">
|
||||
<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="/">Bootstrap</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<li {% if page.title == "Bootstrap" %}class="active"{% endif %}>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
<li {% if page.title == "Getting started" %}class="active"{% endif %}>
|
||||
<a href="/getting-started">Get started</a>
|
||||
</li>
|
||||
<li {% if page.title == "CSS" %}class="active"{% endif %}>
|
||||
<a href="/css">CSS</a>
|
||||
</li>
|
||||
<li {% if page.title == "Components" %}class="active"{% endif %}>
|
||||
<a href="/components">Components</a>
|
||||
</li>
|
||||
<li {% if page.title == "JavaScript plugins" %}class="active"{% endif %}>
|
||||
<a href="/javascript">JavaScript</a>
|
||||
</li>
|
||||
<li {% if page.title == "Customize and download" %}class="active"{% endif %}>
|
||||
<a href="/customize">Customize</a>
|
||||
</li>
|
||||
<li {% if page.title == "Gallery" %}class="active"{% endif %}>
|
||||
<a href="/gallery">Gallery</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,173 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<title>
|
||||
{% if page.title == "Bootstrap" %}
|
||||
{{ page.title }}
|
||||
{% else if %}
|
||||
{{ page.title }} · Bootstrap
|
||||
{% endif %}
|
||||
</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link href="/assets/css/bootstrap.css" rel="stylesheet">
|
||||
|
||||
<!-- Documentation extras -->
|
||||
<link href="/assets/css/docs.css" rel="stylesheet">
|
||||
<link href="/assets/js/google-code-prettify/prettify.css" rel="stylesheet">
|
||||
|
||||
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="/assets/js/html5shiv.js"></script>
|
||||
<script src="/assets/js/respond/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<!-- Favicons -->
|
||||
<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">
|
||||
|
||||
<script type="text/javascript">
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-146052-10']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
<!-- Meta, title, CSS, favicons, etc. -->
|
||||
{% include header.html %}
|
||||
<!-- Place anything custom after this. -->
|
||||
</head>
|
||||
|
||||
<body data-spy="scroll" data-target=".bs-docs-sidebar">
|
||||
|
||||
<!-- Navbar
|
||||
================================================== -->
|
||||
<div class="navbar navbar-inverse navbar-fixed-top">
|
||||
<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="/">Bootstrap</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<li {% if page.title == "Bootstrap" %}class="active"{% endif %}>
|
||||
<a href="/">Home</a>
|
||||
</li>
|
||||
<li {% if page.title == "Getting started" %}class="active"{% endif %}>
|
||||
<a href="/getting-started">Get started</a>
|
||||
</li>
|
||||
<li {% if page.title == "CSS" %}class="active"{% endif %}>
|
||||
<a href="/css">CSS</a>
|
||||
</li>
|
||||
<li {% if page.title == "Components" %}class="active"{% endif %}>
|
||||
<a href="/components">Components</a>
|
||||
</li>
|
||||
<li {% if page.title == "JavaScript plugins" %}class="active"{% endif %}>
|
||||
<a href="/javascript">JavaScript</a>
|
||||
</li>
|
||||
<li {% if page.title == "Customize and download" %}class="active"{% endif %}>
|
||||
<a href="/customize">Customize</a>
|
||||
</li>
|
||||
<li {% if page.title == "Gallery" %}class="active"{% endif %}>
|
||||
<a href="/gallery">Gallery</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Main navbar for all docs pages. -->
|
||||
{% include navbar.html %}
|
||||
|
||||
<!-- Page content of course! -->
|
||||
{{ content }}
|
||||
|
||||
{{ content }}
|
||||
<!-- Main docs footer (social buttons, copyright, etc). -->
|
||||
{% include colophon.html %}
|
||||
|
||||
|
||||
|
||||
<!-- Footer
|
||||
================================================== -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
|
||||
<div class="bs-docs-social">
|
||||
<ul class="bs-docs-social-buttons">
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
|
||||
</li>
|
||||
<li class="follow-btn">
|
||||
<a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
|
||||
</li>
|
||||
<li class="tweet-btn">
|
||||
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twitter.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<p>Designed and built with all the love in the world by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.</p>
|
||||
<p>Code licensed under <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
|
||||
<p><a href="http://glyphicons.com">Glyphicons Free</a> licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
|
||||
<ul class="footer-links">
|
||||
<li><a href="http://blog.getbootstrap.com">Blog</a></li>
|
||||
<li class="muted">·</li>
|
||||
<li><a href="https://github.com/twitter/bootstrap/issues?state=open">Issues</a></li>
|
||||
<li class="muted">·</li>
|
||||
<li><a href="https://github.com/twitter/bootstrap/blob/master/CHANGELOG.md">Changelog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
<!-- Bootstrap core 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>
|
||||
<script src="/assets/js/bootstrap-affix.js"></script>
|
||||
|
||||
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
|
||||
<script src="/assets/js/holder/holder.js"></script>
|
||||
<script src="/assets/js/google-code-prettify/prettify.js"></script>
|
||||
|
||||
<script src="/assets/js/application.js"></script>
|
||||
|
||||
<!-- Analytics
|
||||
================================================== -->
|
||||
<script>
|
||||
var _gauges = _gauges || [];
|
||||
(function() {
|
||||
var t = document.createElement('script');
|
||||
t.type = 'text/javascript';
|
||||
t.async = true;
|
||||
t.id = 'gauges-tracker';
|
||||
t.setAttribute('data-site-id', '4f0dc9fef5a1f55508000013');
|
||||
t.src = '//secure.gaug.es/track.js';
|
||||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(t, s);
|
||||
})();
|
||||
</script>
|
||||
<!-- JS and analytics only. -->
|
||||
{% include footer.html %}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
17
docs/_layouts/example.html
Normal file
17
docs/_layouts/example.html
Normal file
@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Meta, title, CSS, favicons, etc. -->
|
||||
{% include header.html %}
|
||||
<!-- Place anything custom after this. -->
|
||||
</head>
|
||||
<body data-spy="scroll" data-target=".bs-docs-sidebar">
|
||||
|
||||
<!-- Page content of course! -->
|
||||
{{ content }}
|
||||
|
||||
<!-- JS and analytics only. -->
|
||||
{% include footer.html %}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -485,6 +485,21 @@ input.focused {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
margin-bottom: 14px;
|
||||
padding: 14px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.highlight pre {
|
||||
padding: 0;
|
||||
margin-bottom: 0;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
.highlight pre code {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Docs gallery
|
||||
|
||||
60
docs/assets/css/pygments_monokai.css
Normal file
60
docs/assets/css/pygments_monokai.css
Normal file
@ -0,0 +1,60 @@
|
||||
.highlight .hll { background-color: #49483e }
|
||||
.highlight { background: #272822; color: #f8f8f2 }
|
||||
.highlight .c { color: #75715e } /* Comment */
|
||||
.highlight .err { color: #960050; background-color: #1e0010 } /* Error */
|
||||
.highlight .k { color: #66d9ef } /* Keyword */
|
||||
.highlight .l { color: #ae81ff } /* Literal */
|
||||
.highlight .n { color: #f8f8f2 } /* Name */
|
||||
.highlight .o { color: #f92672 } /* Operator */
|
||||
.highlight .p { color: #f8f8f2 } /* Punctuation */
|
||||
.highlight .cm { color: #75715e } /* Comment.Multiline */
|
||||
.highlight .cp { color: #75715e } /* Comment.Preproc */
|
||||
.highlight .c1 { color: #75715e } /* Comment.Single */
|
||||
.highlight .cs { color: #75715e } /* Comment.Special */
|
||||
.highlight .ge { font-style: italic } /* Generic.Emph */
|
||||
.highlight .gs { font-weight: bold } /* Generic.Strong */
|
||||
.highlight .kc { color: #66d9ef } /* Keyword.Constant */
|
||||
.highlight .kd { color: #66d9ef } /* Keyword.Declaration */
|
||||
.highlight .kn { color: #f92672 } /* Keyword.Namespace */
|
||||
.highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
|
||||
.highlight .kr { color: #66d9ef } /* Keyword.Reserved */
|
||||
.highlight .kt { color: #66d9ef } /* Keyword.Type */
|
||||
.highlight .ld { color: #e6db74 } /* Literal.Date */
|
||||
.highlight .m { color: #ae81ff } /* Literal.Number */
|
||||
.highlight .s { color: #e6db74 } /* Literal.String */
|
||||
.highlight .na { color: #a6e22e } /* Name.Attribute */
|
||||
.highlight .nb { color: #f8f8f2 } /* Name.Builtin */
|
||||
.highlight .nc { color: #a6e22e } /* Name.Class */
|
||||
.highlight .no { color: #66d9ef } /* Name.Constant */
|
||||
.highlight .nd { color: #a6e22e } /* Name.Decorator */
|
||||
.highlight .ni { color: #f8f8f2 } /* Name.Entity */
|
||||
.highlight .ne { color: #a6e22e } /* Name.Exception */
|
||||
.highlight .nf { color: #a6e22e } /* Name.Function */
|
||||
.highlight .nl { color: #f8f8f2 } /* Name.Label */
|
||||
.highlight .nn { color: #f8f8f2 } /* Name.Namespace */
|
||||
.highlight .nx { color: #a6e22e } /* Name.Other */
|
||||
.highlight .py { color: #f8f8f2 } /* Name.Property */
|
||||
.highlight .nt { color: #f92672 } /* Name.Tag */
|
||||
.highlight .nv { color: #f8f8f2 } /* Name.Variable */
|
||||
.highlight .ow { color: #f92672 } /* Operator.Word */
|
||||
.highlight .w { color: #f8f8f2 } /* Text.Whitespace */
|
||||
.highlight .mf { color: #ae81ff } /* Literal.Number.Float */
|
||||
.highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
|
||||
.highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
|
||||
.highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
|
||||
.highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
|
||||
.highlight .sc { color: #e6db74 } /* Literal.String.Char */
|
||||
.highlight .sd { color: #e6db74 } /* Literal.String.Doc */
|
||||
.highlight .s2 { color: #e6db74 } /* Literal.String.Double */
|
||||
.highlight .se { color: #ae81ff } /* Literal.String.Escape */
|
||||
.highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
|
||||
.highlight .si { color: #e6db74 } /* Literal.String.Interpol */
|
||||
.highlight .sx { color: #e6db74 } /* Literal.String.Other */
|
||||
.highlight .sr { color: #e6db74 } /* Literal.String.Regex */
|
||||
.highlight .s1 { color: #e6db74 } /* Literal.String.Single */
|
||||
.highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
|
||||
.highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
|
||||
.highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
|
||||
.highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
|
||||
.highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
|
||||
.highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */
|
||||
@ -1,6 +1,7 @@
|
||||
---
|
||||
layout: default
|
||||
title: Getting started
|
||||
description: Overview of the project, its contents, and how to get started with a simple template.
|
||||
---
|
||||
|
||||
<!-- Subhead
|
||||
@ -13,7 +14,7 @@ title: Getting started
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div class="container">
|
||||
|
||||
<!-- Docs nav
|
||||
================================================== -->
|
||||
@ -64,7 +65,8 @@ title: Getting started
|
||||
</div>
|
||||
<p class="lead">Within the download you'll find the following file structure and contents, logically grouping common assets and providing both compiled and minified variations.</p>
|
||||
<p>Once downloaded, unzip the compressed folder to see the structure of (the compiled) Bootstrap. You'll see something like this:</p>
|
||||
<pre class="prettyprint">
|
||||
|
||||
{% highlight bash %}
|
||||
bootstrap/
|
||||
├── css/
|
||||
│ ├── bootstrap.css
|
||||
@ -78,7 +80,8 @@ title: Getting started
|
||||
├── glyphiconshalflings-regular.svg
|
||||
├── glyphiconshalflings-regular.ttf
|
||||
└── glyphiconshalflings-regular.woff
|
||||
</pre>
|
||||
{% endhighlight %}
|
||||
|
||||
<p>This is the most basic form of Bootstrap: compiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (<code>bootstrap.*</code>), as well as compiled and minified CSS and JS (<code>bootstrap.min.*</code>). The image files are compressed using <a href="http://imageoptim.com/">ImageOptim</a>, a Mac app for compressing PNGs.</p>
|
||||
<p>Please note that <strong>all JavaScript plugins require jQuery</strong> to be included.</p>
|
||||
</section>
|
||||
@ -114,36 +117,40 @@ title: Getting started
|
||||
</div>
|
||||
<p class="lead">With a brief intro into the contents out of the way, we can focus on putting Bootstrap to use. To do that, we'll utilize a basic HTML template that includes everything we mentioned in the <a href="./getting-started.html#file-structure">File structure</a>.</p>
|
||||
<p>Now, here's a look at a <strong>typical HTML file</strong>:</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Bootstrap 101 Template</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello, world!</h1>
|
||||
<script src="http://code.jquery.com/jquery.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
</pre>
|
||||
|
||||
{% highlight html linenos %}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Bootstrap 101 Template</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello, world!</h1>
|
||||
<script src="http://code.jquery.com/jquery.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
{% endhighlight %}
|
||||
|
||||
<p>To make this <strong>a Bootstrapped template</strong>, just include the appropriate CSS and JS files:</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Bootstrap 101 Template</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<!-- Bootstrap -->
|
||||
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello, world!</h1>
|
||||
<script src="http://code.jquery.com/jquery.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
</pre>
|
||||
|
||||
{% highlight html linenos %}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Bootstrap 101 Template</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<!-- Bootstrap -->
|
||||
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello, world!</h1>
|
||||
<script src="http://code.jquery.com/jquery.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
{% endhighlight %}
|
||||
|
||||
<p><strong>And you're set!</strong> With those two files added, you can begin to develop any site or application with Bootstrap.</p>
|
||||
|
||||
<hr>
|
||||
@ -246,4 +253,4 @@ title: Getting started
|
||||
</div><!-- /span9 -->
|
||||
</div><!-- row -->
|
||||
|
||||
</div><!-- /.container -->
|
||||
</div><!-- /.container -->
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user