2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-08 17:22:31 +03:00

Merge branch 'v4-dev' into v4-navbars

This commit is contained in:
Mark Otto
2016-10-09 15:04:32 -07:00
146 changed files with 1969 additions and 1233 deletions
+3
View File
@@ -3,6 +3,9 @@ scss_files:
- "**/*.scss"
- "docs/assets/scss/**/*.scss"
exclude:
- "scss/_normalize.scss"
plugin_directories: ['.scss-linters']
# List of gem names to load custom linters from (make sure they are already
+12 -3
View File
@@ -9,12 +9,21 @@
.collapse {
display: none;
&.in {
display: block;
}
// tr&.in { display: table-row; }
// tbody&.in { display: table-row-group; }
}
tr {
&.collapse.in {
display: table-row;
}
}
tbody {
&.collapse.in {
display: table-row-group;
}
}
.collapsing {
+1 -1
View File
@@ -2,7 +2,7 @@
// Embedded icons from Open Iconic.
// Released under MIT and copyright 2014 Waybury.
// http://useiconic.com/open
// https://useiconic.com/open
// Checkboxes and radios
+2 -11
View File
@@ -6,13 +6,9 @@
// which weren't expecting the images within themselves to be involuntarily resized.
// See also https://github.com/twbs/bootstrap/issues/18178
.img-fluid {
@include img-fluid();
@include img-fluid;
}
// Rounded corners
.img-rounded {
@include border-radius($border-radius-lg);
}
// Image thumbnails
.img-thumbnail {
@@ -24,12 +20,7 @@
@include box-shadow($thumbnail-box-shadow);
// Keep them at most 100% wide
@include img-fluid(inline-block);
}
// Perfect circle
.img-circle {
border-radius: 50%;
@include img-fluid;
}
//
+1 -1
View File
@@ -51,4 +51,4 @@
// @import "mixins/navbar-align";
@import "mixins/grid-framework";
@import "mixins/grid";
@import "mixins/pulls";
@import "mixins/float";
+3 -1
View File
@@ -22,7 +22,9 @@
// Prevent Chrome on Windows from adding a focus outline. For details, see
// https://github.com/twbs/bootstrap/pull/10951.
outline: 0;
-webkit-overflow-scrolling: touch;
// We deliberately don't use `-webkit-overflow-scrolling: touch;` due to a
// gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342
// See also https://github.com/twbs/bootstrap/issues/17695
// When fading in the modal, animate it to slide down
&.fade .modal-dialog {
+51 -53
View File
@@ -1,14 +1,16 @@
/*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */
/*! normalize.css v4.2.0 | MIT License | github.com/necolas/normalize.css */
//
// 1. Change the default font family in all browsers (opinionated).
// 2. Prevent adjustments of font size after orientation changes in IE and iOS.
// 2. Correct the line height in all browsers.
// 3. Prevent adjustments of font size after orientation changes in IE and iOS.
//
html {
font-family: sans-serif; // 1
-ms-text-size-adjust: 100%; // 2
-webkit-text-size-adjust: 100%; // 2
line-height: 1.15; // 2
-ms-text-size-adjust: 100%; // 3
-webkit-text-size-adjust: 100%; // 3
}
//
@@ -76,7 +78,7 @@ progress {
// 1. Add the correct display in IE.
//
template, // 2
template, // 1
[hidden] {
display: none;
}
@@ -85,11 +87,13 @@ template, // 2
// ==========================================================================
//
// Remove the gray background on active links in IE 10.
// 1. Remove the gray background on active links in IE 10.
// 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
//
a {
background-color: transparent;
background-color: transparent; // 1
-webkit-text-decoration-skip: objects; // 2
}
//
@@ -248,14 +252,17 @@ hr {
// ==========================================================================
//
// Change font properties to `inherit` in all browsers (opinionated).
// 1. Change font properties to `inherit` in all browsers (opinionated).
// 2. Remove the margin in Firefox and Safari.
//
button,
input,
optgroup,
select,
textarea {
font: inherit;
font: inherit; // 1
margin: 0; // 2
}
//
@@ -269,30 +276,16 @@ optgroup {
//
// Show the overflow in IE.
// 1. Show the overflow in Edge.
// 2. Show the overflow in Edge, Firefox, and IE.
//
button,
input, // 1
select { // 2
input { // 1
overflow: visible;
}
//
// Remove the margin in Safari.
// 1. Remove the margin in Firefox and Safari.
//
button,
input,
select,
textarea { // 1
margin: 0;
}
//
// Remove the inheritence of text transform in Edge, Firefox, and IE.
// 1. Remove the inheritence of text transform in Firefox.
// Remove the inheritance of text transform in Edge, Firefox, and IE.
// 1. Remove the inheritance of text transform in Firefox.
//
button,
@@ -300,29 +293,10 @@ select { // 1
text-transform: none;
}
//
// Change the cursor in all browsers (opinionated).
//
button,
[type="button"],
[type="reset"],
[type="submit"] {
cursor: pointer;
}
//
// Restore the default cursor to disabled elements unset by the previous rule.
//
[disabled] {
cursor: default;
}
//
// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
// controls in Android 4.
// 2. Correct the inability to style clickable types in iOS.
// 2. Correct the inability to style clickable types in iOS and Safari.
//
button,
@@ -337,8 +311,10 @@ html [type="button"], // 1
//
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
@@ -347,7 +323,9 @@ input::-moz-focus-inner {
//
button:-moz-focusring,
input:-moz-focusring {
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
@@ -406,19 +384,39 @@ textarea {
}
//
// Correct the odd appearance of search inputs in Chrome and Safari.
// 1. Correct the odd appearance in Chrome and Safari.
// 2. Correct the outline style in Safari.
//
[type="search"] {
-webkit-appearance: textfield;
-webkit-appearance: textfield; // 1
outline-offset: -2px; // 2
}
//
// Remove the inner padding and cancel buttons in Chrome on OS X and
// Safari on OS X.
// Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
//
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
//
// Correct the text style of placeholders in Chrome, Edge, and Safari.
//
::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
}
//
// 1. Correct the inability to style clickable types in iOS and Safari.
// 2. Change font properties to `inherit` in Safari.
//
::-webkit-file-upload-button {
-webkit-appearance: button; // 1
font: inherit; // 2
}
+8 -2
View File
@@ -14,7 +14,10 @@
*::before,
*::after,
*::first-letter,
*::first-line {
p::first-line,
div::first-line,
blockquote::first-line,
li::first-line {
// Bootstrap specific; comment out `color` and `background`
//color: #000 !important; // Black prints faster:
// http://www.sanbeiji.com/archives/953
@@ -45,9 +48,12 @@
//a[href^="#"]::after,
//a[href^="javascript:"]::after {
// content: "";
// content: "";
//}
pre {
white-space: pre-wrap !important;
}
pre,
blockquote {
border: $border-width solid #999; // Bootstrap custom code; using `$border-width` instead of 1px
+7 -10
View File
@@ -15,7 +15,7 @@
//
// Heads up! This reset may cause conflicts with some third-party widgets. For
// recommendations on resolving such conflicts, see
// http://getbootstrap.com/getting-started/#third-box-sizing.
// https://getbootstrap.com/getting-started/#third-box-sizing.
//
// Credit: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
@@ -33,15 +33,15 @@ html {
// Make viewport responsive
//
// @viewport is needed because IE 10+ doesn't honor <meta name="viewport"> in
// some cases. See http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/.
// some cases. See https://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/.
// Eventually @viewport will replace <meta name="viewport">.
//
// However, `device-width` is broken on IE 10 on Windows (Phone) 8,
// (see http://timkadlec.com/2013/01/windows-phone-8-and-device-width/ and https://github.com/twbs/bootstrap/issues/10497)
// (see https://timkadlec.com/2013/01/windows-phone-8-and-device-width/ and https://github.com/twbs/bootstrap/issues/10497)
// and the fix for that involves a snippet of JavaScript to sniff the user agent
// and apply some conditional CSS.
//
// See http://getbootstrap.com/getting-started/#support-ie10-width for the relevant hack.
// See https://getbootstrap.com/getting-started/#support-ie10-width for the relevant hack.
//
// Wrap `@viewport` with `@at-root` for when folks do a nested import (e.g.,
// `.class-name { @import "bootstrap"; }`).
@@ -247,9 +247,9 @@ img {
// DON'T remove the click delay when `<meta name="viewport" content="width=device-width">` is present.
// However, they DO support removing the click delay via `touch-action: manipulation`.
// See:
// * http://v4-alpha.getbootstrap.com/content/reboot/#click-delay-optimization-for-touch
// * https://v4-alpha.getbootstrap.com/content/reboot/#click-delay-optimization-for-touch
// * http://caniuse.com/#feat=css-touch-action
// * http://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
// * https://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
a,
area,
@@ -312,11 +312,8 @@ input,
button,
select,
textarea {
// Remove all `margin`s so our classes don't have to do it themselves.
margin: 0;
// Normalize includes `font: inherit;`, so `font-family`. `font-size`, etc are
// properly inherited. However, `line-height` isn't addressed there. Using this
// ensures we don't need to unnecessarily redeclare the global font stack.
// properly inherited. However, `line-height` isn't inherited there.
line-height: inherit;
}
+1 -1
View File
@@ -60,7 +60,7 @@ hr {
small,
.small {
font-size: $small-font-size;
font-size: $font-size-sm;
font-weight: normal;
}
+2 -1
View File
@@ -1,8 +1,9 @@
@import "utilities/background";
@import "utilities/borders";
@import "utilities/clearfix";
@import "utilities/display";
@import "utilities/flex";
@import "utilities/pulls";
@import "utilities/float";
@import "utilities/screenreaders";
@import "utilities/spacing";
@import "utilities/text";
+3 -5
View File
@@ -125,7 +125,7 @@ $link-hover-decoration: underline !default;
$grid-breakpoints: (
xs: 0,
sm: 544px,
sm: 576px,
md: 768px,
lg: 992px,
xl: 1200px
@@ -138,9 +138,9 @@ $grid-breakpoints: (
// Define the maximum width of `.container` for different screen sizes.
$container-max-widths: (
sm: 576px,
sm: 540px,
md: 720px,
lg: 940px,
lg: 960px,
xl: 1140px
) !default;
@include _assert-ascending($container-max-widths, "$container-max-widths");
@@ -205,8 +205,6 @@ $headings-color: inherit !default;
$lead-font-size: 1.25rem !default;
$lead-font-weight: 300 !default;
$small-font-size: 80% !default;
$text-muted: $gray-light !default;
$abbr-border-color: $gray-light !default;
+1 -1
View File
@@ -1,5 +1,5 @@
/*!
* Bootstrap v4.0.0-alpha.4 (http://getbootstrap.com)
* Bootstrap v4.0.0-alpha.4 (https://getbootstrap.com)
* Copyright 2011-2016 The Bootstrap Authors
* Copyright 2011-2016 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
-1
View File
@@ -2,7 +2,6 @@
@mixin bg-variant($parent, $color) {
#{$parent} {
color: #fff !important;
background-color: $color !important;
}
a#{$parent} {
@@ -1,6 +1,6 @@
@mixin pull-left {
@mixin float-left {
float: left !important;
}
@mixin pull-right {
@mixin float-right {
float: right !important;
}
+5 -2
View File
@@ -21,6 +21,11 @@
@each $breakpoint in map-keys($breakpoints) {
$breakpoint-counter: ($breakpoint-counter + 1);
// Allow columns to stretch full width below their breakpoints
.col-#{$breakpoint} {
@extend %grid-column;
}
@for $i from 1 through $columns {
.col-#{$breakpoint}-#{$i} {
@extend %grid-column;
@@ -31,11 +36,9 @@
// Provide basic `.col-{bp}` classes for equal-width flexbox columns
@if $enable-flex {
.col-#{$breakpoint} {
position: relative;
flex-basis: 0;
flex-grow: 1;
max-width: 100%;
min-height: 1px;
}
}
+2 -1
View File
@@ -17,7 +17,8 @@
@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
@each $breakpoint, $container-max-width in $max-widths {
@include media-breakpoint-up($breakpoint, $breakpoints) {
max-width: $container-max-width;
width: $container-max-width;
max-width: 100%;
}
}
}
+1 -1
View File
@@ -1,7 +1,7 @@
@mixin hover {
// TODO: re-enable along with mq4-hover-shim
// @if $enable-hover-media-query {
// // See Media Queries Level 4: http://drafts.csswg.org/mediaqueries/#hover
// // See Media Queries Level 4: https://drafts.csswg.org/mediaqueries/#hover
// // Currently shimmed by https://github.com/twbs/mq4-hover-shim
// @media (hover: hover) {
// &:hover { @content }
+6 -4
View File
@@ -7,10 +7,12 @@
//
// Keep images from scaling beyond the width of their parents.
@mixin img-fluid($display: block) {
display: $display;
max-width: 100%; // Part 1: Set a maximum relative to the parent
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
@mixin img-fluid {
// Part 1: Set a maximum relative to the parent
max-width: 100%;
// Part 2: Override the height to auto, otherwise images will be stretched
// when setting a width and height attribute on the img element.
height: auto;
}
+1 -1
View File
@@ -15,7 +15,7 @@
// Use in conjunction with .sr-only to only display content when it's focused.
//
// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
//
// Credit: HTML5 Boilerplate
+30
View File
@@ -0,0 +1,30 @@
//
// Border-width
//
// TBD...?
//
// Border-radius
//
.rounded {
@include border-radius($border-radius);
}
.rounded-top {
@include border-top-radius($border-radius);
}
.rounded-right {
@include border-right-radius($border-radius);
}
.rounded-bottom {
@include border-bottom-radius($border-radius);
}
.rounded-left {
@include border-left-radius($border-radius);
}
.rounded-circle {
border-radius: 50%;
}
+13
View File
@@ -0,0 +1,13 @@
@each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
.float-#{$breakpoint}-left {
@include float-left();
}
.float-#{$breakpoint}-right {
@include float-right();
}
.float-#{$breakpoint}-none {
float: none !important;
}
}
}
-13
View File
@@ -1,13 +0,0 @@
@each $breakpoint in map-keys($grid-breakpoints) {
@include media-breakpoint-up($breakpoint) {
.pull-#{$breakpoint}-left {
@include pull-left();
}
.pull-#{$breakpoint}-right {
@include pull-right();
}
.pull-#{$breakpoint}-none {
float: none !important;
}
}
}
+8 -8
View File
@@ -4,7 +4,7 @@
// Margin and Padding
.m-x-auto {
.mx-auto {
margin-right: auto !important;
margin-left: auto !important;
}
@@ -14,18 +14,18 @@
$length-x: map-get($lengths, x);
$length-y: map-get($lengths, y);
.#{$abbrev}-a-#{$size} { #{$prop}: $length-y $length-x !important; } // a = All sides
.#{$abbrev}-t-#{$size} { #{$prop}-top: $length-y !important; }
.#{$abbrev}-r-#{$size} { #{$prop}-right: $length-x !important; }
.#{$abbrev}-b-#{$size} { #{$prop}-bottom: $length-y !important; }
.#{$abbrev}-l-#{$size} { #{$prop}-left: $length-x !important; }
.#{$abbrev}-#{$size} { #{$prop}: $length-y $length-x !important; } // a = All sides
.#{$abbrev}t-#{$size} { #{$prop}-top: $length-y !important; }
.#{$abbrev}r-#{$size} { #{$prop}-right: $length-x !important; }
.#{$abbrev}b-#{$size} { #{$prop}-bottom: $length-y !important; }
.#{$abbrev}l-#{$size} { #{$prop}-left: $length-x !important; }
// Axes
.#{$abbrev}-x-#{$size} {
.#{$abbrev}x-#{$size} {
#{$prop}-right: $length-x !important;
#{$prop}-left: $length-x !important;
}
.#{$abbrev}-y-#{$size} {
.#{$abbrev}y-#{$size} {
#{$prop}-top: $length-y !important;
#{$prop}-bottom: $length-y !important;
}
+4
View File
@@ -32,6 +32,10 @@
// Contextual colors
.text-white {
color: #fff !important;
}
@include text-emphasis-variant('.text-muted', $text-muted);
@include text-emphasis-variant('.text-primary', $brand-primary);