Commit c064eef6 authored by Mark Otto's avatar Mark Otto

Massive cleanup

- Simpler main nav on all pages
- Back to purple masthead on homepage instead of dark graphite
- Active link styles on the main nav
- Cleaned up sidebar nav
- New docs layout name
- Homepage copy edits
- Updated bright purple docs color
parent b388778f
......@@ -362,6 +362,10 @@ module.exports = function (grunt) {
sass: {
files: 'scss/**/*.scss',
tasks: ['dist-css', 'docs']
},
docs: {
files: 'docs/assets/scss/**/*.scss',
tasks: ['dist-css', 'docs']
}
},
......
......@@ -580,8 +580,8 @@ mark,
}
.dl-horizontal {
margin-right: -1.5rem;
margin-left: -1.5rem;
margin-right: -1.875rem;
margin-left: -1.875rem;
}
.dl-horizontal:before,
......@@ -734,8 +734,8 @@ pre code {
}
.container {
padding-right: .75rem;
padding-left: .75rem;
padding-right: .9375rem;
padding-left: .9375rem;
margin-right: auto;
margin-left: auto;
}
......@@ -775,8 +775,8 @@ pre code {
}
.container-fluid {
padding-right: .75rem;
padding-left: .75rem;
padding-right: .9375rem;
padding-left: .9375rem;
margin-right: auto;
margin-left: auto;
}
......@@ -792,8 +792,8 @@ pre code {
}
.row {
margin-right: -.75rem;
margin-left: -.75rem;
margin-right: -.9375rem;
margin-left: -.9375rem;
}
.row:before,
......@@ -809,8 +809,8 @@ pre code {
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
position: relative;
min-height: 1px;
padding-right: .75rem;
padding-left: .75rem;
padding-right: .9375rem;
padding-left: .9375rem;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
......@@ -3596,31 +3596,13 @@ input[type="button"].btn-block {
list-style: none;
}
.nav:before,
.nav:after {
display: table;
content: " ";
}
.nav:after {
clear: both;
}
.nav-item {
position: relative;
display: inline-block;
}
.nav-link {
display: inline-block;
padding: .75em 1em;
line-height: 1;
}
.nav-link:focus,
.nav-link:hover {
text-decoration: none;
background-color: #eceeef;
}
.disabled > .nav-link,
......@@ -3639,6 +3621,10 @@ input[type="button"].btn-block {
background-color: transparent;
}
.nav-inline .nav-link + .nav-link {
margin-left: 1rem;
}
.nav-tabs {
border-bottom: 1px solid #ddd;
}
......@@ -3654,6 +3640,7 @@ input[type="button"].btn-block {
.nav-tabs .nav-link {
display: block;
padding: .75em 1em;
border: 1px solid transparent;
border-radius: .25rem .25rem 0 0;
}
......@@ -3701,6 +3688,7 @@ input[type="button"].btn-block {
.nav-pills .nav-link {
display: block;
padding: .75em 1em;
border-radius: .25rem;
}
......@@ -5974,39 +5962,39 @@ a.text-primary:hover {
}
.text-success {
color: #3c763d;
color: #5cb85c;
}
a.text-success:focus,
a.text-success:hover {
color: #2b542c;
color: #449d44;
}
.text-info {
color: #31708f;
color: #5bc0de;
}
a.text-info:focus,
a.text-info:hover {
color: #245269;
color: #31b0d5;
}
.text-warning {
color: #8a6d3b;
color: #f0ad4e;
}
a.text-warning:focus,
a.text-warning:hover {
color: #66512c;
color: #ec971f;
}
.text-danger {
color: #a94442;
color: #d9534f;
}
a.text-danger:focus,
a.text-danger:hover {
color: #843534;
color: #c9302c;
}
.inverse {
......@@ -6016,9 +6004,6 @@ a.text-danger:hover {
.bg-primary {
color: #fff;
}
.bg-primary {
background-color: #0275d8;
}
......@@ -6028,243 +6013,288 @@ a.bg-primary:hover {
}
.bg-success {
background-color: #dff0d8;
color: #fff;
background-color: #5cb85c;
}
a.bg-success:focus,
a.bg-success:hover {
background-color: #c1e2b3;
background-color: #449d44;
}
.bg-info {
background-color: #d9edf7;
color: #fff;
background-color: #5bc0de;
}
a.bg-info:focus,
a.bg-info:hover {
background-color: #afd9ee;
background-color: #31b0d5;
}
.bg-warning {
background-color: #fcf8e3;
color: #fff;
background-color: #f0ad4e;
}
a.bg-warning:focus,
a.bg-warning:hover {
background-color: #f7ecb5;
background-color: #ec971f;
}
.bg-danger {
background-color: #f2dede;
color: #fff;
background-color: #d9534f;
}
a.bg-danger:focus,
a.bg-danger:hover {
background-color: #e4b9b9;
background-color: #c9302c;
}
.m-a-0 {
margin: 0;
margin: 0 !important;
}
.m-t-0 {
margin-top: 0;
margin-top: 0 !important;
}
.m-r-0 {
margin-right: 0;
margin-right: 0 !important;
}
.m-b-0 {
margin-bottom: 0;
margin-bottom: 0 !important;
}
.m-l-0 {
margin-left: 0;
margin-left: 0 !important;
}
.m-x-0 {
margin-right: 0 !important;
margin-left: 0 !important;
}
.m-y-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.m-a {
margin: 1rem;
margin: 1rem !important;
}
.m-t {
margin-top: 1rem;
margin-top: 1rem !important;
}
.m-r {
margin-right: 1rem;
margin-right: 1rem !important;
}
.m-b {
margin-bottom: 1rem;
margin-bottom: 1rem !important;
}
.m-l {
margin-left: 1rem;
margin-left: 1rem !important;
}
.m-x {
margin-right: 1rem;
margin-left: 1rem;
margin-right: 1rem !important;
margin-left: 1rem !important;
}
.m-y {
margin-top: 1rem;
margin-bottom: 1rem;
margin-top: 1rem !important;
margin-bottom: 1rem !important;
}
.m-x-auto {
margin-right: auto !important;
margin-left: auto !important;
}
.m-a-md {
margin: 1.5rem !important;
}
.m-t-md {
margin-top: 1.5rem;
margin-top: 1.5rem !important;
}
.m-r-md {
margin-right: 1.5rem;
margin-right: 1.5rem !important;
}
.m-b-md {
margin-bottom: 1.5rem;
margin-bottom: 1.5rem !important;
}
.m-l-md {
margin-left: 1.5rem;
margin-left: 1.5rem !important;
}
.m-x-md {
margin-right: 1.5rem;
margin-left: 1.5rem;
margin-right: 1.5rem !important;
margin-left: 1.5rem !important;
}
.m-y-md {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
margin-top: 1.5rem !important;
margin-bottom: 1.5rem !important;
}
.m-a-lg {
margin: 3rem !important;
}
.m-t-lg {
margin-top: 3rem;
margin-top: 3rem !important;
}
.m-r-lg {
margin-right: 3rem;
margin-right: 3rem !important;
}
.m-b-lg {
margin-bottom: 3rem;
margin-bottom: 3rem !important;
}
.m-l-lg {
margin-left: 3rem;
margin-left: 3rem !important;
}
.m-x-lg {
margin-right: 3rem;
margin-left: 3rem;
margin-right: 3rem !important;
margin-left: 3rem !important;
}
.m-y-lg {
margin-top: 3rem;
margin-bottom: 3rem;
margin-top: 3rem !important;
margin-bottom: 3rem !important;
}
.p-a-0 {
padding: 0;
padding: 0 !important;
}
.p-t-0 {
padding-top: 0;
padding-top: 0 !important;
}
.p-r-0 {
padding-right: 0;
padding-right: 0 !important;
}
.p-b-0 {
padding-bottom: 0;
padding-bottom: 0 !important;
}
.p-l-0 {
padding-left: 0;
padding-left: 0 !important;
}
.p-x-0 {
padding-right: 0 !important;
padding-left: 0 !important;
}
.p-y-0 {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.p-a {
padding: 1rem;
padding: 1rem !important;
}
.p-t {
padding-top: 1rem;
padding-top: 1rem !important;
}
.p-r {
padding-right: 1rem;
padding-right: 1rem !important;
}
.p-b {
padding-bottom: 1rem;
padding-bottom: 1rem !important;
}
.p-l {
padding-left: 1rem;
padding-left: 1rem !important;
}
.p-x {
padding-right: 1rem;
padding-left: 1rem;
padding-right: 1rem !important;
padding-left: 1rem !important;
}
.p-y {
padding-top: 1rem;
padding-bottom: 1rem;
padding-top: 1rem !important;
padding-bottom: 1rem !important;
}
.p-a-md {
padding: 1.5rem !important;
}
.p-t-md {
padding-top: 1.5rem;
padding-top: 1.5rem !important;
}
.p-r-md {
padding-right: 1.5rem;
padding-right: 1.5rem !important;
}
.p-b-md {
padding-bottom: 1.5rem;
padding-bottom: 1.5rem !important;
}
.p-l-md {
padding-left: 1.5rem;
padding-left: 1.5rem !important;
}
.p-x-md {
padding-right: 1.5rem;
padding-left: 1.5rem;
padding-right: 1.5rem !important;
padding-left: 1.5rem !important;
}
.p-y-md {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
padding-top: 1.5rem !important;
padding-bottom: 1.5rem !important;
}
.p-a-lg {
padding: 3rem !important;
}
.p-t-lg {
padding-top: 3rem;
padding-top: 3rem !important;
}
.p-r-lg {
padding-right: 3rem;
padding-right: 3rem !important;
}
.p-b-lg {
padding-bottom: 3rem;
padding-bottom: 3rem !important;
}
.p-l-lg {
padding-left: 3rem;
padding-left: 3rem !important;
}
.p-x-lg {
padding-right: 3rem;
padding-left: 3rem;
padding-right: 3rem !important;
padding-left: 3rem !important;
}
.p-y-lg {
padding-top: 3rem;
padding-bottom: 3rem;
padding-top: 3rem !important;
padding-bottom: 3rem !important;
}
.pos-f-t {
......
This diff was suppressed by a .gitattributes entry.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff was suppressed by a .gitattributes entry.
......@@ -20,7 +20,8 @@
<link href="{{ site.baseurl }}/assets/css/docs.min.css" rel="stylesheet">
<!-- Google Web fonts -->
<link href="http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700" rel="stylesheet">
<link href="http://fonts.googleapis.com/css?family=Roboto:300,400,400italic,500" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,400italic,600' rel='stylesheet' type='text/css'>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="{{ site.baseurl }}/assets/js/ie10-viewport-bug-workaround.js"></script>
......
<header class="navbar navbar-sm navbar-inverse navbar-static-top bd-navbar" role="banner">
<nav class="nav navbar-nav">
<a class="nav-item nav-link" href="{{ site.baseurl }}/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Bootstrap</a>
<a class="nav-item nav-link" href="{{ site.baseurl }}/getting-started/overview/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-item nav-link" href="{{ site.baseurl }}/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<header class="navbar navbar-sm navbar-defeault navbar-static-top bd-navbar" role="banner">
<div class="container-fluid">
<nav class="nav nav-inline">
<a class="nav-item nav-link {% if page.layout == "home" %}active{% endif %}" href="{{ site.baseurl }}/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Bootstrap</a>
<a class="nav-item nav-link {% if page.layout == "docs" %}active{% endif %}" href="{{ site.baseurl }}/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-item nav-link {% if page.title == "Examples" %}active{% endif %}" href="{{ site.baseurl }}/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-item nav-link" href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a>
<a class="nav-item nav-link" href="{{ site.blog }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a>
</nav>
</div>
</header>
<!DOCTYPE html>
<html lang="en">
<head>
{% include header.html %}
</head>
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
<div class="container">
<span class="skiplink-text">Skip to main content</span>
</div>
</a>
{% include nav-home.html %}
<div class="bd-pageheader text-xs-center text-sm-left">
<div class="container">
{% include page-headers.html %}
{% include ads.html %}
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-3 col-md-push-9 bd-sidebar">
{% include nav-docs.html %}
</div>
<div class="col-md-9 col-md-pull-3 bd-content">
<h1 class="bd-title">{{ page.title }}</h1>
{{ content }}
</div>
</div>
</div>
{% include footer.html %}
</body>
</html>
---
layout: default
---
<div class="bd-pageheader text-xs-center text-sm-left">
<div class="container">
{% include page-headers.html %}
{% include ads.html %}
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-3 col-md-push-9 bd-sidebar">
{% include nav-docs.html %}
</div>
<div class="col-md-9 col-md-pull-3 bd-content">
<h1 class="bd-title">{{ page.title }}</h1>
{{ content }}
</div>
</div>
</div>
......@@ -2,8 +2,16 @@
layout: default
---
<div class="container bd-content">
<div class="bd-pageheader text-xs-center text-sm-left">
<div class="container">
<h1>{{ page.title }}</h1>
<p class="lead">
Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.
</p>
{% include ads.html %}
<h1 class="bd-title">{{ page.title }}</h1>
</div>
</div>
<div class="container bd-content">
{{ content }}
</div>
---
layout: page
layout: docs
title: Brand guidelines
group: about
---
......
---
layout: page
layout: docs
title: History
group: about
---
......
---
layout: page
layout: docs
title: License FAQs
group: about
---
......
---
layout: page
layout: docs
title: Team
group: about
---
......
---
layout: page
layout: docs
title: Translations
group: about
---
......
......@@ -3,5 +3,5 @@
* Copyright 2011-2014 Twitter, Inc.
* Licensed under the Creative Commons Attribution 3.0 Unported License. For
* details, see http://creativecommons.org/licenses/by/3.0/.
*/.ge,.sd{font-style:italic}.bd-content>table{display:block;width:100%;max-width:100%;overflow-y:auto;margin-bottom:1rem}.bd-content>table>tbody>tr>td,.bd-content>table>tbody>tr>th,.bd-content>table>tfoot>tr>td,.bd-content>table>tfoot>tr>th,.bd-content>table>thead>tr>td,.bd-content>table>thead>tr>th{padding:.75rem;line-height:1.5;vertical-align:top;border:1px solid #eceeef}.bd-content>table>tbody>tr>td>p:last-child,.bd-content>table>tbody>tr>th>p:last-child,.bd-content>table>tfoot>tr>td>p:last-child,.bd-content>table>tfoot>tr>th>p:last-child,.bd-content>table>thead>tr>td>p:last-child,.bd-content>table>thead>tr>th>p:last-child{margin-bottom:0}.bd-content>table td:first-child>code{white-space:nowrap}.bd-pageheader{padding:2rem .75rem;margin-bottom:3rem;color:#cdbfe3;background-color:#563d7c}.bd-pageheader .container{position:relative}.bd-pageheader h1{font-size:3rem;font-weight:400;color:#fff}.bd-pageheader p{margin-bottom:0;font-size:1.5rem}@media (min-width:34em){.bd-pageheader{padding-top:4rem;padding-bottom:4rem}.bd-pageheader .carbonad{margin:2rem 0 0!important}}@media (min-width:48em){.bd-pageheader h1{font-size:4rem}}@media (min-width:62em){.bd-pageheader h1,.bd-pageheader p{margin-right:380px}.bd-pageheader .carbonad{position:absolute;top:0;right:.75rem;margin:0!important}}.bd-example,.bd-masthead,.bd-search{position:relative}#markdown-toc ul,.bd-content>ol li,.bd-content>ul li{margin-bottom:.25rem}.bd-content>h2:not(:first-child){margin-top:3rem}.bd-content>h3{margin-top:1.5rem}#markdown-toc ul,.bd-search-results>li:first-child{margin-top:.25rem}@media (min-width:34em){.bd-title{font-size:3rem}.bd-title+p{font-size:1.25rem;font-weight:300}}#markdown-toc>li:first-child{display:none}#markdown-toc ul{padding-left:2rem}.bd-search{margin-right:1.25rem;margin-bottom:1.5rem;margin-left:1.25rem}.bd-search .form-control{height:2.45rem;padding-top:.4rem;padding-bottom:.4rem;background-color:#fafafa}.bd-search .form-control:focus{background-color:#fff}.bd-search-results{right:0;display:block;padding:0;overflow:hidden;font-size:.9rem}.bd-search-results:empty{display:none}.bd-search-results>li>a{padding-left:.75rem;padding-right:.75rem}.bd-search-results>li:last-child{margin-bottom:.25rem}.bd-search-results>.no-results{padding:.75rem 1rem;color:#7a7a7a;text-align:center}.bd-sidenav{display:none}.active>.bd-sidenav,.bd-toc-link{display:block}.bd-toc-link{padding:.25rem 1.25rem;color:#55595c}.bd-toc-link:focus,.bd-toc-link:hover{color:#0275d8;text-decoration:none}.active>.bd-toc-link{font-weight:500;color:#373a3c}.bd-toc-item.active{margin-top:1rem;margin-bottom:1rem}.bd-toc-item:first-child{margin-top:0}.bd-toc-item:last-child{margin-bottom:2rem}.bd-sidebar .nav>li>a{display:block;padding:.25rem 1.25rem;font-size:90%;color:#99979c}.bd-sidebar .nav>li>a:focus,.bd-sidebar .nav>li>a:hover{color:#0275d8;text-decoration:none;background-color:transparent}.bd-sidebar .nav>.active:focus>a,.bd-sidebar .nav>.active:hover>a,.bd-sidebar .nav>.active>a{font-weight:500;color:#373a3c;background-color:transparent}.bd-sidebar .nav .nav{display:none;padding-bottom:.75rem}.bd-sidebar .nav .nav>li>a{padding-top:1px;padding-bottom:1px;font-weight:400;padding-top:.125rem;padding-bottom:.125rem;padding-left:2rem;font-size:80%}.bd-sidebar .nav .nav>.active:focus>a,.bd-sidebar .nav .nav>.active:hover>a,.bd-sidebar .nav .nav>.active>a{font-weight:500}.bd-sidebar .nav>.active>.nav{display:block}.bd-booticon{display:block;width:9rem;height:9rem;font-size:6.5rem;line-height:9rem;color:#fff;text-align:center;cursor:default;background-color:#563d7c;border-radius:15%}.bd-booticon.inverse{color:#563d7c;background-color:#fff}.bd-booticon.outline{background-color:transparent;border:1px solid #cdbfe3}.bd-nav-home{margin-bottom:0;background-color:#563d7c;border-bottom:0}.bd-nav-home .navbar-brand>a{font-weight:500;color:#fff}.bd-nav-home .nav-link{font-weight:500;color:#cdbfe3}.bd-nav-home .nav-link:focus,.bd-nav-home .nav-link:hover{color:#fff;background-color:rgba(0,0,0,.5)}.bd-navbar{padding:.25rem;margin-bottom:0;background-color:#2a2730}.bd-navbar .nav-link{color:#8e869d}.bd-navbar .nav-link.active,.bd-navbar .nav-link:focus,.bd-navbar .nav-link:hover{color:#fff;background-color:transparent}.bd-masthead{padding:.75rem;color:#8e869d;text-align:center;background:-webkit-linear-gradient(to bottom,#2a2730,#3c3845);background:-webkit-gradient(linear,left top,left bottom,from(#2a2730),to(#3c3845));background:-webkit-linear-gradient(top,#2a2730,#3c3845);background:-o-linear-gradient(top,#2a2730,#3c3845);background:linear-gradient(to bottom,#2a2730,#3c3845)}.bd-featurette .highlight,.carbonad{text-align:left}.bd-masthead .bd-booticon{margin:0 auto 2rem;color:#9062d7;border-color:#9062d7}.bd-masthead h1{font-weight:300;line-height:1}.bd-masthead .lead{margin-left:auto;margin-right:auto;margin-bottom:2rem;font-size:1.25rem}.bd-masthead .version{margin-top:-1rem;margin-bottom:2rem}.bd-masthead .btn{width:100%;padding:1rem 2rem;font-size:1.25rem;font-weight:500;color:#ffe484;border-color:#ffe484}.bd-masthead .btn:hover{color:#2a2730;background-color:#ffe484;border-color:#ffe484}.bd-masthead .carbonad{margin-bottom:-2rem!important}@media (min-width:34em){.bd-masthead{padding-top:8rem;padding-bottom:2rem}.bd-masthead .btn{width:auto}.bd-masthead .carbonad{margin-bottom:0!important}}@media (min-width:48em){.bd-masthead{padding-bottom:4rem}.bd-masthead .bd-header{margin-bottom:4rem}.bd-masthead h1{font-size:4rem}.bd-masthead .lead{font-size:1.5rem}.bd-masthead .carbonad{margin-top:3rem!important}}@media (min-width:62em){.bd-masthead .lead{width:80%;font-size:2rem}}.bd-featurette{padding-top:3rem;padding-bottom:3rem;font-size:1rem;line-height:1.5;color:#555;background-color:#fff;border-top:1px solid #eee}.bd-featurette-title{margin-bottom:.5rem;font-size:2rem;font-weight:400;color:#333}.bd-featurette-title+.lead{font-size:1.5rem;margin-bottom:2rem}.half-rule{width:6rem;margin:2.5rem 0}.carbonad,.carbonad-tag,.carbonad-text{width:auto!important;height:auto!important;font-family:inherit!important}.bd-featurette h4{margin-top:1rem;margin-bottom:.5rem;font-weight:400;color:#333}.bd-featurette-img{display:block;margin-bottom:1.25rem;color:#333}.bd-featurette-img:hover{color:#0275d8;text-decoration:none}.bd-featurette-img img{display:block;margin-bottom:1rem}@media (min-width:480px){.bd-featurette .img-responsive{margin-top:2rem}}@media (min-width:768px){.bd-featurette{padding-top:6rem;padding-bottom:6rem}.bd-featurette-title{font-size:2.5rem}.bd-featurette .lead{max-width:80%}.bd-featurette .img-responsive{margin-top:0}}.bd-featured-sites{margin-right:-1px;margin-left:-1px}.bd-featured-sites .col-xs-6{padding:1px}.bd-featured-sites .img-responsive{margin-top:0}@media (min-width:768px){.bd-featured-sites .col-sm-3:first-child img{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.bd-featured-sites .col-sm-3:last-child img{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}}.carbonad{padding:1.25rem!important;margin:2rem -1.5rem -2rem!important;overflow:hidden;font-size:.8rem!important;line-height:1rem!important;color:#cdbfe3!important;background:#3e2c5a!important;border:0!important}.bd-masthead .carbonad{background:#2a2730!important}.carbonad-img{margin:0!important}.carbonad-tag,.carbonad-text{display:block!important;float:none!important;margin-left:145px!important}.carbonad-text{padding-top:0!important}.carbonad-tag{color:inherit!important;text-align:left!important}.carbonad-tag a,.carbonad-tag a:hover,.carbonad-text a,.carbonad-text a:hover{color:#fff!important}.carbonad #azcarbon>img{display:none}.bd-footer-links li,.bd-social-buttons{display:inline-block}@media (min-width:34em){.carbonad{width:330px!important;padding:1rem!important;margin-right:auto!important;margin-left:auto!important;border-radius:.25rem}}.bd-footer{padding:4rem 0;margin-top:4rem;font-size:85%;background-color:#f7f7f7;text-align:center}.bd-footer a{font-weight:500;color:#55595c}.bd-footer a:hover{color:#0275d8}.bd-footer p{margin-bottom:0}@media (min-width:34em){.bd-footer{text-align:left}}.bd-brand-item,.bd-example-tooltips,.responsive-utilities td{text-align:center}.bd-footer-links{padding-left:0;margin-bottom:1rem}.bd-footer-links li+li{margin-left:1rem}.bd-social{margin-bottom:1.5rem;margin-left:-.5rem}.bd-social-buttons{padding-left:0;margin-bottom:0;list-style:none}.bd-social-buttons li{display:inline-block;padding:.25rem .5rem;line-height:1}.bd-social-buttons .twitter-follow-button{width:225px!important}.bd-social-buttons .twitter-share-button{width:98px!important}.github-btn{overflow:hidden;border:0}.bd-example-row .row{margin-bottom:1rem}.bd-example-row .row>[class^=col-]{padding-top:.75rem;padding-bottom:.75rem;background-color:rgba(86,61,124,.15);border:1px solid rgba(86,61,124,.2)}.bd-example-container{min-width:16rem;max-width:25rem;margin-left:auto;margin-right:auto}.bd-example-container-header{height:3rem;margin-bottom:.5rem;background-color:#daeeff;border-radius:.25rem}.bd-example-container-sidebar{float:right;width:4rem;height:8rem;background-color:#fae3c4;border-radius:.25rem}.bd-example-container-body{height:8rem;margin-right:4.5rem;background-color:#957bbe;border-radius:.25rem}.bd-example-container-fluid{max-width:none}.bd-example{padding:1rem;margin:1rem -1rem;border:solid #f7f7f9;border-width:.2rem 0 0}.bd-example:after,.bd-example:before{content:" ";display:table}.bd-example:after{clear:both}@media (min-width:34em){.bd-example{margin-left:0;margin-right:0;margin-bottom:0;padding:1.5rem;border-width:.2rem}}.bd-example+.highlight,.bd-example+.zero-clipboard+.highlight{margin-top:0}.bd-example+p{margin-top:2rem}.bd-example .container{width:auto}.bd-example>.card{max-width:20rem}.bd-example>.alert+.alert,.bd-example>.nav+.nav,.bd-example>.navbar+.navbar,.bd-example>.progress+.btn,.bd-example>.progress+.progress{margin-top:1rem}.bd-example>.dropdown-menu:first-child{position:static;display:block}.bd-example>.table-responsive:last-child>.table,.bd-example>:last-child{margin-bottom:0!important}.bd-example>.close{float:none}.bd-example-type .table .type-info{color:#999;vertical-align:middle}.bd-example-type .table td{padding:1rem 0;border-color:#eee}.bd-example-type .table tr:first-child td{border-top:0}.bd-example-type h1,.bd-example-type h2,.bd-example-type h3,.bd-example-type h4,.bd-example-type h5,.bd-example-type h6{margin:0}.bd-example-bg-classes p{padding:1rem}.bd-example>img+img{margin-left:.5rem}.bd-example>.btn-group{margin-top:.25rem;margin-bottom:.25rem}.bd-example-control-sizing input[type=text]+input[type=text],.bd-example-control-sizing select,.bd-example>.btn-toolbar+.btn-toolbar{margin-top:.5rem}.bd-example-form .input-group{margin-bottom:.5rem}.bd-example>textarea.form-control{resize:vertical}.bd-example>.list-group{max-width:400px}.bd-example .navbar:last-child{margin-bottom:0}.bd-navbar-bottom-example,.bd-navbar-top-example{z-index:1;padding:0;overflow:hidden}.bd-navbar-bottom-example .navbar-header,.bd-navbar-top-example .navbar-header{margin-left:0}.bd-navbar-bottom-example .navbar-fixed-bottom,.bd-navbar-top-example .navbar-fixed-top{position:relative;margin-right:0;margin-left:0}.bd-navbar-top-example{padding-bottom:45px}.bd-navbar-top-example .navbar-fixed-top{top:-1px}.bd-navbar-bottom-example{padding-top:45px}.bd-navbar-bottom-example .navbar-fixed-bottom{bottom:-1px}.bd-navbar-bottom-example .navbar{margin-bottom:0}@media (min-width:768px){.bd-navbar-bottom-example .navbar-fixed-bottom,.bd-navbar-top-example .navbar-fixed-top{position:absolute}}.bd-example .pagination{margin-top:.5rem;margin-bottom:.5rem}.bd-example>.pager{margin-top:0}.bd-example-modal{background-color:#f5f5f5}.bd-example-modal .modal{position:relative;top:auto;right:auto;bottom:auto;left:auto;z-index:1;display:block}.bd-example-modal .modal-dialog{left:auto;margin-right:auto;margin-left:auto}.bd-example>.dropdown>.dropdown-toggle{float:left}.bd-example>.dropdown>.dropdown-menu{position:static;display:block;margin-bottom:.25rem;clear:left}.bd-example-tabs .nav-tabs{margin-bottom:1rem}.bd-example-tooltips>.btn{margin-top:.25rem;margin-bottom:.25rem}.bd-example-popover{padding-bottom:1.5rem;background-color:#f9f9f9}.bd-example-popover .popover{position:relative;display:block;float:left;width:260px;margin:1.25rem}.bd-example-tooltip .tooltip{position:relative;display:inline-block;margin:10px 20px;opacity:1}.scrollspy-example{position:relative;height:200px;margin-top:.5rem;overflow:auto}.bd-example>.center-block:not(img){max-width:200px;padding:.5rem;background-color:#eee}.bd-example>.bg-danger,.bd-example>.bg-info,.bd-example>.bg-primary,.bd-example>.bg-success,.bd-example>.bg-warning{padding:.5rem;margin-top:.5rem;margin-bottom:.5rem}.highlight{padding:1rem;margin:1rem -1rem;background-color:#f7f7f9}@media (min-width:34em){.highlight{padding:1.5rem;margin-right:0;margin-left:0}}.highlight pre{padding:0;margin-top:0;margin-bottom:0;background-color:transparent;border:0}.highlight pre code{font-size:inherit;color:#373a3c}#focusedInput{border-color:#66afe9;outline:0;outline:dotted thin\9;-webkit-box-shadow:0 0 .5rem rgba(102,175,233,.6);box-shadow:0 0 .5rem rgba(102,175,233,.6)}.table-responsive .highlight pre{white-space:normal}.bd-table th small,.responsive-utilities th small{display:block;font-weight:400;color:#999}.responsive-utilities tbody th{font-weight:400}.responsive-utilities td.is-visible{color:#468847;background-color:#dff0d8!important}.responsive-utilities td.is-hidden{color:#ccc;background-color:#f9f9f9!important}.responsive-utilities-test{margin-top:.25rem}.responsive-utilities-test .col-xs-6{margin-bottom:.5rem}.responsive-utilities-test span{display:block;padding:1rem .5rem;font-size:1rem;font-weight:700;line-height:1.1;text-align:center;border-radius:.25rem}.hidden-on .col-xs-6>.not-visible,.visible-on .col-xs-6>.not-visible{color:#999;border:1px solid #ddd}.hidden-on .col-xs-6 .visible,.visible-on .col-xs-6 .visible{color:#468847;background-color:#dff0d8;border:1px solid #d6e9c6}@media (max-width:33.9em){.hidden-xs-only{display:none!important}}@media (min-width:34em) and (max-width:47.9em){.hidden-sm-only{display:none!important}}@media (min-width:48em) and (max-width:61.9em){.hidden-md-only{display:none!important}}@media (min-width:62em) and (max-width:74.9em){.hidden-lg-only{display:none!important}}@media (min-width:75em){.hidden-xl-only{display:none!important}}.btn-bs{color:#563d7c;border-color:#563d7c}.btn-bs:active,.btn-bs:focus,.btn-bs:hover{color:#fff;background-color:#563d7c;border-color:#563d7c}.bd-callout{padding:1.25rem;margin-top:1.25rem;margin-bottom:1.25rem;border:1px solid #eee;border-left-width:.25rem;border-radius:.25rem}.bd-brand-logos,.bd-callout code{border-radius:.25rem}.bd-callout h4{margin-top:0;margin-bottom:.25rem}.bd-callout p:last-child{margin-bottom:0}.bd-callout+.bd-callout{margin-top:-.25rem}.bd-callout-info{border-left-color:#5bc0de}.bd-callout-info h4{color:#5bc0de}.bd-callout-warning{border-left-color:#f0ad4e}.bd-callout-warning h4{color:#f0ad4e}.bd-callout-danger{border-left-color:#d9534f}.bd-callout-danger h4{color:#d9534f}.bd-examples .img-thumbnail{margin-bottom:.75rem}.bd-examples h4{margin-bottom:.25rem}.bd-examples p{margin-bottom:1.25rem}@media (max-width:480px){.bd-examples{margin-right:-.75rem;margin-left:-.75rem}.bd-examples>[class^=col-]{padding-right:.75rem;padding-left:.75rem}}.bd-team{margin-bottom:1.5rem}.bd-team .team-member{line-height:2rem;color:#555}.bd-team .team-member:hover{color:#333;text-decoration:none}.bd-team .github-btn{float:right;width:180px;height:1.25rem;margin-top:.25rem}.bd-team img,.color-swatch{float:left;border-radius:.25rem}.bd-team img{width:2rem;margin-right:.5rem}.bd-browser-bugs td p{margin-bottom:0}.bd-browser-bugs th:first-child{width:18%}.bd-brand-logos{display:table;width:100%;margin-bottom:1rem;overflow:hidden;color:#563d7c;background-color:#f9f9f9}.bd-brand-logos .inverse,.color-swatches .bd-purple{background-color:#563d7c}.bd-brand-item{padding:4rem 0}.bd-brand-item+.bd-brand-item{border-top:1px solid #fff}.bd-brand-logos .inverse{color:#fff}.bd-brand-item h1,.bd-brand-item h3{margin-top:0;margin-bottom:0}.bd-brand-item .bd-booticon{margin-right:auto;margin-left:auto}@media (min-width:768px){.bd-brand-item{display:table-cell;width:1%}.bd-brand-item+.bd-brand-item{border-top:0;border-left:1px solid #fff}.bd-brand-item h1{font-size:4rem}}.color-swatches{margin:0 -5px;overflow:hidden}.color-swatch{width:4rem;height:4rem;margin-right:.25rem;margin-left:.25rem}.color-swatches .bd-purple-light{background-color:#cdbfe3}.color-swatches .bd-purple-lighter{background-color:#e5e1ea}.color-swatches .bd-gray{background-color:#f9f9f9}.zero-clipboard{position:relative;display:none;float:right}.btn-clipboard{position:absolute;top:0;right:0;z-index:10;display:block;padding:.25rem .5rem;font-size:75%;color:#818a91;cursor:pointer;background-color:#eceeef;border-radius:0 .2rem}.btn-clipboard-hover{color:#fff;background-color:#027de7}@media (min-width:768px){.color-swatch{width:6rem;height:6rem}.zero-clipboard{display:block}}.hll{background-color:#ffc}.c{color:#999}.err{color:#A00;background-color:#FAA}.k{color:#069}.o{color:#555}.cm{color:#999}.cp{color:#099}.c1,.cs{color:#999}.gd{background-color:#FCC;border:1px solid #C00}.gr{color:red}.gh{color:#030}.gi{background-color:#CFC;border:1px solid #0C0}.go{color:#AAA}.gp{color:#009}.gu{color:#030}.gt{color:#9C6}.kc,.kd,.kn,.kp,.kr{color:#069}.kt{color:#078}.m{color:#F60}.s{color:#d44950}.na{color:#4f9fcf}.nb{color:#366}.nc{color:#0A8}.no{color:#360}.nd{color:#99F}.ni{color:#999}.ne{color:#C00}.nf{color:#C0F}.nl{color:#99F}.nn{color:#0CF}.nt{color:#2f6f9f}.nv{color:#033}.ow{color:#000}.w{color:#bbb}.mf,.mh,.mi,.mo{color:#F60}.s2,.sb,.sc,.sd,.se,.sh{color:#C30}.si{color:#A00}.sx{color:#C30}.sr{color:#3AA}.s1{color:#C30}.ss{color:#FC3}.bp{color:#366}.vc,.vg,.vi{color:#033}.il{color:#F60}.css .nt+.nt,.css .o,.css .o+.nt{color:#999}.anchorjs-link{color:inherit}@media (max-width:480px){.anchorjs-link{display:none}}:hover>.anchorjs-link{opacity:.75;-webkit-transition:color .16s linear;-o-transition:color .16s linear;transition:color .16s linear}.anchorjs-link:focus,:hover>.anchorjs-link:hover{text-decoration:none;opacity:1}
*/.ge,.sd{font-style:italic}.bd-content>table{display:block;width:100%;max-width:100%;overflow-y:auto;margin-bottom:1rem}.bd-content>table>tbody>tr>td,.bd-content>table>tbody>tr>th,.bd-content>table>tfoot>tr>td,.bd-content>table>tfoot>tr>th,.bd-content>table>thead>tr>td,.bd-content>table>thead>tr>th{padding:.75rem;line-height:1.5;vertical-align:top;border:1px solid #eceeef}.bd-content>table>tbody>tr>td>p:last-child,.bd-content>table>tbody>tr>th>p:last-child,.bd-content>table>tfoot>tr>td>p:last-child,.bd-content>table>tfoot>tr>th>p:last-child,.bd-content>table>thead>tr>td>p:last-child,.bd-content>table>thead>tr>th>p:last-child{margin-bottom:0}.bd-content>table td:first-child>code{white-space:nowrap}.bd-pageheader{padding:2rem .75rem;margin-bottom:3rem;color:#cdbfe3;background-color:#563d7c}.bd-pageheader .container{position:relative}.bd-pageheader h1{font-size:3rem;font-weight:400;color:#fff}.bd-pageheader p{margin-bottom:0;font-size:1.5rem}@media (min-width:34em){.bd-pageheader{padding-top:4rem;padding-bottom:4rem}.bd-pageheader .carbonad{margin:2rem 0 0!important}}@media (min-width:48em){.bd-pageheader h1{font-size:4rem}}@media (min-width:62em){.bd-pageheader h1,.bd-pageheader p{margin-right:380px}.bd-pageheader .carbonad{position:absolute;top:0;right:.75rem;margin:0!important}}.bd-example,.bd-masthead,.bd-search{position:relative}#markdown-toc ul,.bd-content>ol li,.bd-content>ul li{margin-bottom:.25rem}.bd-content>h2:not(:first-child){margin-top:3rem}.bd-content>h3{margin-top:1.5rem}#markdown-toc ul,.bd-search-results>li:first-child{margin-top:.25rem}@media (min-width:34em){.bd-title{font-size:3rem}.bd-title+p{font-size:1.25rem;font-weight:300}}#markdown-toc>li:first-child{display:none}#markdown-toc ul{padding-left:2rem}@media (min-width:48em){.bd-sidebar{padding-left:1rem}}.bd-search{margin-bottom:1.5rem}.bd-search .form-control{height:2.45rem;padding-top:.4rem;padding-bottom:.4rem;background-color:#fafafa}.bd-search .form-control:focus{background-color:#fff}.bd-search-results{right:0;display:block;padding:0;overflow:hidden;font-size:.9rem}.bd-search-results:empty{display:none}.bd-search-results>li>a{padding-left:.75rem;padding-right:.75rem}.bd-search-results>li:last-child{margin-bottom:.25rem}.bd-search-results>.no-results{padding:.75rem 1rem;color:#7a7a7a;text-align:center}.bd-sidenav{display:none}.bd-toc-link{display:block;padding:.25rem .75rem;color:#55595c}.bd-toc-link:focus,.bd-toc-link:hover{color:#0275d8;text-decoration:none}.active>.bd-toc-link{font-weight:500;color:#373a3c}.active>.bd-sidenav{display:block}.bd-toc-item.active{margin-top:1rem;margin-bottom:1rem}.bd-toc-item:first-child{margin-top:0}.bd-toc-item:last-child{margin-bottom:2rem}.bd-sidebar .nav>li>a{display:block;padding:.25rem .75rem;font-size:90%;color:#99979c}.bd-sidebar .nav>li>a:focus,.bd-sidebar .nav>li>a:hover{color:#0275d8;text-decoration:none;background-color:transparent}.bd-sidebar .nav>.active:focus>a,.bd-sidebar .nav>.active:hover>a,.bd-sidebar .nav>.active>a{font-weight:500;color:#373a3c;background-color:transparent}.bd-booticon{display:block;width:9rem;height:9rem;font-size:6.5rem;line-height:9rem;color:#fff;text-align:center;cursor:default;background-color:#563d7c;border-radius:15%}.bd-booticon.inverse{color:#563d7c;background-color:#fff}.bd-booticon.outline{background-color:transparent;border:1px solid #cdbfe3}.bd-navbar{padding-top:1rem;padding-bottom:1rem;margin-bottom:0}.bd-navbar .nav-link{color:#8e869d}.bd-navbar .nav-link.active,.bd-navbar .nav-link:focus,.bd-navbar .nav-link:hover{color:#373a3c;background-color:transparent}.bd-navbar .nav-link.active{font-weight:500}.bd-masthead{padding:.9375rem;color:#cdbfe3;text-align:center;background:-webkit-linear-gradient(315deg,#322449,#563d7c,#7952b3);background:-o-linear-gradient(315deg,#322449,#563d7c,#7952b3);background:linear-gradient(135deg,#322449,#563d7c,#7952b3)}.bd-featurette .highlight,.carbonad{text-align:left}.bd-masthead .bd-booticon{margin:0 auto 2rem;color:#cdbfe3;border-color:#cdbfe3}.bd-masthead h1{font-weight:300;line-height:1}.bd-masthead .lead{margin-left:auto;margin-right:auto;margin-bottom:2rem;font-size:1rem;color:#fff}.bd-masthead .version{margin-top:-1rem;margin-bottom:2rem}.bd-masthead .btn{width:100%;padding:1rem 2rem;font-size:1.25rem;font-weight:500;color:#ffe484;border-color:#ffe484}.bd-masthead .btn:hover{color:#2a2730;background-color:#ffe484;border-color:#ffe484}.bd-masthead .carbonad{margin-bottom:-2rem!important}@media (min-width:34em){.bd-masthead{padding-top:8rem;padding-bottom:2rem}.bd-masthead .btn{width:auto}.bd-masthead .carbonad{margin-bottom:0!important}}@media (min-width:48em){.bd-masthead{padding-bottom:4rem}.bd-masthead .bd-header{margin-bottom:4rem}.bd-masthead h1{font-size:4rem}.bd-masthead .lead{font-size:1.5rem}.bd-masthead .carbonad{margin-top:3rem!important}}@media (min-width:62em){.bd-masthead .lead{width:85%;font-size:2rem}}.bd-featurette{padding-top:3rem;padding-bottom:3rem;font-size:1rem;line-height:1.5;color:#555;background-color:#fff;border-top:1px solid #eee}.bd-featurette-title{margin-bottom:.5rem;font-size:2rem;font-weight:400;color:#333}.bd-featurette-title+.lead{font-size:1.5rem;margin-bottom:2rem}.half-rule{width:6rem;margin:2.5rem 0}.carbonad,.carbonad-tag,.carbonad-text{width:auto!important;height:auto!important;font-family:inherit!important}.bd-featurette h4{margin-top:1rem;margin-bottom:.5rem;font-weight:400;color:#333}.bd-featurette-img{display:block;margin-bottom:1.25rem;color:#333}.bd-featurette-img:hover{color:#0275d8;text-decoration:none}.bd-featurette-img img{display:block;margin-bottom:1rem}@media (min-width:480px){.bd-featurette .img-responsive{margin-top:2rem}}@media (min-width:768px){.bd-featurette{padding-top:6rem;padding-bottom:6rem}.bd-featurette-title{font-size:2.5rem}.bd-featurette .lead{max-width:80%}.bd-featurette .img-responsive{margin-top:0}}.bd-featured-sites{margin-right:-1px;margin-left:-1px}.bd-featured-sites .col-xs-6{padding:1px}.bd-featured-sites .img-responsive{margin-top:0}@media (min-width:768px){.bd-featured-sites .col-sm-3:first-child img{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.bd-featured-sites .col-sm-3:last-child img{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}}.carbonad{padding:1.25rem!important;margin:2rem -1.5rem -2rem!important;overflow:hidden;font-size:.8rem!important;line-height:1rem!important;color:#cdbfe3!important;background:#3e2c5a!important;border:0!important}.bd-masthead .carbonad{background:#2a2730!important}.carbonad-img{margin:0!important}.carbonad-tag,.carbonad-text{display:block!important;float:none!important;margin-left:145px!important}.carbonad-text{padding-top:0!important}.carbonad-tag{color:inherit!important;text-align:left!important}.carbonad-tag a,.carbonad-tag a:hover,.carbonad-text a,.carbonad-text a:hover{color:#fff!important}.carbonad #azcarbon>img{display:none}.bd-footer-links li,.bd-social-buttons{display:inline-block}@media (min-width:34em){.carbonad{width:330px!important;padding:1rem!important;margin-right:auto!important;margin-left:auto!important;border-radius:.25rem}}.bd-footer{padding:4rem 0;margin-top:4rem;font-size:85%;background-color:#f7f7f7;text-align:center}.bd-footer a{font-weight:500;color:#55595c}.bd-footer a:hover{color:#0275d8}.bd-footer p{margin-bottom:0}@media (min-width:34em){.bd-footer{text-align:left}}.bd-brand-item,.bd-example-tooltips,.responsive-utilities td{text-align:center}.bd-footer-links{padding-left:0;margin-bottom:1rem}.bd-footer-links li+li{margin-left:1rem}.bd-social{margin-bottom:1.5rem;margin-left:-.5rem}.bd-social-buttons{padding-left:0;margin-bottom:0;list-style:none}.bd-social-buttons li{display:inline-block;padding:.25rem .5rem;line-height:1}.bd-social-buttons .twitter-follow-button{width:225px!important}.bd-social-buttons .twitter-share-button{width:98px!important}.github-btn{overflow:hidden;border:0}.bd-example-row .row{margin-bottom:1rem}.bd-example-row .row>[class^=col-]{padding-top:.75rem;padding-bottom:.75rem;background-color:rgba(86,61,124,.15);border:1px solid rgba(86,61,124,.2)}.bd-example-container{min-width:16rem;max-width:25rem;margin-left:auto;margin-right:auto}.bd-example-container-header{height:3rem;margin-bottom:.5rem;background-color:#daeeff;border-radius:.25rem}.bd-example-container-sidebar{float:right;width:4rem;height:8rem;background-color:#fae3c4;border-radius:.25rem}.bd-example-container-body{height:8rem;margin-right:4.5rem;background-color:#957bbe;border-radius:.25rem}.bd-example-container-fluid{max-width:none}.bd-example{padding:1rem;margin:1rem -1rem;border:solid #f7f7f9;border-width:.2rem 0 0}.bd-example:after,.bd-example:before{content:" ";display:table}.bd-example:after{clear:both}@media (min-width:34em){.bd-example{margin-left:0;margin-right:0;margin-bottom:0;padding:1.5rem;border-width:.2rem}}.bd-example+.highlight,.bd-example+.zero-clipboard+.highlight{margin-top:0}.bd-example+p{margin-top:2rem}.bd-example .container{width:auto}.bd-example>.card{max-width:20rem}.bd-example>.alert+.alert,.bd-example>.nav+.nav,.bd-example>.navbar+.navbar,.bd-example>.progress+.btn,.bd-example>.progress+.progress{margin-top:1rem}.bd-example>.dropdown-menu:first-child{position:static;display:block}.bd-example>.table-responsive:last-child>.table,.bd-example>:last-child{margin-bottom:0!important}.bd-example>.close{float:none}.bd-example-type .table .type-info{color:#999;vertical-align:middle}.bd-example-type .table td{padding:1rem 0;border-color:#eee}.bd-example-type .table tr:first-child td{border-top:0}.bd-example-type h1,.bd-example-type h2,.bd-example-type h3,.bd-example-type h4,.bd-example-type h5,.bd-example-type h6{margin:0}.bd-example-bg-classes p{padding:1rem}.bd-example>img+img{margin-left:.5rem}.bd-example>.btn-group{margin-top:.25rem;margin-bottom:.25rem}.bd-example-control-sizing input[type=text]+input[type=text],.bd-example-control-sizing select,.bd-example>.btn-toolbar+.btn-toolbar{margin-top:.5rem}.bd-example-form .input-group{margin-bottom:.5rem}.bd-example>textarea.form-control{resize:vertical}.bd-example>.list-group{max-width:400px}.bd-example .navbar:last-child{margin-bottom:0}.bd-navbar-bottom-example,.bd-navbar-top-example{z-index:1;padding:0;overflow:hidden}.bd-navbar-bottom-example .navbar-header,.bd-navbar-top-example .navbar-header{margin-left:0}.bd-navbar-bottom-example .navbar-fixed-bottom,.bd-navbar-top-example .navbar-fixed-top{position:relative;margin-right:0;margin-left:0}.bd-navbar-top-example{padding-bottom:45px}.bd-navbar-top-example .navbar-fixed-top{top:-1px}.bd-navbar-bottom-example{padding-top:45px}.bd-navbar-bottom-example .navbar-fixed-bottom{bottom:-1px}.bd-navbar-bottom-example .navbar{margin-bottom:0}@media (min-width:768px){.bd-navbar-bottom-example .navbar-fixed-bottom,.bd-navbar-top-example .navbar-fixed-top{position:absolute}}.bd-example .pagination{margin-top:.5rem;margin-bottom:.5rem}.bd-example>.pager{margin-top:0}.bd-example-modal{background-color:#f5f5f5}.bd-example-modal .modal{position:relative;top:auto;right:auto;bottom:auto;left:auto;z-index:1;display:block}.bd-example-modal .modal-dialog{left:auto;margin-right:auto;margin-left:auto}.bd-example>.dropdown>.dropdown-toggle{float:left}.bd-example>.dropdown>.dropdown-menu{position:static;display:block;margin-bottom:.25rem;clear:left}.bd-example-tabs .nav-tabs{margin-bottom:1rem}.bd-example-tooltips>.btn{margin-top:.25rem;margin-bottom:.25rem}.bd-example-popover{padding-bottom:1.5rem;background-color:#f9f9f9}.bd-example-popover .popover{position:relative;display:block;float:left;width:260px;margin:1.25rem}.bd-example-tooltip .tooltip{position:relative;display:inline-block;margin:10px 20px;opacity:1}.scrollspy-example{position:relative;height:200px;margin-top:.5rem;overflow:auto}.bd-example>.center-block:not(img){max-width:200px;padding:.5rem;background-color:#eee}.bd-example>.bg-danger,.bd-example>.bg-info,.bd-example>.bg-primary,.bd-example>.bg-success,.bd-example>.bg-warning{padding:.5rem;margin-top:.5rem;margin-bottom:.5rem}.highlight{padding:1rem;margin:1rem -1rem;background-color:#f7f7f9}@media (min-width:34em){.highlight{padding:1.5rem;margin-right:0;margin-left:0}}.highlight pre{padding:0;margin-top:0;margin-bottom:0;background-color:transparent;border:0}.highlight pre code{font-size:inherit;color:#373a3c}#focusedInput{border-color:#66afe9;outline:0;outline:dotted thin\9;-webkit-box-shadow:0 0 .5rem rgba(102,175,233,.6);box-shadow:0 0 .5rem rgba(102,175,233,.6)}.table-responsive .highlight pre{white-space:normal}.bd-table th small,.responsive-utilities th small{display:block;font-weight:400;color:#999}.responsive-utilities tbody th{font-weight:400}.responsive-utilities td.is-visible{color:#468847;background-color:#dff0d8!important}.responsive-utilities td.is-hidden{color:#ccc;background-color:#f9f9f9!important}.responsive-utilities-test{margin-top:.25rem}.responsive-utilities-test .col-xs-6{margin-bottom:.5rem}.responsive-utilities-test span{display:block;padding:1rem .5rem;font-size:1rem;font-weight:700;line-height:1.1;text-align:center;border-radius:.25rem}.hidden-on .col-xs-6>.not-visible,.visible-on .col-xs-6>.not-visible{color:#999;border:1px solid #ddd}.hidden-on .col-xs-6 .visible,.visible-on .col-xs-6 .visible{color:#468847;background-color:#dff0d8;border:1px solid #d6e9c6}@media (max-width:33.9em){.hidden-xs-only{display:none!important}}@media (min-width:34em) and (max-width:47.9em){.hidden-sm-only{display:none!important}}@media (min-width:48em) and (max-width:61.9em){.hidden-md-only{display:none!important}}@media (min-width:62em) and (max-width:74.9em){.hidden-lg-only{display:none!important}}@media (min-width:75em){.hidden-xl-only{display:none!important}}.btn-bs{color:#926ccd;border-color:#926ccd}.btn-bs:active,.btn-bs:focus,.btn-bs:hover{color:#fff;background-color:#926ccd;border-color:#926ccd}.bd-callout{padding:1.25rem;margin-top:1.25rem;margin-bottom:1.25rem;border:1px solid #eee;border-left-width:.25rem;border-radius:.25rem}.bd-brand-logos,.bd-callout code,.btn-clipboard{border-radius:.25rem}.bd-callout h4{margin-top:0;margin-bottom:.25rem}.bd-callout p:last-child{margin-bottom:0}.bd-callout+.bd-callout{margin-top:-.25rem}.bd-callout-info{border-left-color:#5bc0de}.bd-callout-info h4{color:#5bc0de}.bd-callout-warning{border-left-color:#f0ad4e}.bd-callout-warning h4{color:#f0ad4e}.bd-callout-danger{border-left-color:#d9534f}.bd-callout-danger h4{color:#d9534f}.bd-examples .img-thumbnail{margin-bottom:.75rem}.bd-examples h4{margin-bottom:.25rem}.bd-examples p{margin-bottom:1.25rem}@media (max-width:480px){.bd-examples{margin-right:-.75rem;margin-left:-.75rem}.bd-examples>[class^=col-]{padding-right:.75rem;padding-left:.75rem}}.bd-team{margin-bottom:1.5rem}.bd-team .team-member{line-height:2rem;color:#555}.bd-team .team-member:hover{color:#333;text-decoration:none}.bd-team .github-btn{float:right;width:180px;height:1.25rem;margin-top:.25rem}.bd-team img,.color-swatch{float:left;border-radius:.25rem}.bd-team img{width:2rem;margin-right:.5rem}.bd-browser-bugs td p{margin-bottom:0}.bd-browser-bugs th:first-child{width:18%}.bd-brand-logos{display:table;width:100%;margin-bottom:1rem;overflow:hidden;color:#563d7c;background-color:#f9f9f9}.bd-brand-logos .inverse,.color-swatches .bd-purple{background-color:#563d7c}.bd-brand-item{padding:4rem 0}.bd-brand-item+.bd-brand-item{border-top:1px solid #fff}.bd-brand-logos .inverse{color:#fff}.bd-brand-item h1,.bd-brand-item h3{margin-top:0;margin-bottom:0}.bd-brand-item .bd-booticon{margin-right:auto;margin-left:auto}@media (min-width:768px){.bd-brand-item{display:table-cell;width:1%}.bd-brand-item+.bd-brand-item{border-top:0;border-left:1px solid #fff}.bd-brand-item h1{font-size:4rem}}.color-swatches{margin:0 -5px;overflow:hidden}.color-swatch{width:4rem;height:4rem;margin-right:.25rem;margin-left:.25rem}.color-swatches .bd-purple-light{background-color:#cdbfe3}.color-swatches .bd-purple-lighter{background-color:#e5e1ea}.color-swatches .bd-gray{background-color:#f9f9f9}.zero-clipboard{position:relative;display:none;float:right}.btn-clipboard{position:absolute;top:.5rem;right:.5rem;z-index:10;display:block;padding:.25rem .5rem;font-size:75%;color:#818a91;cursor:pointer;background-color:transparent}.btn-clipboard-hover{color:#fff;background-color:#027de7}@media (min-width:768px){.color-swatch{width:6rem;height:6rem}.zero-clipboard{display:block}}.hll{background-color:#ffc}.c{color:#999}.err{color:#A00;background-color:#FAA}.k{color:#069}.o{color:#555}.cm{color:#999}.cp{color:#099}.c1,.cs{color:#999}.gd{background-color:#FCC;border:1px solid #C00}.gr{color:red}.gh{color:#030}.gi{background-color:#CFC;border:1px solid #0C0}.go{color:#AAA}.gp{color:#009}.gu{color:#030}.gt{color:#9C6}.kc,.kd,.kn,.kp,.kr{color:#069}.kt{color:#078}.m{color:#F60}.s{color:#d44950}.na{color:#4f9fcf}.nb{color:#366}.nc{color:#0A8}.no{color:#360}.nd{color:#99F}.ni{color:#999}.ne{color:#C00}.nf{color:#C0F}.nl{color:#99F}.nn{color:#0CF}.nt{color:#2f6f9f}.nv{color:#033}.ow{color:#000}.w{color:#bbb}.mf,.mh,.mi,.mo{color:#F60}.s2,.sb,.sc,.sd,.se,.sh{color:#C30}.si{color:#A00}.sx{color:#C30}.sr{color:#3AA}.s1{color:#C30}.ss{color:#FC3}.bp{color:#366}.vc,.vg,.vi{color:#033}.il{color:#F60}.css .nt+.nt,.css .o,.css .o+.nt{color:#999}.anchorjs-link{color:inherit}@media (max-width:480px){.anchorjs-link{display:none}}:hover>.anchorjs-link{opacity:.75;-webkit-transition:color .16s linear;-o-transition:color .16s linear;transition:color .16s linear}.anchorjs-link:focus,:hover>.anchorjs-link:hover{text-decoration:none;opacity:1}
/*# sourceMappingURL=docs.min.css.map */
\ No newline at end of file
This diff was suppressed by a .gitattributes entry.
......@@ -3,43 +3,14 @@
// Custom buttons for the docs.
.btn-bs {
color: $bd-purple;
border-color: $bd-purple;
color: $bd-purple-bright;
border-color: $bd-purple-bright;
&:hover,
&:focus,
&:active {
color: #fff;
background-color:$bd-purple;
border-color: $bd-purple;
background-color:$bd-purple-bright;
border-color: $bd-purple-bright;
}
}
// .btn-outline {
// color: $bd-purple;
// background-color: transparent;
// border-color: $bd-purple;
//
// &:hover,
// &:focus,
// &:active {
// color: #fff;
// background-color:$bd-purple;
// border-color: $bd-purple;
// }
// }
//
// .btn-outline-inverse {
// color: #fff;
// background-color: transparent;
// border-color: $bd-purple-light;
//
// &:hover,
// &:focus,
// &:active {
// color: $bd-purple;
// text-shadow: none;
// background-color: #fff;
// border-color: #fff;
// }
// }
//
// Home navigation
//
.bd-nav-home {
margin-bottom: 0;
background-color: #563d7c;
border-bottom: 0;
.navbar-brand > a {
font-weight: 500;
color: #fff;
}
.nav-link {
font-weight: 500;
color: #cdbfe3;
&:hover,
&:focus {
color: #fff;
background-color: rgba(0,0,0,.5);
}
}
}
//
// Homepage
// Main navbar
//
.bd-navbar {
padding: .25rem;
padding-top: 1rem;
padding-bottom: 1rem;
margin-bottom: 0;
background-color: $bd-graphite;
// background-color: $bd-graphite;
.nav-link {
color: $bd-graphite-light;
......@@ -40,50 +14,16 @@
&.active,
&:hover,
&:focus {
color: #fff;
color: $gray-dark;
background-color: transparent;
}
&.active {
font-weight: 500;
}
}
}
//
// .bd-header {
// @include clearfix;
// padding-bottom: .5rem;
// margin-bottom: 1rem;
// border-bottom: 1px solid rgba(255,255,255,.25);
//
// .bd-header-mark {
// float: left;
// padding-top: .6rem;
// padding-bottom: .6rem;
// font-size: 1.25rem;
// font-weight: 500;
// }
// }
//
// .bd-header-nav {
// padding-bottom: 1rem;
// margin-bottom: 2rem;
// border-bottom: .0625rem solid #eee;
//
// .nav-link {
// display: inline-block;
// padding: 1.2rem .75rem;
//
// &:hover {
// background-color: transparent;
// }
// }
//
// @include media-breakpoint-up(sm) {
// float: right;
// padding-bottom: 0;
// margin-bottom: 0;
// border-bottom: 0;
// }
// }
//
// Masthead (headings and download button)
......@@ -92,15 +32,15 @@
.bd-masthead {
position: relative;
padding: ($grid-gutter-width / 2);
color: $bd-graphite-light;
color: $bd-purple-light;
text-align: center;
background: -webkit-linear-gradient(to bottom, $bd-graphite, lighten($bd-graphite, 7.5%));
background: linear-gradient(to bottom, $bd-graphite, lighten($bd-graphite, 7.5%));
background: -webkit-linear-gradient(135deg, darken($bd-purple, 15%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));
background: linear-gradient(135deg, darken($bd-purple, 15%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));
.bd-booticon {
margin: 0 auto 2rem;
color: $bd-purple-bright;
border-color: $bd-purple-bright;
color: $bd-purple-light;
border-color: $bd-purple-light;
}
h1 {
......@@ -112,7 +52,8 @@
margin-left: auto;
margin-right: auto;
margin-bottom: 2rem;
font-size: 1.25rem;
font-size: 1rem;
color: #fff;
}
.version {
......@@ -174,7 +115,7 @@
@include media-breakpoint-up(lg) {
.lead {
width: 80%;
width: 85%;
font-size: 2rem;
}
}
......
......@@ -3,65 +3,14 @@
//
.bd-sidebar {
// padding: 0;
// margin-bottom: 0;
// background-color: #fafafa;
// .navbar-toggler {
// position: absolute;
// top: 1rem;
// right: 0;
// z-index: 5;
// }
@include media-breakpoint-up(md) {
padding-left: 1rem;
}
}
// .bd-sidebar .navbar-header {
// float: none;
// margin-right: -15px;
// }
//
// .bd-sidebar .navbar-collapse {
// padding: 0;
// border: 0;
// }
// @media (min-width: 992px) {
// .bd-docs {
// margin-left: 240px;
// }
// .bd-sidebar {
// position: fixed;
// top: 3.7rem;
// bottom: 0;
// left: 0;
// width: 240px;
// overflow-y: auto;
// border-right: 1px solid #eee;
// -webkit-transform: translated3d(0,0,0); // Ensure proper scrolling of sidebar
// }
// }
//
// .bd-sidebar .navbar-brand {
// display: block;
// float: none;
// height: auto;
// padding: 1.55rem 1.25rem;
// font-size: 20px;
// font-weight: 500;
// line-height: 1;
// // color: #fff;
// }
// .bd-sidebar-brand:hover,
// .bd-sidebar-brand:focus {
// // color: #fff;
// text-decoration: none;
// }
.bd-search {
position: relative;
margin-right: 1.25rem;
margin-bottom: 1.5rem;
margin-left: 1.25rem;
.form-control {
height: 2.45rem;
......@@ -108,21 +57,17 @@
.bd-toc-link {
display: block;
padding: .25rem 1.25rem;
padding: .25rem .75rem;
color: $gray;
// font-size: 1rem;
// color: #fff;
}
.bd-toc-link:hover,
.bd-toc-link:focus {
// color: $bd-yellow;
color: $brand-primary;
text-decoration: none;
}
.active > .bd-toc-link {
font-weight: 500;
color: $gray-dark;
// color: $bd-yellow;
}
.active > .bd-sidenav {
display: block;
......@@ -142,14 +87,13 @@
// All levels of nav
.bd-sidebar .nav > li > a {
display: block;
padding: .25rem 1.25rem;
padding: .25rem .75rem;
font-size: 90%;
color: #99979c;
}
.bd-sidebar .nav > li > a:hover,
.bd-sidebar .nav > li > a:focus {
color: $brand-primary;
// color: $bd-yellow;
text-decoration: none;
background-color: transparent;
}
......@@ -158,34 +102,5 @@
.bd-sidebar .nav > .active:focus > a {
font-weight: 500;
color: $gray-dark;
// color: $bd-yellow;
background-color: transparent;
}
// Nav: second level (shown on .active)
.bd-sidebar .nav .nav {
display: none; // Hide by default, but at >768px, show it
padding-bottom: .75rem;
}
.bd-sidebar .nav .nav > li > a {
padding-top: 1px;
padding-bottom: 1px;
padding-left: 2rem;
font-size: 75%;
font-weight: normal;
}
.bd-sidebar .nav .nav > .active > a,
.bd-sidebar .nav .nav > .active:hover > a,
.bd-sidebar .nav .nav > .active:focus > a {
font-weight: 500;
}
.bd-sidebar .nav > .active > .nav {
display: block;
}
.bd-sidebar .nav .nav > li > a {
padding-top: .125rem;
padding-bottom: .125rem;
padding-left: 2rem;
font-size: 80%;
}
......@@ -28,7 +28,7 @@
// Local docs variables
$bd-purple: #563d7c;
$bd-purple-bright: lighten(saturate($bd-purple, 25%), 25%);
$bd-purple-bright: lighten(saturate($bd-purple, 15%), 25%);
$bd-purple-light: #cdbfe3;
$bd-graphite: #2a2730;
$bd-graphite-light: lighten($bd-graphite, 40%);
......
---
layout: page
layout: docs
title: Alerts
group: components
---
......
---
layout: page
layout: docs
title: Breadcrumb
group: components
---
......
---
layout: page
layout: docs
title: Button dropdown
group: components
---
......
---
layout: page
layout: docs
title: Button group
group: components
---
......
---
layout: page
layout: docs
title: Buttons
group: components
---
......
---
layout: page
layout: docs
title: Cards
group: components
---
......
---
layout: page
layout: docs
title: Carousel
group: components
---
......
---
layout: page
layout: docs
title: Collapse
group: components
---
......
---
layout: page
layout: docs
title: Dropdowns
group: components
---
......
---
layout: page
layout: docs
title: Forms
group: components
---
......
---
layout: page
layout: docs
title: Input group
group: components
---
......
---
layout: page
layout: docs
title: Jumbotron
group: components
---
......
---
layout: page
layout: docs
title: Labels
group: components
---
......
---
layout: page
layout: docs
title: List group
group: components
---
......
---
layout: page
layout: docs
title: Modal
group: components
---
......
---
layout: page
layout: docs
title: Navbar
group: components
---
......
---
layout: page
layout: docs
title: Navs
group: components
---
......
---
layout: page
layout: docs
title: Pagination
group: components
---
......
---
layout: page
layout: docs
title: Popovers
group: components
---
......
---
layout: page
layout: docs
title: Progress
group: components
---
......
---
layout: page
layout: docs
title: Srollspy
group: components
---
......
---
layout: page
layout: docs
title: Tooltips
group: components
---
......
---
layout: page
layout: docs
title: Utility classes
group: components
---
......
---
layout: page
layout: docs
title: Code
group: content
---
......
---
layout: page
layout: docs
title: Images
group: content
---
......
---
layout: page
layout: docs
title: Images
group: content
---
......
---
layout: page
layout: docs
title: Reboot
group: content
---
......
---
layout: page
layout: docs
title: Tables
group: content
---
......
---
layout: page
layout: docs
title: Typography
group: content
---
......
......@@ -580,8 +580,8 @@ mark,
}
.dl-horizontal {
margin-right: -1.5rem;
margin-left: -1.5rem;
margin-right: -1.875rem;
margin-left: -1.875rem;
}
.dl-horizontal:before,
......@@ -734,8 +734,8 @@ pre code {
}
.container {
padding-right: .75rem;
padding-left: .75rem;
padding-right: .9375rem;
padding-left: .9375rem;
margin-right: auto;
margin-left: auto;
}
......@@ -775,8 +775,8 @@ pre code {
}
.container-fluid {
padding-right: .75rem;
padding-left: .75rem;
padding-right: .9375rem;
padding-left: .9375rem;
margin-right: auto;
margin-left: auto;
}
......@@ -792,8 +792,8 @@ pre code {
}
.row {
margin-right: -.75rem;
margin-left: -.75rem;
margin-right: -.9375rem;
margin-left: -.9375rem;
}
.row:before,
......@@ -809,8 +809,8 @@ pre code {
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
position: relative;
min-height: 1px;
padding-right: .75rem;
padding-left: .75rem;
padding-right: .9375rem;
padding-left: .9375rem;
}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
......@@ -3596,31 +3596,13 @@ input[type="button"].btn-block {
list-style: none;
}
.nav:before,
.nav:after {
display: table;
content: " ";
}
.nav:after {
clear: both;
}
.nav-item {
position: relative;
display: inline-block;
}
.nav-link {
display: inline-block;
padding: .75em 1em;
line-height: 1;
}
.nav-link:focus,
.nav-link:hover {
text-decoration: none;
background-color: #eceeef;
}
.disabled > .nav-link,
......@@ -3639,6 +3621,10 @@ input[type="button"].btn-block {
background-color: transparent;
}
.nav-inline .nav-link + .nav-link {
margin-left: 1rem;
}
.nav-tabs {
border-bottom: 1px solid #ddd;
}
......@@ -3654,6 +3640,7 @@ input[type="button"].btn-block {
.nav-tabs .nav-link {
display: block;
padding: .75em 1em;
border: 1px solid transparent;
border-radius: .25rem .25rem 0 0;
}
......@@ -3701,6 +3688,7 @@ input[type="button"].btn-block {
.nav-pills .nav-link {
display: block;
padding: .75em 1em;
border-radius: .25rem;
}
......@@ -5974,39 +5962,39 @@ a.text-primary:hover {
}
.text-success {
color: #3c763d;
color: #5cb85c;
}
a.text-success:focus,
a.text-success:hover {
color: #2b542c;
color: #449d44;
}
.text-info {
color: #31708f;
color: #5bc0de;
}
a.text-info:focus,
a.text-info:hover {
color: #245269;
color: #31b0d5;
}
.text-warning {
color: #8a6d3b;
color: #f0ad4e;
}
a.text-warning:focus,
a.text-warning:hover {
color: #66512c;
color: #ec971f;
}
.text-danger {
color: #a94442;
color: #d9534f;
}
a.text-danger:focus,
a.text-danger:hover {
color: #843534;
color: #c9302c;
}
.inverse {
......@@ -6016,9 +6004,6 @@ a.text-danger:hover {
.bg-primary {
color: #fff;
}
.bg-primary {
background-color: #0275d8;
}
......@@ -6028,243 +6013,288 @@ a.bg-primary:hover {
}
.bg-success {
background-color: #dff0d8;
color: #fff;
background-color: #5cb85c;
}
a.bg-success:focus,
a.bg-success:hover {
background-color: #c1e2b3;
background-color: #449d44;
}
.bg-info {
background-color: #d9edf7;
color: #fff;
background-color: #5bc0de;
}
a.bg-info:focus,
a.bg-info:hover {
background-color: #afd9ee;
background-color: #31b0d5;
}
.bg-warning {
background-color: #fcf8e3;
color: #fff;
background-color: #f0ad4e;
}
a.bg-warning:focus,
a.bg-warning:hover {
background-color: #f7ecb5;
background-color: #ec971f;
}
.bg-danger {
background-color: #f2dede;
color: #fff;
background-color: #d9534f;
}
a.bg-danger:focus,
a.bg-danger:hover {
background-color: #e4b9b9;
background-color: #c9302c;
}
.m-a-0 {
margin: 0;
margin: 0 !important;
}
.m-t-0 {
margin-top: 0;
margin-top: 0 !important;
}
.m-r-0 {
margin-right: 0;
margin-right: 0 !important;
}
.m-b-0 {
margin-bottom: 0;
margin-bottom: 0 !important;
}
.m-l-0 {
margin-left: 0;
margin-left: 0 !important;
}
.m-x-0 {
margin-right: 0 !important;
margin-left: 0 !important;
}
.m-y-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.m-a {
margin: 1rem;
margin: 1rem !important;
}
.m-t {
margin-top: 1rem;
margin-top: 1rem !important;
}
.m-r {
margin-right: 1rem;
margin-right: 1rem !important;
}
.m-b {
margin-bottom: 1rem;
margin-bottom: 1rem !important;
}
.m-l {
margin-left: 1rem;
margin-left: 1rem !important;
}
.m-x {
margin-right: 1rem;
margin-left: 1rem;
margin-right: 1rem !important;
margin-left: 1rem !important;
}
.m-y {
margin-top: 1rem;
margin-bottom: 1rem;
margin-top: 1rem !important;
margin-bottom: 1rem !important;
}
.m-x-auto {
margin-right: auto !important;
margin-left: auto !important;
}
.m-a-md {
margin: 1.5rem !important;
}
.m-t-md {
margin-top: 1.5rem;
margin-top: 1.5rem !important;
}
.m-r-md {
margin-right: 1.5rem;
margin-right: 1.5rem !important;
}
.m-b-md {
margin-bottom: 1.5rem;
margin-bottom: 1.5rem !important;
}
.m-l-md {
margin-left: 1.5rem;
margin-left: 1.5rem !important;
}
.m-x-md {
margin-right: 1.5rem;
margin-left: 1.5rem;
margin-right: 1.5rem !important;
margin-left: 1.5rem !important;
}
.m-y-md {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
margin-top: 1.5rem !important;
margin-bottom: 1.5rem !important;
}
.m-a-lg {
margin: 3rem !important;
}
.m-t-lg {
margin-top: 3rem;
margin-top: 3rem !important;
}
.m-r-lg {
margin-right: 3rem;
margin-right: 3rem !important;
}
.m-b-lg {
margin-bottom: 3rem;
margin-bottom: 3rem !important;
}
.m-l-lg {
margin-left: 3rem;
margin-left: 3rem !important;
}
.m-x-lg {
margin-right: 3rem;
margin-left: 3rem;
margin-right: 3rem !important;
margin-left: 3rem !important;
}
.m-y-lg {
margin-top: 3rem;
margin-bottom: 3rem;
margin-top: 3rem !important;
margin-bottom: 3rem !important;
}
.p-a-0 {
padding: 0;
padding: 0 !important;
}
.p-t-0 {
padding-top: 0;
padding-top: 0 !important;
}
.p-r-0 {
padding-right: 0;
padding-right: 0 !important;
}
.p-b-0 {
padding-bottom: 0;
padding-bottom: 0 !important;
}
.p-l-0 {
padding-left: 0;
padding-left: 0 !important;
}
.p-x-0 {
padding-right: 0 !important;
padding-left: 0 !important;
}
.p-y-0 {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.p-a {
padding: 1rem;
padding: 1rem !important;
}
.p-t {
padding-top: 1rem;
padding-top: 1rem !important;
}
.p-r {
padding-right: 1rem;
padding-right: 1rem !important;
}
.p-b {
padding-bottom: 1rem;
padding-bottom: 1rem !important;
}
.p-l {
padding-left: 1rem;
padding-left: 1rem !important;
}
.p-x {
padding-right: 1rem;
padding-left: 1rem;
padding-right: 1rem !important;
padding-left: 1rem !important;
}
.p-y {
padding-top: 1rem;
padding-bottom: 1rem;
padding-top: 1rem !important;
padding-bottom: 1rem !important;
}
.p-a-md {
padding: 1.5rem !important;
}
.p-t-md {
padding-top: 1.5rem;
padding-top: 1.5rem !important;
}
.p-r-md {
padding-right: 1.5rem;
padding-right: 1.5rem !important;
}
.p-b-md {
padding-bottom: 1.5rem;
padding-bottom: 1.5rem !important;
}
.p-l-md {
padding-left: 1.5rem;
padding-left: 1.5rem !important;
}
.p-x-md {
padding-right: 1.5rem;
padding-left: 1.5rem;
padding-right: 1.5rem !important;
padding-left: 1.5rem !important;
}
.p-y-md {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
padding-top: 1.5rem !important;
padding-bottom: 1.5rem !important;
}
.p-a-lg {
padding: 3rem !important;
}
.p-t-lg {
padding-top: 3rem;
padding-top: 3rem !important;
}
.p-r-lg {
padding-right: 3rem;
padding-right: 3rem !important;
}
.p-b-lg {
padding-bottom: 3rem;
padding-bottom: 3rem !important;
}
.p-l-lg {
padding-left: 3rem;
padding-left: 3rem !important;
}
.p-x-lg {
padding-right: 3rem;
padding-left: 3rem;
padding-right: 3rem !important;
padding-left: 3rem !important;
}
.p-y-lg {
padding-top: 3rem;
padding-bottom: 3rem;
padding-top: 3rem !important;
padding-bottom: 3rem !important;
}
.pos-f-t {
......
This diff was suppressed by a .gitattributes entry.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff was suppressed by a .gitattributes entry.
......@@ -3,8 +3,6 @@ layout: simple
title: Examples
---
Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.
[Download the Bootstrap source code]({{ site.download.source }}) to snag these examples.
## Framework
......
---
layout: page
layout: docs
title: Approach
---
---
layout: page
layout: docs
title: Icon fonts
---
---
layout: page
layout: docs
title: Extend
---
......
---
layout: page
layout: docs
title: Accessibility
group: getting-started
---
......
---
layout: page
layout: docs
title: Best practices
group: getting-started
---
......
---
layout: page
layout: docs
title: Browsers and devices
group: getting-started
---
......
---
layout: page
layout: docs
title: Build tools
group: getting-started
---
......
---
layout: page
layout: docs
title: Contents
group: getting-started
---
......
---
layout: page
layout: docs
title: Download
group: getting-started
---
......
---
layout: page
layout: docs
title: Flexbox
group: getting-started
---
......
---
layout: page
layout: docs
title: Introduction
group: getting-started
---
......
---
layout: page
layout: docs
title: JavaScript
group: getting-started
---
......
---
layout: page
layout: docs
title: Customization options
group: getting-started
---
......
---
layout: page
title: Quick start
group: getting-started
---
Looking to quickly add Bootstrap to your project? Use the Bootstrap CDN, provided for free by the folks at MaxCDN. Using a package manager or need to download the source files? [Head to the downloads page.]({{ site.baseurl }}/getting-started/download)
Copy-paste the stylesheet `<link>` into your `<head>` before all other stylesheets to load our CSS.
{% highlight html %}
<link rel="stylesheet" href="{{ site.cdn.css }}">
{% endhighlight %}
Add our JavaScript plugins and jQuery near the end of your pages, right before the closing `</body>` tag. Be sure to place jQuery first as our code depends on it.
{% highlight html %}
<script src="{{ site.cdn.jquery }}"></script>
<script src="{{ site.cdn.js }}"></script>
{% endhighlight %}
And that's it—you're your way to a fully Bootstrapped site. If you're at all unsure about the general page structure, keep reading for an example page template.
## Page template
Be sure to have your pages set up with the latest design and development standards. That means:
* Using an HTML5 doctype
* Forcing Internet Explorer to use its latest rendering mode ([read more]())
* And, utilizing the viewport meta tag.
Put it all together and your pages should look like this:
{% highlight html %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="{{ site.cdn.css }}">
</head>
<body>
<h1>Hello, world!</h1>
<!-- jQuery first, then Bootstrap JS. -->
<script src="{{ site.cdn.jquery }}"></script>
<script src="{{ site.cdn.js }}"></script>
</body>
</html>
{% endhighlight %}
That's all you need for overall page requirements. Visit the [Layout docs]({{ site.baseurl }}/layout/scaffolding) to start laying out your site's content before adding components.
......@@ -5,9 +5,8 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<main class="bd-masthead" id="content" role="main">
<div class="container">
<span class="bd-booticon outline">B</span>
<p class="lead">Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.</p>
<p class="lead">Bootstrap is the most popular HTML, CSS, and JS framework in the world for building responsive, mobile-first projects on the web.</p>
<p class="lead">
<a href="{{ site.baseurl }}/getting-started/download" class="btn btn-outline-inverse btn-lg" onclick="ga('send', 'event', 'Jumbotron actions', 'Download', 'Download {{ site.current_version }}');">Download Bootstrap</a>
</p>
......@@ -19,25 +18,16 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<div class="bd-featurette">
<div class="container">
<h2 class="bd-featurette-title">Easy to get started.</h2>
<p class="lead">Quickly include Bootstrap's CSS and JS into any project. Use your favorite package manager, download the source, or use the <a href="#">Bootstrap CDN</a>.</p>
<!-- <hr class="half-rule"> -->
<p class="lead">Quickly include Bootstrap's CSS and JS into any project. Use your favorite package manager, download the source, or use the Bootstrap CDN.</p>
<div class="row">
<div class="col-sm-6">
<h4>Managed dependencies</h4>
<p>Include Bootstrap's source Sass and JavaScript files via Bower, Composer, Meteor, or npm. Package managed installs don't include documentation, but do include our Gruntfile and readme.</p>
<p>
<a class="btn btn-bs btn-outline" href="">View install methods</a>
<a class="btn btn-bs btn-outline" href="{{ site.baseurl }}/getting-started/download/#package-managers">View install methods</a>
</p>
</div>
<!-- <div class="col-sm-4">
<h4>Custom builds</h4>
<p>Need just a part of Bootstrap? Download a custom build of the compiled CSS and JS.</p>
<a class="btn btn-secondary" href="#">Reboot</a>
<a class="btn btn-secondary" href="#">Grid system</a>
<a class="btn btn-secondary" href="#">Flexbox</a>
</div> -->
<div class="col-sm-6">
<h4>Bootstrap CDN</h4>
<p>When you just need to include Bootstrap's compiled CSS and JS, use the Bootstrap CDN, free from the Max CDN folks.</p>
......@@ -50,8 +40,8 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<hr class="half-rule">
<p class="lead">More customized builds of Bootstrap's CSS and JS are also available.</p>
<a href="{{ site.baseurl }}/getting-started/download" class="btn btn-bs btn-outline btn-lg">More download options</a>
<p><strong>Looking for something simpler?</strong> Customized builds of Bootstrap's CSS and JS are also available.</p>
<a href="{{ site.baseurl }}/getting-started/download/#custom-builds" class="btn btn-bs btn-outline">More download options</a>
</div>
</div>
......@@ -60,8 +50,6 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<h2 class="bd-featurette-title">Designed for everyone, everywhere.</h2>
<p class="lead">Bootstrap makes front-end web development faster and easier. It's made for folks of all skill levels, devices of all shapes, and projects of all sizes.</p>
<hr class="half-rule">
<div class="row">
<div class="col-sm-4">
<img src="assets/img/sass-less.png" alt="Sass support" class="img-responsive">
......@@ -82,8 +70,8 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<hr class="half-rule">
<p class="lead">Bootstrap is open source. It's hosted, developed, and maintained on GitHub.</p>
<a href="{{ site.repo }}" class="btn btn-bs btn-outline btn-lg">View the GitHub project</a>
<p><strong>Bootstrap is open source!</strong> It's hosted, developed, and maintained on GitHub by folks like you.</p>
<a href="{{ site.repo }}" class="btn btn-bs btn-outline">View the GitHub project</a>
</div>
</div>
......@@ -92,8 +80,6 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<h2 class="bd-featurette-title">Built with Bootstrap.</h2>
<p class="lead">Millions of amazing sites across the web are being built with Bootstrap. Get started on your own with our growing <a href="../getting-started/#examples">collection of examples</a> or by exploring some of our favorites.</p>
<hr class="half-rule">
<div class="row bd-featured-sites">
{% for showcase in site.data.showcase %}
<div class="col-xs-6 col-sm-3">
......@@ -106,7 +92,7 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
<hr class="half-rule">
<p class="lead">We showcase dozens of inspiring projects built with Bootstrap on the Bootstrap Expo.</p>
<a href="{{ site.expo }}" class="btn btn-bs btn-outline btn-lg">Explore the Expo</a>
<p>We showcase dozens of inspiring projects built with Bootstrap on the Bootstrap Expo.</p>
<a href="{{ site.expo }}" class="btn btn-bs btn-outline">Explore the Expo</a>
</div>
</div>
---
layout: page
layout: docs
title: Grid system
group: layout
---
......
---
layout: page
layout: docs
title: Media object
group: layout
---
......
---
layout: page
layout: docs
title: Overview
group: layout
---
......
---
layout: page
layout: docs
title: Responsive utilities
group: layout
---
......
---
layout: page
layout: docs
title: Scaffolding
group: layout
---
......
---
layout: page
layout: docs
title: Migrating to v4
group: migration
---
......
......@@ -2,34 +2,20 @@
// Navs
// --------------------------------------------------
//
// Base styles
//
.nav {
padding-left: 0;
margin-bottom: 0;
list-style: none;
@include clearfix();
}
.nav-item {
position: relative;
display: inline-block;
}
.nav-link {
display: inline-block;
padding: $nav-link-padding;
line-height: 1;
@include hover-focus {
text-decoration: none;
background-color: $nav-link-hover-bg;
}
// Disabled state sets text to gray and nukes hover/tab effects
// Disabled state lightens text and removes hover/tab effects
.disabled > &,
&.disabled {
color: $nav-disabled-link-color;
......@@ -43,6 +29,53 @@
}
// Nav inline
.nav-inline {
.nav-link + .nav-link {
margin-left: 1rem;
}
}
//
// Base styles
//
// .nav {
// padding-left: 0;
// margin-bottom: 0;
// list-style: none;
// @include clearfix();
// }
//
// .nav-item {
// position: relative;
// display: inline-block;
// }
//
// .nav-link {
// display: inline-block;
//
// @include hover-focus {
// text-decoration: none;
// background-color: $nav-link-hover-bg;
// }
//
// // Disabled state sets text to gray and nukes hover/tab effects
// .disabled > &,
// &.disabled {
// color: $nav-disabled-link-color;
//
// @include plain-hover-focus {
// color: $nav-disabled-link-hover-color;
// cursor: $cursor-disabled;
// background-color: transparent;
// }
// }
// }
//
// Tabs
//
......@@ -62,6 +95,7 @@
.nav-link {
display: block;
padding: $nav-link-padding;
border: 1px solid transparent;
@include border-radius($border-radius $border-radius 0 0);
......@@ -107,6 +141,7 @@
.nav-link {
display: block;
padding: $nav-link-padding;
@include border-radius($nav-pills-border-radius);
}
......
......@@ -115,7 +115,7 @@ $container-max-widths: (
// Set the number of columns and specify the width of the gutters.
$grid-columns: 12 !default;
$grid-gutter-width: 1.5rem !default;
$grid-gutter-width: 1.875rem !default; // 30px
// Typography
......
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