Commit edb733eb authored by Mark Otto's avatar Mark Otto

Super massive docs overhaul

* Bring back the navbar up top
* Pull the docs content back into separate pages because a 6.6k line docs file is just crazy
* Recenter the page content and bring back affixed side nav (needs work)
parent 88dd9de9
<div class="bs-docs-sidebar">
<ul class="nav bs-docs-sidenav">
<h3 class="bs-docs-sidenav-heading"><a href="/">Bootstrap</a></h3>
<li><a href="#welcome">Welcome!</a></li>
<li><a href="#getting-started">Getting started</a></li>
<li><a href="#whats-included">What's included</a></li>
<li><a href="#examples">Templates and examples</a></li>
<li><a href="#customizing">Customizing Bootstrap</a></li>
<!-- CSS -->
<li><a class="nav-header" href="#css">CSS</a></li>
<li><a href="#css-overview">Overview</a></li>
<li>
<a href="#grid">Grid system</a>
<ul class="nav">
<li><a href="#grid-example">Example usage</a></li>
<li><a href="#grid-offsetting">Offset columns</a></li>
<li><a href="#grid-nesting">Nested columns</a></li>
<li><a href="#grid-column-ordering">Column ordering</a></li>
<li><a href="#grid-small">Small device grid</a></li>
<li><a href="#grid-less">LESS mixins and variables</a></li>
</ul>
</li>
<li>
<a href="#type">Typography</a>
<ul class="nav">
<li><a href="#type-headings">Headings</a></li>
<li><a href="#type-body-copy">Body copy</a></li>
<li><a href="#type-emphasis">Emphasis</a></li>
<li><a href="#type-abbreviations">Abbreviations</a></li>
<li><a href="#type-addresses">Addresses</a></li>
<li><a href="#type-blockquotes">Blockquotes</a></li>
<li><a href="#type-lists">Lists</a></li>
</ul>
</li>
<li><a href="#code">Code</a></li>
<li>
<a href="#tables">Tables</a>
<ul class="nav">
<li><a href="#tables-example">Basic example</a></li>
<li><a href="#tables-striped">Zebra striping</a></li>
<li><a href="#tables-bordered">Bordered tables</a></li>
<li><a href="#tables-hover-rows">Hover rows</a></li>
<li><a href="#tables-condensed">Condensed tables</a></li>
<li><a href="#tables-row-classes">Contextual row classes</a></li>
</ul>
</li>
<li>
<a href="#forms">Forms</a>
<ul class="nav">
<li><a href="#forms-example">Basic example</a></li>
<li><a href="#forms-inline">Inline variation</a></li>
<li><a href="#forms-horizontal">Horizontal variation</a></li>
<li><a href="#forms-controls">Supported controls</a></li>
<li><a href="#forms-control-states">Control states</a></li>
<li><a href="#forms-input-groups">Input groups</a></li>
<li><a href="#forms-control-sizes">Control sizing</a></li>
<li><a href="#forms-actions">Form actions</a></li>
<li><a href="#forms-help-text">Help text</a></li>
</ul>
</li>
<li>
<a href="#buttons">Buttons</a>
<ul class="nav">
<li><a href="#buttons-options">Button options</a></li>
<li><a href="#buttons-sizes">Sizes</a></li>
<li><a href="#buttons-disabled">Disabled</a></li>
<li><a href="#buttons-tags">Button tags</a></li>
</ul>
</li>
<li><a href="#images">Images</a></li>
<li><a href="#helper-classes">Helper classes</a></li>
<li><a href="#responsive-utilities">Responsive utilities</a></li>
<!-- Components -->
<li><a class="nav-header" href="#components">Components</a></li>
<li><a href="#icons">Glyphicons</a></li>
<li>
<a href="#dropdowns">Dropdowns</a>
<ul class="nav">
<li><a href="#dropdowns-example">Example</a></li>
<li><a href="#dropdowns-alignment">Alignment options</a></li>
<li><a href="#dropdowns-disabled">Disabled menu items</a></li>
<li><a href="#dropdowns-submenus">Submenus</a></li>
</ul>
</li>
<li>
<a href="#btn-groups">Button groups</a>
<ul class="nav">
<li><a href="#btn-groups-single">Basic button group</a></li>
<li><a href="#btn-groups-toolbar">Button toolbar</a></li>
<li><a href="#btn-groups-vertical">Vertical variation</a></li>
<li><a href="#btn-groups-justified">Justified link buttons</a></li>
</ul>
</li>
<li>
<a href="#btn-dropdowns">Button dropdowns</a>
<ul class="nav">
<li><a href="#btn-dropdowns-single">Single button dropdown</a></li>
<li><a href="#btn-dropdowns-split">Split button dropdown</a></li>
<li><a href="#btn-dropdowns-sizes">Button sizes</a></li>
<li><a href="#btn-dropdowns-dropup">Dropup variation</a></li>
</ul>
</li>
<li>
<a href="#nav">Navs</a>
<ul class="nav">
<li><a href="#nav-tabs">Tabs nav</a></li>
<li><a href="#nav-pills">Pills nav</a></li>
<li><a href="#nav-justified">Justified nav</a></li>
<li><a href="#nav-disabled-links">Disabled links</a></li>
<li><a href="#nav-alignment">Alignment options</a></li>
<li><a href="#nav-dropdowns">Using dropdowns</a></li>
</ul>
</li>
<li>
<a href="#navbar">Navbar</a>
<ul class="nav">
<li><a href="#navbar-basic">Basic navbar</a></li>
<li><a href="#navbar-nav">Nav links</a></li>
<li><a href="#navbar-forms">Forms in navbars</a></li>
<li><a href="#navbar-buttons">Buttons in navbars</a></li>
<li><a href="#navbar-text">Text in navbars</a></li>
<li><a href="#navbar-links">Links in navbars</a></li>
<li><a href="#navbar-component-alignment">Component alignment</a></li>
<li><a href="#navbar-fixed-top">Fixed top navbar</a></li>
<li><a href="#navbar-fixed-bottom">Fixed bottom navbar</a></li>
<li><a href="#navbar-static-top">Static top navbar</a></li>
<li><a href="#navbar-responsive">Responsive navbar</a></li>
</ul>
</li>
<li><a href="#breadcrumbs">Breadcrumbs</a></li>
<li>
<a href="#pagination">Pagination</a>
<ul class="nav">
<li><a href="#pagination-default">Default pagination</a></li>
<li><a href="#pagination-pager">Pager</a></li>
</ul>
</li>
<li><a href="#labels">Labels</a></li>
<li><a href="#badges">Badges</a></li>
<li>
<a href="#type-components">Typography</a>
<ul class="nav">
<li><a href="#type-components-jumbotron">Jumbotron</a></li>
<li><a href="#type-components-page-header">Page header</a></li>
</ul>
</li>
<li><a href="#thumbnails">Thumbnails</a></li>
<li>
<a href="#alerts">Alerts</a>
<ul class="nav">
<li><a href="#alerts-default">Default alert</a></li>
<li><a href="#alerts-block">Block alerts</a></li>
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
</ul>
</li>
<li>
<a href="#progress">Progress bars</a>
<ul class="nav">
<li><a href="#progress-basic">Basic progress bar</a></li>
<li><a href="#progress-alternatives">Contextual alternatives</a></li>
<li><a href="#progress-striped">Striped</a></li>
<li><a href="#progress-animated">Animated</a></li>
<li><a href="#progress-stacked">Stacked</a></li>
</ul>
</li>
<li><a href="#media">Media object</a></li>
<li>
<a href="#list-group">List group</a>
<ul class="nav">
<li><a href="#list-group-basic">Basic list group</a></li>
<li><a href="#list-group-chevrons">Chevrons</a></li>
<li><a href="#list-group-badges">Badges</a></li>
<li><a href="#list-group-badges-chevrons">Badges and chevrons</a></li>
<li><a href="#list-group-linked">Linked items</a></li>
<li><a href="#list-group-custom-content">Custom content</a></li>
<!-- <li><a href="#list-group-pic">Leading picture</a></li> -->
</ul>
</li>
<li>
<a href="#panels">Panels</a>
<ul class="nav">
<li><a href="#panels-basic">Basic panel</a></li>
<li><a href="#panels-heading">Panel with heading</a></li>
<li><a href="#panels-alternatives">Contextual alternatives</a></li>
<li><a href="#panels-list-group">With list groups</a>
</ul>
</li>
<li><a href="#wells">Wells</a></li>
<!-- JavaScript -->
<li><a class="nav-header" href="#js">JavaScript</a></li>
<li>
<a href="#js-overview">Overview</a>
<ul class="nav">
<li><a href="#js-individual-compiled">Individual or compiled</a></li>
<li><a href="#js-data-attributes">Data attributes</a></li>
<li><a href="#js-programmatic-api">Programmatic API</a></li>
<li><a href="#js-noconflict">No Conflict</a></li>
<li><a href="#js-events">Evens</a></li>
</ul>
</li>
<li><a href="#transitions">Transitions</a></li>
<li>
<a href="#modals">Modal</a>
<ul class="nav">
<li><a href="#modals-examples">Examples</a></li>
<li><a href="#modals-usage">Usage</a></li>
</ul>
</li>
<li><a href="#dropdowns">Dropdown</a></li>
<li><a href="#scrollspy">Scrollspy</a></li>
<li><a href="#tabs">Tab</a></li>
<li><a href="#tooltips">Tooltip</a></li>
<li><a href="#popovers">Popover</a></li>
<li><a href="#js-alerts">Alert</a></li>
<li><a href="#js-buttons">Button</a></li>
<li><a href="#collapse">Collapse</a></li>
<li><a href="#carousel">Carousel</a></li>
<li><a href="#affix">Affix</a></li>
</ul>
</div>
<li><a href="#icons">Glyphicons</a></li>
<li>
<a href="#dropdowns">Dropdowns</a>
<ul class="nav">
<li><a href="#dropdowns-example">Example</a></li>
<li><a href="#dropdowns-alignment">Alignment options</a></li>
<li><a href="#dropdowns-disabled">Disabled menu items</a></li>
<li><a href="#dropdowns-submenus">Submenus</a></li>
</ul>
</li>
<li>
<a href="#btn-groups">Button groups</a>
<ul class="nav">
<li><a href="#btn-groups-single">Basic button group</a></li>
<li><a href="#btn-groups-toolbar">Button toolbar</a></li>
<li><a href="#btn-groups-vertical">Vertical variation</a></li>
<li><a href="#btn-groups-justified">Justified link buttons</a></li>
</ul>
</li>
<li>
<a href="#btn-dropdowns">Button dropdowns</a>
<ul class="nav">
<li><a href="#btn-dropdowns-single">Single button dropdown</a></li>
<li><a href="#btn-dropdowns-split">Split button dropdown</a></li>
<li><a href="#btn-dropdowns-sizes">Button sizes</a></li>
<li><a href="#btn-dropdowns-dropup">Dropup variation</a></li>
</ul>
</li>
<li>
<a href="#nav">Navs</a>
<ul class="nav">
<li><a href="#nav-tabs">Tabs nav</a></li>
<li><a href="#nav-pills">Pills nav</a></li>
<li><a href="#nav-justified">Justified nav</a></li>
<li><a href="#nav-disabled-links">Disabled links</a></li>
<li><a href="#nav-alignment">Alignment options</a></li>
<li><a href="#nav-dropdowns">Using dropdowns</a></li>
</ul>
</li>
<li>
<a href="#navbar">Navbar</a>
<ul class="nav">
<li><a href="#navbar-basic">Basic navbar</a></li>
<li><a href="#navbar-nav">Nav links</a></li>
<li><a href="#navbar-forms">Forms in navbars</a></li>
<li><a href="#navbar-buttons">Buttons in navbars</a></li>
<li><a href="#navbar-text">Text in navbars</a></li>
<li><a href="#navbar-links">Links in navbars</a></li>
<li><a href="#navbar-component-alignment">Component alignment</a></li>
<li><a href="#navbar-fixed-top">Fixed top navbar</a></li>
<li><a href="#navbar-fixed-bottom">Fixed bottom navbar</a></li>
<li><a href="#navbar-static-top">Static top navbar</a></li>
<li><a href="#navbar-responsive">Responsive navbar</a></li>
</ul>
</li>
<li><a href="#breadcrumbs">Breadcrumbs</a></li>
<li>
<a href="#pagination">Pagination</a>
<ul class="nav">
<li><a href="#pagination-default">Default pagination</a></li>
<li><a href="#pagination-pager">Pager</a></li>
</ul>
</li>
<li><a href="#labels">Labels</a></li>
<li><a href="#badges">Badges</a></li>
<li>
<a href="#type-components">Typography</a>
<ul class="nav">
<li><a href="#type-components-jumbotron">Jumbotron</a></li>
<li><a href="#type-components-page-header">Page header</a></li>
</ul>
</li>
<li><a href="#thumbnails">Thumbnails</a></li>
<li>
<a href="#alerts">Alerts</a>
<ul class="nav">
<li><a href="#alerts-default">Default alert</a></li>
<li><a href="#alerts-block">Block alerts</a></li>
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
</ul>
</li>
<li>
<a href="#progress">Progress bars</a>
<ul class="nav">
<li><a href="#progress-basic">Basic progress bar</a></li>
<li><a href="#progress-alternatives">Contextual alternatives</a></li>
<li><a href="#progress-striped">Striped</a></li>
<li><a href="#progress-animated">Animated</a></li>
<li><a href="#progress-stacked">Stacked</a></li>
</ul>
</li>
<li><a href="#media">Media object</a></li>
<li>
<a href="#list-group">List group</a>
<ul class="nav">
<li><a href="#list-group-basic">Basic list group</a></li>
<li><a href="#list-group-chevrons">Chevrons</a></li>
<li><a href="#list-group-badges">Badges</a></li>
<li><a href="#list-group-badges-chevrons">Badges and chevrons</a></li>
<li><a href="#list-group-linked">Linked items</a></li>
<li><a href="#list-group-custom-content">Custom content</a></li>
<!-- <li><a href="#list-group-pic">Leading picture</a></li> -->
</ul>
</li>
<li>
<a href="#panels">Panels</a>
<ul class="nav">
<li><a href="#panels-basic">Basic panel</a></li>
<li><a href="#panels-heading">Panel with heading</a></li>
<li><a href="#panels-alternatives">Contextual alternatives</a></li>
<li><a href="#panels-list-group">With list groups</a>
</ul>
</li>
<li><a href="#wells">Wells</a></li>
<li><a href="#css-overview">Overview</a></li>
<li>
<a href="#grid">Grid system</a>
<ul class="nav">
<li><a href="#grid-example">Example usage</a></li>
<li><a href="#grid-offsetting">Offset columns</a></li>
<li><a href="#grid-nesting">Nested columns</a></li>
<li><a href="#grid-column-ordering">Column ordering</a></li>
<li><a href="#grid-small">Small device grid</a></li>
<li><a href="#grid-less">LESS mixins and variables</a></li>
</ul>
</li>
<li>
<a href="#type">Typography</a>
<ul class="nav">
<li><a href="#type-headings">Headings</a></li>
<li><a href="#type-body-copy">Body copy</a></li>
<li><a href="#type-emphasis">Emphasis</a></li>
<li><a href="#type-abbreviations">Abbreviations</a></li>
<li><a href="#type-addresses">Addresses</a></li>
<li><a href="#type-blockquotes">Blockquotes</a></li>
<li><a href="#type-lists">Lists</a></li>
</ul>
</li>
<li><a href="#code">Code</a></li>
<li>
<a href="#tables">Tables</a>
<ul class="nav">
<li><a href="#tables-example">Basic example</a></li>
<li><a href="#tables-striped">Zebra striping</a></li>
<li><a href="#tables-bordered">Bordered tables</a></li>
<li><a href="#tables-hover-rows">Hover rows</a></li>
<li><a href="#tables-condensed">Condensed tables</a></li>
<li><a href="#tables-row-classes">Contextual row classes</a></li>
</ul>
</li>
<li>
<a href="#forms">Forms</a>
<ul class="nav">
<li><a href="#forms-example">Basic example</a></li>
<li><a href="#forms-inline">Inline variation</a></li>
<li><a href="#forms-horizontal">Horizontal variation</a></li>
<li><a href="#forms-controls">Supported controls</a></li>
<li><a href="#forms-control-states">Control states</a></li>
<li><a href="#forms-input-groups">Input groups</a></li>
<li><a href="#forms-control-sizes">Control sizing</a></li>
<li><a href="#forms-actions">Form actions</a></li>
<li><a href="#forms-help-text">Help text</a></li>
</ul>
</li>
<li>
<a href="#buttons">Buttons</a>
<ul class="nav">
<li><a href="#buttons-options">Button options</a></li>
<li><a href="#buttons-sizes">Sizes</a></li>
<li><a href="#buttons-disabled">Disabled</a></li>
<li><a href="#buttons-tags">Button tags</a></li>
</ul>
</li>
<li><a href="#images">Images</a></li>
<li><a href="#helper-classes">Helper classes</a></li>
<li><a href="#responsive-utilities">Responsive utilities</a></li>
<li>
<a href="#js-overview">Overview</a>
<ul class="nav">
<li><a href="#js-individual-compiled">Individual or compiled</a></li>
<li><a href="#js-data-attributes">Data attributes</a></li>
<li><a href="#js-programmatic-api">Programmatic API</a></li>
<li><a href="#js-noconflict">No Conflict</a></li>
<li><a href="#js-events">Evens</a></li>
</ul>
</li>
<li><a href="#transitions">Transitions</a></li>
<li>
<a href="#modals">Modal</a>
<ul class="nav">
<li><a href="#modals-examples">Examples</a></li>
<li><a href="#modals-usage">Usage</a></li>
</ul>
</li>
<li><a href="#dropdowns">Dropdown</a></li>
<li><a href="#scrollspy">Scrollspy</a></li>
<li><a href="#tabs">Tab</a></li>
<li><a href="#tooltips">Tooltip</a></li>
<li><a href="#popovers">Popover</a></li>
<li><a href="#js-alerts">Alert</a></li>
<li><a href="#js-buttons">Button</a></li>
<li><a href="#collapse">Collapse</a></li>
<li><a href="#carousel">Carousel</a></li>
<li><a href="#affix">Affix</a></li>
<div class="navbar navbar-fixed-top bs-docs-nav">
<div class="container">
<a href="/" class="navbar-brand">Bootstrap</a>
<div class="nav-collapse collapse">
<ul class="nav navbar-nav">
<li{% if page.slug == "welcome" %} class="active"{% endif %}>
<a href="/welcome">Overview</a>
</li>
<li{% if page.slug == "css" %} class="active"{% endif %}>
<a href="/css">CSS</a>
</li>
<li{% if page.slug == "components" %} class="active"{% endif %}>
<a href="/components">Components</a>
</li>
<li{% if page.slug == "js" %} class="active"{% endif %}>
<a href="/javascript">JavaScript</a>
</li>
<li{% if page.slug == "customize" %} class="active"{% endif %}>
<a href="/customize">Customize</a>
</li>
</ul>
</div>
</div>
</div>
<li><a href="#getting-started">Getting started</a></li>
<li><a href="#whats-included">What's included</a></li>
<li><a href="#examples">Templates and examples</a></li>
<li><a href="#customizing">Customizing Bootstrap</a></li>
\ No newline at end of file
<!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">
<!-- Docs master nav -->
{% include nav-main.html %}
<!-- Docs page layout -->
<div class="container bs-docs-container">
{{ content }}
<!-- Quick back to top -->
<a href="#welcome" class="bs-docs-top">
Back to top
</a>
<!-- Main docs footer (social buttons, copyright, etc). -->
{% include colophon.html %}
</div>
<!-- JS and analytics only. -->
{% include footer.html %}
</body>
</html>
...@@ -5,16 +5,47 @@ ...@@ -5,16 +5,47 @@
{% include header.html %} {% include header.html %}
<!-- Place anything custom after this. --> <!-- Place anything custom after this. -->
</head> </head>
<body class="bs-docs-docs" data-spy="scroll" data-target=".bs-docs-sidebar"> <body data-spy="scroll" data-target=".bs-docs-sidebar">
<!-- Docs nav --> <!-- Docs master nav -->
{% include docs-nav.html %} {% include nav-main.html %}
<!-- Page content of course! --> <!-- Docs page layout -->
{{ content }} <div class="container bs-docs-container">
<div class="bs-docs-header">
<h1>{{ page.title }}</h1>
<p class="lead">{{ page.lead }}</p>
</div>
<!-- Main docs footer (social buttons, copyright, etc). --> <div class="row">
{% include colophon.html %} <div class="col col-lg-3">
<div class="bs-docs-sidebar">
<ul class="nav">
{% if page.slug == "welcome" %}
{% include nav-welcome.html %}
{% elsif page.slug == "css" %}
{% include nav-css.html %}
{% elsif page.slug == "components" %}
{% include nav-components.html %}
{% elsif page.slug == "js" %}
{% include nav-javascript.html %}
{% endif %}
</ul>
</div>
</div>
<div class="col col-lg-9">
{{ content }}
</div>
</div>
<!-- Quick back to top -->
<a href="#welcome" class="bs-docs-top">
Back to top
</a>
<!-- Main docs footer (social buttons, copyright, etc). -->
{% include colophon.html %}
</div>
<!-- JS and analytics only. --> <!-- JS and analytics only. -->
{% include footer.html %} {% include footer.html %}
......
...@@ -7,6 +7,9 @@ ...@@ -7,6 +7,9 @@
</head> </head>
<body class="bs-docs-home"> <body class="bs-docs-home">
<!-- Docs master nav -->
{% include nav-main.html %}
<!-- Page content of course! --> <!-- Page content of course! -->
{{ content }} {{ content }}
......
...@@ -3304,7 +3304,7 @@ button.close { ...@@ -3304,7 +3304,7 @@ button.close {
float: right; float: right;
} }
.nav .divider { .nav .nav-divider {
height: 2px; height: 2px;
margin: 9px 0; margin: 9px 0;
overflow: hidden; overflow: hidden;
......
...@@ -13,6 +13,17 @@ body { ...@@ -13,6 +13,17 @@ body {
/* We add the padding to the body for >768px only */ /* We add the padding to the body for >768px only */
} }
/* Top nav and header */
.bs-docs-nav {
background-color: #fff;
border-bottom: 1px solid #ddd;
}
.bs-docs-nav .navbar-brand {
color: #b94a48;
}
hr { hr {
margin-top: 30px; margin-top: 30px;
margin-bottom: 30px; margin-bottom: 30px;
...@@ -22,20 +33,13 @@ hr { ...@@ -22,20 +33,13 @@ hr {
margin-top: 15px; margin-top: 15px;
margin-bottom: 5px; margin-bottom: 5px;
} }
/*
.bs-docs-container, .bs-docs-container,
.bs-home-container { .bs-home-container {
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
} }
.bs-docs-container { */
max-width: 860px;
}
.bs-docs-container .row {
margin-left: -15px;
margin-right: -15px;
}
/* Side notes for calling out things */ /* Side notes for calling out things */
.bs-docs-sidenote { .bs-docs-sidenote {
margin: 20px 0; margin: 20px 0;
...@@ -59,27 +63,28 @@ hr { ...@@ -59,27 +63,28 @@ hr {
-------------------------------------------------- */ -------------------------------------------------- */
/* Padding for in-page bookmarks */ /* Padding for in-page bookmarks */
section, /*section,*/
.bs-docs-section { .bs-docs-section {
padding-top: 30px; padding-top: 30px;
} }
/* Few stylistic typography tweaks */ /* Few stylistic typography tweaks */
section > .page-header, /*section > .page-header,
section > .lead { section > .lead {
color: #5a5a5a; color: #5a5a5a;
} }
section > ul li { section > ul li {
margin-bottom: 5px; margin-bottom: 5px;
} }*/
/* Jumbotrons /* Jumbotrons
-------------------------------------------------- */ -------------------------------------------------- */
.bs-docs-section-header { .bs-docs-header {
padding-top: 60px; margin-bottom: 20px;
padding-top: 30px;
color: #b94a48; color: #b94a48;
border-bottom: 5px solid #b94a48; border-bottom: 5px solid #b94a48;
} }
...@@ -149,22 +154,15 @@ section > ul li { ...@@ -149,22 +154,15 @@ section > ul li {
/* Sidenav /* Sidenav
-------------------------------------------------- */ -------------------------------------------------- */
.bs-docs-sidebar {
display: none;
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 240px;
overflow-y: scroll;
text-shadow: 0 1px 0 #fff;
background-color: #f5f5f5;
box-shadow: inset -1px 0 0 #e5e5e5;
}
/* Nav: first level */ /* Nav: first level */
.bs-docs-sidebar > .nav { .bs-docs-sidebar > .nav {
margin: 0 0 25px 0; margin-top: 20px;
margin-bottom: 20px;
padding-top: 15px;
padding-bottom: 15px;
text-shadow: 0 1px 0 #fff;
background-color: #f5f5f5;
border-radius: 5px;
} }
.bs-docs-sidebar .nav > li > a { .bs-docs-sidebar .nav > li > a {
display: block; display: block;
...@@ -229,6 +227,17 @@ section > ul li { ...@@ -229,6 +227,17 @@ section > ul li {
border-color: #333; border-color: #333;
} }
/* Increase spacing between page nav and other pages */
.bs-docs-sidenav .nav-divider {
margin-top: 25px;
margin-bottom: 25px;
}
.bs-docs-sidebar.affix {
top: 50px;
width: 270px;
}
/* Bootstrap code examples /* Bootstrap code examples
...@@ -666,6 +675,9 @@ input.focused { ...@@ -666,6 +675,9 @@ input.focused {
/* Tablets and up */ /* Tablets and up */
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
body {
padding-top: 50px;
}
/* Back to top link */ /* Back to top link */
.bs-docs-top { .bs-docs-top {
...@@ -687,17 +699,11 @@ input.focused { ...@@ -687,17 +699,11 @@ input.focused {
bottom: 15px; bottom: 15px;
} }
.bs-docs-section-header h1 { .bs-docs-header h1 {
font-size: 80px; font-size: 80px;
font-size: 8rem;
line-height: 1; line-height: 1;
} }
/* Account for fixed navbar (which is static to start) */
.bs-docs-docs {
padding-left: 260px;
}
/* Undo custom padding */ /* Undo custom padding */
.bs-docs-container { .bs-docs-container {
padding-left: 0; padding-left: 0;
...@@ -738,10 +744,6 @@ input.focused { ...@@ -738,10 +744,6 @@ input.focused {
/* Tablets/desktops and up */ /* Tablets/desktops and up */
@media screen and (min-width: 992px) { @media screen and (min-width: 992px) {
.bs-docs-docs {
padding-left: 280px;
}
/* Icons */ /* Icons */
.the-icons li { .the-icons li {
width: 12.5%; width: 12.5%;
...@@ -751,8 +753,5 @@ input.focused { ...@@ -751,8 +753,5 @@ input.focused {
/* Large desktops and up */ /* Large desktops and up */
@media screen and (min-width: 1200px) { @media screen and (min-width: 1200px) {
.bs-docs-docs {
padding-left: 300px;
}
} }
...@@ -14,14 +14,14 @@ ...@@ -14,14 +14,14 @@
}) })
// back to top // back to top
// setTimeout(function () { setTimeout(function () {
// $('.bs-docs-sidenav').affix({ $('.bs-docs-sidebar').affix({
// offset: { offset: {
// top: function () { return $window.width() <= 980 ? 290 : 210 } top: function () { return $window.width() <= 980 ? 290 : 210 }
// , bottom: 270 , bottom: 270
// } }
// }) })
// }, 100) }, 100)
setTimeout(function () { setTimeout(function () {
$('.bs-docs-top').affix() $('.bs-docs-top').affix()
......
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
...@@ -10,7 +10,6 @@ title: Bootstrap ...@@ -10,7 +10,6 @@ title: Bootstrap
<p class="lead">Sleek, intuitive, and powerful mobile-first front-end framework for faster and easier web development.</p> <p class="lead">Sleek, intuitive, and powerful mobile-first front-end framework for faster and easier web development.</p>
<p> <p>
<a href="assets/bootstrap.zip" class="btn btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0']);">Download Bootstrap</a> <a href="assets/bootstrap.zip" class="btn btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0']);">Download Bootstrap</a>
<a href="./docs/" class="btn btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Docs', 'View docs']);">View docs</a>
</p> </p>
<div class="bs-docs-social"> <div class="bs-docs-social">
......
This diff is collapsed.
This diff is collapsed.
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
} }
// Dividers (basically an hr) within the dropdown // Dividers (basically an hr) within the dropdown
.divider { .nav-divider {
.nav-divider(); .nav-divider();
} }
} }
......
Markdown is supported
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