mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-01 13:24:25 +01:00
Merge branch 'v4-dev' of github.com:twbs/bootstrap into v4-dev
This commit is contained in:
Mark Otto
commit
49fadbd4b8
11
Gruntfile.js
11
Gruntfile.js
@ -184,8 +184,15 @@ module.exports = function (grunt) {
|
||||
]
|
||||
},
|
||||
docs: {
|
||||
src: 'docs/assets/css/docs.min.css',
|
||||
dest: 'docs/assets/css/docs.min.css'
|
||||
files: [
|
||||
{
|
||||
expand: true,
|
||||
cwd: 'docs/assets/css',
|
||||
src: ['*.css', '!*.min.css'],
|
||||
dest: 'docs/assets/css',
|
||||
ext: '.min.css'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -3812,24 +3812,6 @@ input[type="button"].btn-block {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media (min-width: 544px) {
|
||||
.navbar-toggleable-xs {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.navbar-toggleable-sm {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.navbar-toggleable-md {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-nav .nav-item {
|
||||
float: left;
|
||||
}
|
||||
@ -3914,6 +3896,63 @@ input[type="button"].btn-block {
|
||||
background-color: rgba(255, 255, 255, 0.075);
|
||||
}
|
||||
|
||||
.navbar-toggleable-xs::after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 543px) {
|
||||
.navbar-toggleable-xs .navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 544px) {
|
||||
.navbar-toggleable-xs {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-toggleable-sm::after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.navbar-toggleable-sm .navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.navbar-toggleable-sm {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-toggleable-md::after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.navbar-toggleable-md .navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.navbar-toggleable-md {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
2
dist/css/bootstrap.css.map
vendored
2
dist/css/bootstrap.css.map
vendored
File diff suppressed because one or more lines are too long
2
dist/css/bootstrap.min.css
vendored
2
dist/css/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
2
dist/css/bootstrap.min.css.map
vendored
2
dist/css/bootstrap.min.css.map
vendored
File diff suppressed because one or more lines are too long
@ -1,3 +1,13 @@
|
||||
-
|
||||
browser: >
|
||||
Microsoft Edge
|
||||
summary: >
|
||||
Dynamically generated `<label><input type="file"></label>` causes infinite loop of file dialogs.
|
||||
upstream_bug: >
|
||||
Edge#8282613
|
||||
origin: >
|
||||
Bootstrap#20335
|
||||
|
||||
-
|
||||
browser: >
|
||||
Microsoft Edge
|
||||
|
||||
@ -15,6 +15,9 @@
|
||||
<!-- Bootstrap core CSS -->
|
||||
{% if site.github %}
|
||||
<link href="{{ site.baseurl }}/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
{% if page.title == "Flexbox grid system" %}
|
||||
<link href="{{ site.baseurl }}/assets/css/docs-flexbox.min.css" rel="stylesheet">
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<link href="{{ site.baseurl }}/dist/css/bootstrap.css" rel="stylesheet">
|
||||
{% endif %}
|
||||
|
||||
968
docs/assets/css/docs-flexbox.min.css
vendored
Normal file
968
docs/assets/css/docs-flexbox.min.css
vendored
Normal file
@ -0,0 +1,968 @@
|
||||
.container {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
@media (min-width: 544px) {
|
||||
.container {
|
||||
max-width: 576px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
max-width: 720px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
max-width: 940px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
|
||||
.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: 15px;
|
||||
padding-left: 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.col-xs {
|
||||
position: relative;
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.col-xs-1 {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
|
||||
.col-xs-2 {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
|
||||
.col-xs-3 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
|
||||
.col-xs-4 {
|
||||
flex: 0 0 33.333333%;
|
||||
max-width: 33.333333%;
|
||||
}
|
||||
|
||||
.col-xs-5 {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
|
||||
.col-xs-6 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
.col-xs-7 {
|
||||
flex: 0 0 58.333333%;
|
||||
max-width: 58.333333%;
|
||||
}
|
||||
|
||||
.col-xs-8 {
|
||||
flex: 0 0 66.666667%;
|
||||
max-width: 66.666667%;
|
||||
}
|
||||
|
||||
.col-xs-9 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
|
||||
.col-xs-10 {
|
||||
flex: 0 0 83.333333%;
|
||||
max-width: 83.333333%;
|
||||
}
|
||||
|
||||
.col-xs-11 {
|
||||
flex: 0 0 91.666667%;
|
||||
max-width: 91.666667%;
|
||||
}
|
||||
|
||||
.col-xs-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.pull-xs-0 {
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.pull-xs-1 {
|
||||
right: 8.333333%;
|
||||
}
|
||||
|
||||
.pull-xs-2 {
|
||||
right: 16.666667%;
|
||||
}
|
||||
|
||||
.pull-xs-3 {
|
||||
right: 25%;
|
||||
}
|
||||
|
||||
.pull-xs-4 {
|
||||
right: 33.333333%;
|
||||
}
|
||||
|
||||
.pull-xs-5 {
|
||||
right: 41.666667%;
|
||||
}
|
||||
|
||||
.pull-xs-6 {
|
||||
right: 50%;
|
||||
}
|
||||
|
||||
.pull-xs-7 {
|
||||
right: 58.333333%;
|
||||
}
|
||||
|
||||
.pull-xs-8 {
|
||||
right: 66.666667%;
|
||||
}
|
||||
|
||||
.pull-xs-9 {
|
||||
right: 75%;
|
||||
}
|
||||
|
||||
.pull-xs-10 {
|
||||
right: 83.333333%;
|
||||
}
|
||||
|
||||
.pull-xs-11 {
|
||||
right: 91.666667%;
|
||||
}
|
||||
|
||||
.pull-xs-12 {
|
||||
right: 100%;
|
||||
}
|
||||
|
||||
.push-xs-0 {
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.push-xs-1 {
|
||||
left: 8.333333%;
|
||||
}
|
||||
|
||||
.push-xs-2 {
|
||||
left: 16.666667%;
|
||||
}
|
||||
|
||||
.push-xs-3 {
|
||||
left: 25%;
|
||||
}
|
||||
|
||||
.push-xs-4 {
|
||||
left: 33.333333%;
|
||||
}
|
||||
|
||||
.push-xs-5 {
|
||||
left: 41.666667%;
|
||||
}
|
||||
|
||||
.push-xs-6 {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.push-xs-7 {
|
||||
left: 58.333333%;
|
||||
}
|
||||
|
||||
.push-xs-8 {
|
||||
left: 66.666667%;
|
||||
}
|
||||
|
||||
.push-xs-9 {
|
||||
left: 75%;
|
||||
}
|
||||
|
||||
.push-xs-10 {
|
||||
left: 83.333333%;
|
||||
}
|
||||
|
||||
.push-xs-11 {
|
||||
left: 91.666667%;
|
||||
}
|
||||
|
||||
.push-xs-12 {
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.offset-xs-1 {
|
||||
margin-left: 8.333333%;
|
||||
}
|
||||
|
||||
.offset-xs-2 {
|
||||
margin-left: 16.666667%;
|
||||
}
|
||||
|
||||
.offset-xs-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
|
||||
.offset-xs-4 {
|
||||
margin-left: 33.333333%;
|
||||
}
|
||||
|
||||
.offset-xs-5 {
|
||||
margin-left: 41.666667%;
|
||||
}
|
||||
|
||||
.offset-xs-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
.offset-xs-7 {
|
||||
margin-left: 58.333333%;
|
||||
}
|
||||
|
||||
.offset-xs-8 {
|
||||
margin-left: 66.666667%;
|
||||
}
|
||||
|
||||
.offset-xs-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
|
||||
.offset-xs-10 {
|
||||
margin-left: 83.333333%;
|
||||
}
|
||||
|
||||
.offset-xs-11 {
|
||||
margin-left: 91.666667%;
|
||||
}
|
||||
|
||||
@media (min-width: 544px) {
|
||||
.col-sm {
|
||||
position: relative;
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.col-sm-1 {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
.col-sm-2 {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
.col-sm-3 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-sm-4 {
|
||||
flex: 0 0 33.333333%;
|
||||
max-width: 33.333333%;
|
||||
}
|
||||
.col-sm-5 {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
.col-sm-6 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-sm-7 {
|
||||
flex: 0 0 58.333333%;
|
||||
max-width: 58.333333%;
|
||||
}
|
||||
.col-sm-8 {
|
||||
flex: 0 0 66.666667%;
|
||||
max-width: 66.666667%;
|
||||
}
|
||||
.col-sm-9 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-sm-10 {
|
||||
flex: 0 0 83.333333%;
|
||||
max-width: 83.333333%;
|
||||
}
|
||||
.col-sm-11 {
|
||||
flex: 0 0 91.666667%;
|
||||
max-width: 91.666667%;
|
||||
}
|
||||
.col-sm-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.pull-sm-0 {
|
||||
right: auto;
|
||||
}
|
||||
.pull-sm-1 {
|
||||
right: 8.333333%;
|
||||
}
|
||||
.pull-sm-2 {
|
||||
right: 16.666667%;
|
||||
}
|
||||
.pull-sm-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.pull-sm-4 {
|
||||
right: 33.333333%;
|
||||
}
|
||||
.pull-sm-5 {
|
||||
right: 41.666667%;
|
||||
}
|
||||
.pull-sm-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.pull-sm-7 {
|
||||
right: 58.333333%;
|
||||
}
|
||||
.pull-sm-8 {
|
||||
right: 66.666667%;
|
||||
}
|
||||
.pull-sm-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.pull-sm-10 {
|
||||
right: 83.333333%;
|
||||
}
|
||||
.pull-sm-11 {
|
||||
right: 91.666667%;
|
||||
}
|
||||
.pull-sm-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.push-sm-0 {
|
||||
left: auto;
|
||||
}
|
||||
.push-sm-1 {
|
||||
left: 8.333333%;
|
||||
}
|
||||
.push-sm-2 {
|
||||
left: 16.666667%;
|
||||
}
|
||||
.push-sm-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.push-sm-4 {
|
||||
left: 33.333333%;
|
||||
}
|
||||
.push-sm-5 {
|
||||
left: 41.666667%;
|
||||
}
|
||||
.push-sm-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.push-sm-7 {
|
||||
left: 58.333333%;
|
||||
}
|
||||
.push-sm-8 {
|
||||
left: 66.666667%;
|
||||
}
|
||||
.push-sm-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.push-sm-10 {
|
||||
left: 83.333333%;
|
||||
}
|
||||
.push-sm-11 {
|
||||
left: 91.666667%;
|
||||
}
|
||||
.push-sm-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.offset-sm-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
.offset-sm-1 {
|
||||
margin-left: 8.333333%;
|
||||
}
|
||||
.offset-sm-2 {
|
||||
margin-left: 16.666667%;
|
||||
}
|
||||
.offset-sm-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.offset-sm-4 {
|
||||
margin-left: 33.333333%;
|
||||
}
|
||||
.offset-sm-5 {
|
||||
margin-left: 41.666667%;
|
||||
}
|
||||
.offset-sm-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.offset-sm-7 {
|
||||
margin-left: 58.333333%;
|
||||
}
|
||||
.offset-sm-8 {
|
||||
margin-left: 66.666667%;
|
||||
}
|
||||
.offset-sm-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.offset-sm-10 {
|
||||
margin-left: 83.333333%;
|
||||
}
|
||||
.offset-sm-11 {
|
||||
margin-left: 91.666667%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.col-md {
|
||||
position: relative;
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.col-md-1 {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
.col-md-2 {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
.col-md-3 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-md-4 {
|
||||
flex: 0 0 33.333333%;
|
||||
max-width: 33.333333%;
|
||||
}
|
||||
.col-md-5 {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
.col-md-6 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-md-7 {
|
||||
flex: 0 0 58.333333%;
|
||||
max-width: 58.333333%;
|
||||
}
|
||||
.col-md-8 {
|
||||
flex: 0 0 66.666667%;
|
||||
max-width: 66.666667%;
|
||||
}
|
||||
.col-md-9 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-md-10 {
|
||||
flex: 0 0 83.333333%;
|
||||
max-width: 83.333333%;
|
||||
}
|
||||
.col-md-11 {
|
||||
flex: 0 0 91.666667%;
|
||||
max-width: 91.666667%;
|
||||
}
|
||||
.col-md-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.pull-md-0 {
|
||||
right: auto;
|
||||
}
|
||||
.pull-md-1 {
|
||||
right: 8.333333%;
|
||||
}
|
||||
.pull-md-2 {
|
||||
right: 16.666667%;
|
||||
}
|
||||
.pull-md-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.pull-md-4 {
|
||||
right: 33.333333%;
|
||||
}
|
||||
.pull-md-5 {
|
||||
right: 41.666667%;
|
||||
}
|
||||
.pull-md-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.pull-md-7 {
|
||||
right: 58.333333%;
|
||||
}
|
||||
.pull-md-8 {
|
||||
right: 66.666667%;
|
||||
}
|
||||
.pull-md-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.pull-md-10 {
|
||||
right: 83.333333%;
|
||||
}
|
||||
.pull-md-11 {
|
||||
right: 91.666667%;
|
||||
}
|
||||
.pull-md-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.push-md-0 {
|
||||
left: auto;
|
||||
}
|
||||
.push-md-1 {
|
||||
left: 8.333333%;
|
||||
}
|
||||
.push-md-2 {
|
||||
left: 16.666667%;
|
||||
}
|
||||
.push-md-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.push-md-4 {
|
||||
left: 33.333333%;
|
||||
}
|
||||
.push-md-5 {
|
||||
left: 41.666667%;
|
||||
}
|
||||
.push-md-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.push-md-7 {
|
||||
left: 58.333333%;
|
||||
}
|
||||
.push-md-8 {
|
||||
left: 66.666667%;
|
||||
}
|
||||
.push-md-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.push-md-10 {
|
||||
left: 83.333333%;
|
||||
}
|
||||
.push-md-11 {
|
||||
left: 91.666667%;
|
||||
}
|
||||
.push-md-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.offset-md-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
.offset-md-1 {
|
||||
margin-left: 8.333333%;
|
||||
}
|
||||
.offset-md-2 {
|
||||
margin-left: 16.666667%;
|
||||
}
|
||||
.offset-md-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.offset-md-4 {
|
||||
margin-left: 33.333333%;
|
||||
}
|
||||
.offset-md-5 {
|
||||
margin-left: 41.666667%;
|
||||
}
|
||||
.offset-md-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.offset-md-7 {
|
||||
margin-left: 58.333333%;
|
||||
}
|
||||
.offset-md-8 {
|
||||
margin-left: 66.666667%;
|
||||
}
|
||||
.offset-md-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.offset-md-10 {
|
||||
margin-left: 83.333333%;
|
||||
}
|
||||
.offset-md-11 {
|
||||
margin-left: 91.666667%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.col-lg {
|
||||
position: relative;
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.col-lg-1 {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
.col-lg-2 {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
.col-lg-3 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-lg-4 {
|
||||
flex: 0 0 33.333333%;
|
||||
max-width: 33.333333%;
|
||||
}
|
||||
.col-lg-5 {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
.col-lg-6 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-lg-7 {
|
||||
flex: 0 0 58.333333%;
|
||||
max-width: 58.333333%;
|
||||
}
|
||||
.col-lg-8 {
|
||||
flex: 0 0 66.666667%;
|
||||
max-width: 66.666667%;
|
||||
}
|
||||
.col-lg-9 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-lg-10 {
|
||||
flex: 0 0 83.333333%;
|
||||
max-width: 83.333333%;
|
||||
}
|
||||
.col-lg-11 {
|
||||
flex: 0 0 91.666667%;
|
||||
max-width: 91.666667%;
|
||||
}
|
||||
.col-lg-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.pull-lg-0 {
|
||||
right: auto;
|
||||
}
|
||||
.pull-lg-1 {
|
||||
right: 8.333333%;
|
||||
}
|
||||
.pull-lg-2 {
|
||||
right: 16.666667%;
|
||||
}
|
||||
.pull-lg-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.pull-lg-4 {
|
||||
right: 33.333333%;
|
||||
}
|
||||
.pull-lg-5 {
|
||||
right: 41.666667%;
|
||||
}
|
||||
.pull-lg-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.pull-lg-7 {
|
||||
right: 58.333333%;
|
||||
}
|
||||
.pull-lg-8 {
|
||||
right: 66.666667%;
|
||||
}
|
||||
.pull-lg-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.pull-lg-10 {
|
||||
right: 83.333333%;
|
||||
}
|
||||
.pull-lg-11 {
|
||||
right: 91.666667%;
|
||||
}
|
||||
.pull-lg-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.push-lg-0 {
|
||||
left: auto;
|
||||
}
|
||||
.push-lg-1 {
|
||||
left: 8.333333%;
|
||||
}
|
||||
.push-lg-2 {
|
||||
left: 16.666667%;
|
||||
}
|
||||
.push-lg-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.push-lg-4 {
|
||||
left: 33.333333%;
|
||||
}
|
||||
.push-lg-5 {
|
||||
left: 41.666667%;
|
||||
}
|
||||
.push-lg-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.push-lg-7 {
|
||||
left: 58.333333%;
|
||||
}
|
||||
.push-lg-8 {
|
||||
left: 66.666667%;
|
||||
}
|
||||
.push-lg-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.push-lg-10 {
|
||||
left: 83.333333%;
|
||||
}
|
||||
.push-lg-11 {
|
||||
left: 91.666667%;
|
||||
}
|
||||
.push-lg-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.offset-lg-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
.offset-lg-1 {
|
||||
margin-left: 8.333333%;
|
||||
}
|
||||
.offset-lg-2 {
|
||||
margin-left: 16.666667%;
|
||||
}
|
||||
.offset-lg-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.offset-lg-4 {
|
||||
margin-left: 33.333333%;
|
||||
}
|
||||
.offset-lg-5 {
|
||||
margin-left: 41.666667%;
|
||||
}
|
||||
.offset-lg-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.offset-lg-7 {
|
||||
margin-left: 58.333333%;
|
||||
}
|
||||
.offset-lg-8 {
|
||||
margin-left: 66.666667%;
|
||||
}
|
||||
.offset-lg-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.offset-lg-10 {
|
||||
margin-left: 83.333333%;
|
||||
}
|
||||
.offset-lg-11 {
|
||||
margin-left: 91.666667%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.col-xl {
|
||||
position: relative;
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.col-xl-1 {
|
||||
flex: 0 0 8.333333%;
|
||||
max-width: 8.333333%;
|
||||
}
|
||||
.col-xl-2 {
|
||||
flex: 0 0 16.666667%;
|
||||
max-width: 16.666667%;
|
||||
}
|
||||
.col-xl-3 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
.col-xl-4 {
|
||||
flex: 0 0 33.333333%;
|
||||
max-width: 33.333333%;
|
||||
}
|
||||
.col-xl-5 {
|
||||
flex: 0 0 41.666667%;
|
||||
max-width: 41.666667%;
|
||||
}
|
||||
.col-xl-6 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
.col-xl-7 {
|
||||
flex: 0 0 58.333333%;
|
||||
max-width: 58.333333%;
|
||||
}
|
||||
.col-xl-8 {
|
||||
flex: 0 0 66.666667%;
|
||||
max-width: 66.666667%;
|
||||
}
|
||||
.col-xl-9 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
.col-xl-10 {
|
||||
flex: 0 0 83.333333%;
|
||||
max-width: 83.333333%;
|
||||
}
|
||||
.col-xl-11 {
|
||||
flex: 0 0 91.666667%;
|
||||
max-width: 91.666667%;
|
||||
}
|
||||
.col-xl-12 {
|
||||
flex: 0 0 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.pull-xl-0 {
|
||||
right: auto;
|
||||
}
|
||||
.pull-xl-1 {
|
||||
right: 8.333333%;
|
||||
}
|
||||
.pull-xl-2 {
|
||||
right: 16.666667%;
|
||||
}
|
||||
.pull-xl-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.pull-xl-4 {
|
||||
right: 33.333333%;
|
||||
}
|
||||
.pull-xl-5 {
|
||||
right: 41.666667%;
|
||||
}
|
||||
.pull-xl-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.pull-xl-7 {
|
||||
right: 58.333333%;
|
||||
}
|
||||
.pull-xl-8 {
|
||||
right: 66.666667%;
|
||||
}
|
||||
.pull-xl-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.pull-xl-10 {
|
||||
right: 83.333333%;
|
||||
}
|
||||
.pull-xl-11 {
|
||||
right: 91.666667%;
|
||||
}
|
||||
.pull-xl-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.push-xl-0 {
|
||||
left: auto;
|
||||
}
|
||||
.push-xl-1 {
|
||||
left: 8.333333%;
|
||||
}
|
||||
.push-xl-2 {
|
||||
left: 16.666667%;
|
||||
}
|
||||
.push-xl-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.push-xl-4 {
|
||||
left: 33.333333%;
|
||||
}
|
||||
.push-xl-5 {
|
||||
left: 41.666667%;
|
||||
}
|
||||
.push-xl-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.push-xl-7 {
|
||||
left: 58.333333%;
|
||||
}
|
||||
.push-xl-8 {
|
||||
left: 66.666667%;
|
||||
}
|
||||
.push-xl-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.push-xl-10 {
|
||||
left: 83.333333%;
|
||||
}
|
||||
.push-xl-11 {
|
||||
left: 91.666667%;
|
||||
}
|
||||
.push-xl-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.offset-xl-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
.offset-xl-1 {
|
||||
margin-left: 8.333333%;
|
||||
}
|
||||
.offset-xl-2 {
|
||||
margin-left: 16.666667%;
|
||||
}
|
||||
.offset-xl-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.offset-xl-4 {
|
||||
margin-left: 33.333333%;
|
||||
}
|
||||
.offset-xl-5 {
|
||||
margin-left: 41.666667%;
|
||||
}
|
||||
.offset-xl-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.offset-xl-7 {
|
||||
margin-left: 58.333333%;
|
||||
}
|
||||
.offset-xl-8 {
|
||||
margin-left: 66.666667%;
|
||||
}
|
||||
.offset-xl-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.offset-xl-10 {
|
||||
margin-left: 83.333333%;
|
||||
}
|
||||
.offset-xl-11 {
|
||||
margin-left: 91.666667%;
|
||||
}
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=docs-flexbox.min.css.map */
|
||||
16
docs/assets/css/docs-flexbox.min.css.map
Normal file
16
docs/assets/css/docs-flexbox.min.css.map
Normal file
File diff suppressed because one or more lines are too long
1544
docs/assets/css/docs.min.css
vendored
1544
docs/assets/css/docs.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
24
docs/assets/scss/flex-grid.scss
Normal file
24
docs/assets/scss/flex-grid.scss
Normal file
@ -0,0 +1,24 @@
|
||||
// Bootstrap flexbox grid for our docs page
|
||||
|
||||
|
||||
//
|
||||
// Variables
|
||||
//
|
||||
|
||||
@import "custom";
|
||||
@import "variables";
|
||||
|
||||
// Override for flexbox mode
|
||||
$enable-flex: true;
|
||||
|
||||
|
||||
//
|
||||
// Grid mixins
|
||||
//
|
||||
|
||||
@import "mixins/clearfix";
|
||||
@import "mixins/breakpoints";
|
||||
@import "mixins/grid-framework";
|
||||
@import "mixins/grid";
|
||||
|
||||
@import "grid";
|
||||
@ -3812,24 +3812,6 @@ input[type="button"].btn-block {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media (min-width: 544px) {
|
||||
.navbar-toggleable-xs {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.navbar-toggleable-sm {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.navbar-toggleable-md {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-nav .nav-item {
|
||||
float: left;
|
||||
}
|
||||
@ -3914,6 +3896,63 @@ input[type="button"].btn-block {
|
||||
background-color: rgba(255, 255, 255, 0.075);
|
||||
}
|
||||
|
||||
.navbar-toggleable-xs::after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 543px) {
|
||||
.navbar-toggleable-xs .navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 544px) {
|
||||
.navbar-toggleable-xs {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-toggleable-sm::after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.navbar-toggleable-sm .navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.navbar-toggleable-sm {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-toggleable-md::after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.navbar-toggleable-md .navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.navbar-toggleable-md {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
2
docs/dist/css/bootstrap.css.map
vendored
2
docs/dist/css/bootstrap.css.map
vendored
File diff suppressed because one or more lines are too long
2
docs/dist/css/bootstrap.min.css
vendored
2
docs/dist/css/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
2
docs/dist/css/bootstrap.min.css.map
vendored
2
docs/dist/css/bootstrap.min.css.map
vendored
File diff suppressed because one or more lines are too long
@ -6,27 +6,10 @@ group: getting-started
|
||||
|
||||
**Bootstrap v{{ site.current_version}}** is available for download in several ways, including some of your favorite package managers. Choose from the options below to snag just what you need.
|
||||
|
||||
<div class="row m-t-2">
|
||||
<div class="col-sm-6">
|
||||
{% markdown %}
|
||||
### Compiled
|
||||
Download just the compiled and minified CSS and JavaScript. Doesn't include any documentation or original source files.
|
||||
|
||||
{% comment %}
|
||||
<a href="{{ site.download.dist }}" class="btn btn-bs btn-outline" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download compiled');">Download Bootstrap</a>
|
||||
{% endcomment %}
|
||||
<span class="text-muted">Coming soon!</span>
|
||||
{% endmarkdown %}
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
{% markdown %}
|
||||
### Source files
|
||||
Download everything: source Sass, JavaScript, and documentation files. **Requires a Sass compiler, [Autoprefixer](https://github.com/postcss/autoprefixer), [postcss-flexbugs-fixes](https://github.com/luisrudge/postcss-flexbugs-fixes), and [some setup]({{ site.baseurl }}/getting-started/build-tools/#tooling-setup).**
|
||||
|
||||
<a href="{{ site.download.source }}" class="btn btn-bs btn-outline" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download source');">Download source</a>
|
||||
{% endmarkdown %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
## Package managers
|
||||
|
||||
@ -100,6 +83,7 @@ PM> Install-Package bootstrap.sass -Pre
|
||||
|
||||
The `-Pre` is required until Bootstrap v4 has a stable release.
|
||||
|
||||
{% comment %}
|
||||
## Custom builds
|
||||
|
||||
Need only a part of Bootstrap's CSS or JS? Use one of the custom builds to snag just what you need.
|
||||
@ -121,4 +105,4 @@ Need only a part of Bootstrap's CSS or JS? Use one of the custom builds to snag
|
||||
<a class="btn btn-bs btn-outline" href="#">Download</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endcomment %}
|
||||
|
||||
@ -37,4 +37,4 @@ You can find and customize these variables for key global options in our `_varia
|
||||
| `$enable-gradients` | `true` or `false` (default) | Enables predefined gradients via `background-image` styles on various components. |
|
||||
| `$enable-transitions` | `true` (default) or `false` | Enables predefined `transition`s on various components. |
|
||||
| `$enable-hover-media-query` | `true` or `false` (default) | ... |
|
||||
| `$enable-grid-classes` | `true` (default) or `false` | Enables the generation of CSS classes for the grid system (e.g. `.col-md-1` etc.). |
|
||||
| `$enable-grid-classes` | `true` (default) or `false` | Enables the generation of CSS classes for the grid system (e.g., `.container`, `.row`, `.col-md-1`, etc.). |
|
||||
|
||||
@ -9,7 +9,7 @@ Fancy a more modern grid system? [Enable flexbox support in Bootstrap](/getting-
|
||||
Bootstrap's flexbox grid includes support for every feature from our [default grid system](/layout/grid), and then some. Please read the [default grid system docs](/layout/grid) before proceeding through this page. Features that are covered there are only summarized here. Please note that **Internet Explorer 9 does not support flexbox**, so proceed with caution when enabling it.
|
||||
|
||||
{% callout warning %}
|
||||
**Heads up!** The flexbox grid documentation is only functional when flexbox support is explicitly enabled.
|
||||
**Heads up!** This flexbox grid documentation is powered by an additional CSS file that overrides our default grid system's CSS. This is only available in our hosted docs and is disabled in development.
|
||||
{% endcallout %}
|
||||
|
||||
## Contents
|
||||
|
||||
@ -139,7 +139,7 @@ Variables and maps determine the number of columns, the gutter width, and the me
|
||||
|
||||
{% highlight scss %}
|
||||
$grid-columns: 12;
|
||||
$grid-gutter-width: 15px;
|
||||
$grid-gutter-width: 30px;
|
||||
|
||||
$grid-breakpoints: (
|
||||
// Extra small screen / phone
|
||||
@ -270,36 +270,36 @@ In addition to our semantic mixins, Bootstrap includes an extensive set of prebu
|
||||
|
||||
### Example: Stacked-to-horizontal
|
||||
|
||||
Using a single set of `.col-md-*` grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns with the `.col` base class and a modifier within any `.row`.
|
||||
Using a single set of `.col-md-*` grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns within any `.row`.
|
||||
|
||||
<div class="bd-example-row">
|
||||
{% example html %}
|
||||
<div class="row">
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
<div class="col-md-1">col-md-1</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">md-8</div>
|
||||
<div class="col-md-4">md-4</div>
|
||||
<div class="col-md-8">col-md-8</div>
|
||||
<div class="col-md-4">col-md-4</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4">md-4</div>
|
||||
<div class="col-md-4">md-4</div>
|
||||
<div class="col-md-4">md-4</div>
|
||||
<div class="col-md-4">col-md-4</div>
|
||||
<div class="col-md-4">col-md-4</div>
|
||||
<div class="col-md-4">col-md-4</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6">md-6</div>
|
||||
<div class="col-md-6">md-6</div>
|
||||
<div class="col-md-6">col-md-6</div>
|
||||
<div class="col-md-6">col-md-6</div>
|
||||
</div>
|
||||
{% endexample %}
|
||||
</div>
|
||||
@ -459,7 +459,18 @@ Easily change the order of our built-in grid columns with `.push-md-*` and `.pul
|
||||
|
||||
Using our built-in grid Sass variables and maps, it's possible to completely customize the predefined grid classes. Change the number of tiers, the media query dimensions, and the container widths—then recompile.
|
||||
|
||||
For example, if you wanted just three grid tiers, you'd update the `$grid-breakpoints` and `$container-max-widths` to something like this:
|
||||
### Columns and gutters
|
||||
|
||||
The number of grid columns and their horizontal padding (aka, gutters) can be modified via Sass variables. `$grid-columns` is used to generate the widths (in percent) of each individual column while `$grid-gutter-width` is divided evenly across `padding-left` and `padding-right` for the column gutters.
|
||||
|
||||
{% highlight scss %}
|
||||
$grid-columns: 12;
|
||||
$grid-gutter-width: 30px;
|
||||
{% endhighlight %}
|
||||
|
||||
### Grid tiers
|
||||
|
||||
Moving beyond the columns themselves, you may also customize the number of grid tiers. If you wanted just three grid tiers, you'd update the `$grid-breakpoints` and `$container-max-widths` to something like this:
|
||||
|
||||
{% highlight scss %}
|
||||
$grid-breakpoints: (
|
||||
@ -475,4 +486,4 @@ $container-max-widths: (
|
||||
);
|
||||
{% endhighlight %}
|
||||
|
||||
Save your changes and recompile to have a brand new set of predefined grid classes for column widths, offsets, pushes, and pulls. Responsive visibility utilities will also be updated to use the custom breakpoints.
|
||||
When making any changes to the Sass variables or maps, you'll need to save your changes and recompile. Doing so will out a brand new set of predefined grid classes for column widths, offsets, pushes, and pulls. Responsive visibility utilities will also be updated to use the custom breakpoints.
|
||||
|
||||
@ -25,7 +25,8 @@ module.exports = function configureLibsass(grunt) {
|
||||
},
|
||||
docs: {
|
||||
files: {
|
||||
'docs/assets/css/docs.min.css': 'docs/assets/scss/docs.scss'
|
||||
'docs/assets/css/docs.min.css': 'docs/assets/scss/docs.scss',
|
||||
'docs/assets/css/docs-flexbox.min.css': 'docs/assets/scss/flex-grid.scss'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -29,7 +29,8 @@ module.exports = function configureRubySass(grunt) {
|
||||
docs: {
|
||||
options: options,
|
||||
files: {
|
||||
'docs/assets/css/docs.min.css': 'docs/assets/scss/docs.scss'
|
||||
'docs/assets/css/docs.min.css': 'docs/assets/scss/docs.scss',
|
||||
'docs/assets/css/docs-flexbox.min.css': 'docs/assets/scss/flex-grid.scss'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -117,28 +117,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
// scss-lint:disable ImportantRule
|
||||
// Custom override for
|
||||
.navbar-toggleable {
|
||||
&-xs {
|
||||
@include media-breakpoint-up(sm) {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
&-sm {
|
||||
@include media-breakpoint-up(md) {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
&-md {
|
||||
@include media-breakpoint-up(lg) {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
// scss-lint:enable ImportantRule
|
||||
|
||||
|
||||
// Navigation
|
||||
//
|
||||
// Custom navbar navigation built on the base `.nav` styles.
|
||||
@ -230,3 +208,51 @@
|
||||
background-color: rgba(255,255,255,.075);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Navbar toggleable
|
||||
//
|
||||
// Custom override for collapse plugin in navbar.
|
||||
|
||||
// scss-lint:disable ImportantRule
|
||||
.navbar-toggleable {
|
||||
&-xs {
|
||||
@include clearfix;
|
||||
@include media-breakpoint-down(xs) {
|
||||
.navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-up(sm) {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
&-sm {
|
||||
@include clearfix;
|
||||
@include media-breakpoint-down(sm) {
|
||||
.navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-up(md) {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
&-md {
|
||||
@include clearfix;
|
||||
@include media-breakpoint-down(md) {
|
||||
.navbar-nav .nav-item {
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-up(lg) {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
// scss-lint:enable ImportantRule
|
||||
|
||||
44
scss/bootstrap-grid.scss
vendored
44
scss/bootstrap-grid.scss
vendored
@ -8,53 +8,13 @@
|
||||
// Variables
|
||||
//
|
||||
|
||||
|
||||
// Grid breakpoints
|
||||
//
|
||||
// Define the minimum and maximum dimensions at which your layout will change,
|
||||
// adapting to different screen sizes, for use in media queries.
|
||||
|
||||
$grid-breakpoints: (
|
||||
// Extra small screen / phone
|
||||
xs: 0,
|
||||
// Small screen / phone
|
||||
sm: 544px,
|
||||
// Medium screen / tablet
|
||||
md: 768px,
|
||||
// Large screen / desktop
|
||||
lg: 992px,
|
||||
// Extra large screen / wide desktop
|
||||
xl: 1200px
|
||||
) !default;
|
||||
|
||||
|
||||
// Grid containers
|
||||
//
|
||||
// Define the maximum width of `.container` for different screen sizes.
|
||||
|
||||
$container-max-widths: (
|
||||
sm: 576px,
|
||||
md: 720px,
|
||||
lg: 940px,
|
||||
xl: 1140px
|
||||
) !default;
|
||||
|
||||
|
||||
// Grid columns
|
||||
//
|
||||
// Set the number of columns and specify the width of the gutters.
|
||||
|
||||
$grid-columns: 12 !default;
|
||||
$grid-gutter-width: 1.875rem !default; // 30px
|
||||
|
||||
@import "custom";
|
||||
@import "variables";
|
||||
|
||||
//
|
||||
// Grid mixins
|
||||
//
|
||||
|
||||
@import "custom";
|
||||
@import "variables";
|
||||
|
||||
@import "mixins/clearfix";
|
||||
@import "mixins/breakpoints";
|
||||
@import "mixins/grid-framework";
|
||||
|
||||
Loading…
Reference in New Issue
Block a user