mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00
Code Activity

Merge branch 'v4-dev' into yiq-function-update

Browse Source
This commit is contained in:
Gijs Boddeus
2017-10-04 08:46:03 +02:00
committed by GitHub
parent cc092272ee 682ad1fff5
commit 263190305e
241 changed files with 9700 additions and 6947 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scss/_alert.scss
+4 -3
View File
@@ -3,6 +3,7 @@
//
.alert {
position: relative;
padding: $alert-padding-y $alert-padding-x;
margin-bottom: $alert-margin-bottom;
border: $alert-border-width solid transparent;
@@ -28,9 +29,9 @@
.alert-dismissible {
// Adjust close link position
.close {
position: relative;
top: -$alert-padding-y;
right: -$alert-padding-x;
position: absolute;
top: 0;
right: 0;
padding: $alert-padding-y $alert-padding-x;
color: inherit;
}
scss/_badge.scss
+1 -1
View File
@@ -12,7 +12,7 @@
text-align: center;
white-space: nowrap;
vertical-align: baseline;
@include border-radius();
@include border-radius($badge-border-radius);
// Empty badges collapse automatically
&:empty {
scss/_breadcrumb.scss
+1
View File
@@ -27,6 +27,7 @@
+ .breadcrumb-item:hover::before {
text-decoration: underline;
}
// stylelint-disable-next-line no-duplicate-selectors
+ .breadcrumb-item:hover::before {
text-decoration: none;
}
scss/_button-group.scss
+13 -10
View File
@@ -1,4 +1,4 @@
// scss-lint:disable QualifyingElement
// stylelint-disable selector-no-qualifying-type
// Make the div behave like a button
.btn-group,
@@ -47,7 +47,8 @@
border-radius: 0;
}
// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
// Set corners individual because sometimes a single button can be in a .btn-group
// and we need :first-child and :last-child to both match
.btn-group > .btn:first-child {
margin-left: 0;
@@ -55,13 +56,15 @@
@include border-right-radius(0);
}
}
// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu
// immediately after it
.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
@include border-left-radius(0);
}
// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group)
// Custom edits for including btn-groups within btn-groups (useful for including
// dropdown buttons within a btn-group)
.btn-group > .btn-group {
float: left;
}
@@ -152,14 +155,14 @@
&:not(:first-child):not(:last-child) {
border-radius: 0;
}
}
&:first-child:not(:last-child) {
@include border-bottom-radius(0);
}
&:first-child:not(:last-child) {
@include border-bottom-radius(0);
}
&:last-child:not(:first-child) {
@include border-top-radius(0);
&:last-child:not(:first-child) {
@include border-top-radius(0);
}
}
> .btn-group:not(:first-child):not(:last-child) > .btn {
scss/_buttons.scss
+1 -2
View File
@@ -1,4 +1,4 @@
// scss-lint:disable QualifyingElement
// stylelint-disable selector-no-qualifying-type
//
// Base styles
@@ -76,7 +76,6 @@ fieldset[disabled] a.btn {
font-weight: $font-weight-normal;
color: $link-color;
background-color: transparent;
border-radius: 0;
@include hover {
color: $link-hover-color;
scss/_card.scss
+16 -5
View File
@@ -12,6 +12,11 @@
background-clip: border-box;
border: $card-border-width solid $card-border-color;
@include border-radius($card-border-radius);
> hr {
margin-right: 0;
margin-left: 0;
}
}
.card-body {
@@ -56,10 +61,6 @@
@include border-bottom-radius($card-border-radius);
}
}
.card-header + .list-group > .list-group-item:first-child {
border-top: 0;
}
}
@@ -76,6 +77,12 @@
&:first-child {
@include border-radius($card-inner-border-radius $card-inner-border-radius 0 0);
}
+ .list-group {
.list-group-item:first-child {
border-top: 0;
}
}
}
.card-footer {
@@ -207,7 +214,7 @@
}
}
&:not(:first-child):not(:last-child) {
&:not(:first-child):not(:last-child):not(:only-child) {
border-radius: 0;
.card-img-top,
@@ -215,6 +222,10 @@
border-radius: 0;
}
}
&:only-child {
@include border-radius($card-border-radius);
}
}
}
}
scss/_close.scss
+2 -2
View File
@@ -19,11 +19,11 @@
// If you want the anchor version, it requires `href="#"`.
// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
// scss-lint:disable QualifyingElement
// stylelint-disable property-no-vendor-prefix, selector-no-qualifying-type
button.close {
padding: 0;
background: transparent;
border: 0;
-webkit-appearance: none;
}
// scss-lint:enable QualifyingElement
// stylelint-enable
scss/_custom-forms.scss
+10 -8
View File
@@ -1,5 +1,3 @@
// scss-lint:disable PropertyCount, VendorPrefix
// Embedded icons from Open Iconic.
// Released under MIT and copyright 2014 Waybury.
// https://useiconic.com/open
@@ -139,7 +137,6 @@
color: $custom-select-color;
vertical-align: middle;
background: $custom-select-bg $custom-select-indicator no-repeat right $custom-select-padding-x center;
background-clip: padding-box;
background-size: $custom-select-bg-size;
border: $custom-select-border-width solid $custom-select-border-color;
@if $enable-rounded {
@@ -165,6 +162,11 @@
}
}
&[multiple] {
height: auto;
background-image: none;
}
&:disabled {
color: $custom-select-disabled-color;
background-color: $custom-select-disabled-bg;
@@ -216,13 +218,11 @@
z-index: 5;
height: $custom-file-height;
padding: $custom-file-padding-y $custom-file-padding-x;
overflow: hidden;
line-height: $custom-file-line-height;
color: $custom-file-color;
pointer-events: none;
user-select: none;
background-color: $custom-file-bg;
background-clip: padding-box;
border: $custom-file-border-width solid $custom-file-border-color;
@include border-radius($custom-file-border-radius);
@include box-shadow($custom-file-box-shadow);
@@ -235,8 +235,9 @@
&::before {
position: absolute;
top: 0;
right: 0;
top: -$custom-file-border-width;
right: -$custom-file-border-width;
bottom: -$custom-file-border-width;
z-index: 6;
display: block;
height: $custom-file-height;
@@ -244,7 +245,8 @@
line-height: $custom-file-line-height;
color: $custom-file-button-color;
background-color: $custom-file-button-bg;
border-left: $custom-file-border-width solid $custom-file-border-color;
border: $custom-file-border-width solid $custom-file-border-color;
@include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
}
@each $lang, $text in map-get($custom-file-text, button-label) {
scss/_dropdown.scss
+2 -27
View File
@@ -6,21 +6,7 @@
.dropdown-toggle {
// Generate the caret automatically
&::after {
display: inline-block;
width: 0;
height: 0;
margin-left: $caret-width * .85;
vertical-align: $caret-width * .85;
content: "";
border-top: $caret-width solid;
border-right: $caret-width solid transparent;
border-left: $caret-width solid transparent;
}
&:empty::after {
margin-left: 0;
}
@include caret;
}
// Allow for dropdowns to go bottom up (aka, dropup-menu)
@@ -32,10 +18,7 @@
}
.dropdown-toggle {
&::after {
border-top: 0;
border-bottom: $caret-width solid;
}
@include caret(up);
}
}
@@ -105,14 +88,6 @@
}
}
// Open state for the dropdown
.show {
// Remove the outline when :focus is triggered
> a {
outline: 0;
}
}
.dropdown-menu.show {
display: block;
}
scss/_forms.scss
+10 -29
View File
@@ -1,4 +1,4 @@
// scss-lint:disable QualifyingElement, VendorPrefix
// stylelint-disable selector-no-qualifying-type
//
// Textual form controls
@@ -88,21 +88,24 @@ select.form-control {
// For use with horizontal and inline forms, when you need the label text to
// align with the form controls.
.col-form-label {
padding-top: calc(#{$input-btn-padding-y} - #{$input-btn-border-width} * 2);
padding-bottom: calc(#{$input-btn-padding-y} - #{$input-btn-border-width} * 2);
padding-top: calc(#{$input-btn-padding-y} + #{$input-btn-border-width});
padding-bottom: calc(#{$input-btn-padding-y} + #{$input-btn-border-width});
margin-bottom: 0; // Override the `<label>` default
line-height: $input-btn-line-height;
}
.col-form-label-lg {
padding-top: calc(#{$input-btn-padding-y-lg} - #{$input-btn-border-width} * 2);
padding-bottom: calc(#{$input-btn-padding-y-lg} - #{$input-btn-border-width} * 2);
padding-top: calc(#{$input-btn-padding-y-lg} + #{$input-btn-border-width});
padding-bottom: calc(#{$input-btn-padding-y-lg} + #{$input-btn-border-width});
font-size: $font-size-lg;
line-height: $input-btn-line-height-lg;
}
.col-form-label-sm {
padding-top: calc(#{$input-btn-padding-y-sm} - #{$input-btn-border-width} * 2);
padding-bottom: calc(#{$input-btn-padding-y-sm} - #{$input-btn-border-width} * 2);
padding-top: calc(#{$input-btn-padding-y-sm} + #{$input-btn-border-width});
padding-bottom: calc(#{$input-btn-padding-y-sm} + #{$input-btn-border-width});
font-size: $font-size-sm;
line-height: $input-btn-line-height-sm;
}
@@ -255,28 +258,6 @@ select.form-control-lg {
// pseudo-classes but also includes `.is-invalid` and `.is-valid` classes for
// server side validation.
.invalid-feedback {
display: none;
margin-top: .25rem;
font-size: .875rem;
color: $form-feedback-invalid-color;
}
.invalid-tooltip {
position: absolute;
top: 100%;
z-index: 5;
display: none;
width: 250px;
padding: .5rem;
margin-top: .1rem;
font-size: .875rem;
line-height: 1;
color: #fff;
background-color: rgba($form-feedback-invalid-color,.8);
border-radius: .2rem;
}
@include form-validation-state("valid", $form-feedback-valid-color);
@include form-validation-state("invalid", $form-feedback-invalid-color);
scss/_functions.scss
+2 -6
View File
@@ -80,11 +80,7 @@
@function theme-color-level($color-name: "primary", $level: 0) {
$color: theme-color($color-name);
$color-base: if($level > 0, #000, #fff);
$level: abs($level);
@if $level < 0 {
// Lighter values need a quick double negative for the Sass math to work
@return mix($color-base, $color, $level * -1 * $theme-color-interval);
} @else {
@return mix($color-base, $color, $level * $theme-color-interval);
}
@return mix($color-base, $color, $level * $theme-color-interval);
}
scss/_input-group.scss
+18 -7
View File
@@ -1,3 +1,5 @@
// stylelint-disable selector-no-qualifying-type
//
// Base styles
//
@@ -5,7 +7,7 @@
.input-group {
position: relative;
display: flex;
align-items: center;
align-items: stretch;
width: 100%;
.form-control {
@@ -29,6 +31,8 @@
.input-group-addon,
.input-group-btn,
.input-group .form-control {
display: flex;
align-items: center;
&:not(:first-child):not(:last-child) {
@include border-radius(0);
}
@@ -70,7 +74,6 @@
color: $input-group-addon-color;
text-align: center;
background-color: $input-group-addon-bg;
background-clip: padding-box;
border: $input-btn-border-width solid $input-group-addon-border-color;
@include border-radius($input-border-radius);
@@ -87,13 +90,11 @@
@include border-radius($input-border-radius-lg);
}
// scss-lint:disable QualifyingElement
// Nuke default margins from checkboxes and radios to vertically center within.
input[type="radio"],
input[type="checkbox"] {
margin-top: 0;
}
// scss-lint:enable QualifyingElement
}
@@ -132,6 +133,7 @@
.input-group-btn {
position: relative;
align-items: stretch;
// Jankily prevent input button groups from wrapping with `white-space` and
// `font-size` in combination with `inline-block` on buttons.
font-size: 0;
@@ -141,8 +143,6 @@
// element above the siblings.
> .btn {
position: relative;
background-clip: padding-box;
border: $input-btn-border-width solid $input-group-btn-border-color;
+ .btn {
margin-left: (-$input-btn-border-width);
@@ -154,6 +154,10 @@
}
}
&:first-child > .btn + .btn {
margin-left: 0;
}
// Negative margin to only have a single, shared border between the two
&:not(:last-child) {
> .btn,
@@ -165,7 +169,14 @@
> .btn,
> .btn-group {
z-index: 2;
margin-left: (-$input-btn-border-width);
// remove nagative margin ($input-btn-border-width) to solve overlapping issue with button.
margin-left: 0;
// When input is first, overlap the right side of it with the button(-group)
&:first-child {
margin-left: (-$input-btn-border-width);
}
// Because specificity
@include hover-focus-active {
z-index: 3;
scss/_list-group.scss
+5
View File
@@ -86,8 +86,13 @@
.list-group-flush {
.list-group-item {
border-right: 0;
border-bottom: 0;
border-left: 0;
border-radius: 0;
&:first-child {
border-top: 0;
}
}
&:first-child {
scss/_mixins.scss
+1
View File
@@ -19,6 +19,7 @@
// // Components
@import "mixins/alert";
@import "mixins/buttons";
@import "mixins/caret";
@import "mixins/pagination";
@import "mixins/lists";
@import "mixins/list-group";
scss/_modal.scss
+5 -2
View File
@@ -82,13 +82,16 @@
// Top section of the modal w/ title and dismiss
.modal-header {
display: flex;
align-items: center; // vertically center it
align-items: flex-start; // so the close btn always stays on the upper right corner
justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
padding: $modal-header-padding;
border-bottom: $modal-header-border-width solid $modal-header-border-color;
@include border-top-radius($border-radius-lg);
.close {
margin-left: auto; // Force icon to the right even when there's no .modal-title
padding: $modal-header-padding;
// auto on the left force icon to the right even when there is no .modal-title
margin: (-$modal-header-padding) (-$modal-header-padding) (-$modal-header-padding) auto;
}
}
scss/_nav.scss
+5 -5
View File
@@ -74,12 +74,12 @@
.nav-pills {
.nav-link {
@include border-radius($nav-pills-border-radius);
}
&.active,
.show > & {
color: $nav-pills-link-active-color;
background-color: $nav-pills-link-active-bg;
}
.nav-link.active,
.show > .nav-link {
color: $nav-pills-link-active-color;
background-color: $nav-pills-link-active-bg;
}
}
scss/_navbar.scss
+16 -5
View File
@@ -147,8 +147,7 @@
}
@include media-breakpoint-up($next) {
flex-direction: row;
flex-wrap: nowrap;
flex-flow: row nowrap;
justify-content: flex-start;
.navbar-nav {
@@ -175,14 +174,12 @@
flex-wrap: nowrap;
}
// scss-lint:disable ImportantRule
.navbar-collapse {
display: flex !important;
display: flex !important; // stylelint-disable-line declaration-no-important
// Changes flex-bases to auto because of an IE10 bug
flex-basis: auto;
}
// scss-lint:enable ImportantRule
.navbar-toggler {
display: none;
@@ -239,6 +236,13 @@
.navbar-text {
color: $navbar-light-color;
a {
color: $navbar-light-active-color;
@include hover-focus {
color: $navbar-light-active-color;
}
}
}
}
@@ -284,5 +288,12 @@
.navbar-text {
color: $navbar-dark-color;
a {
color: $navbar-dark-active-color;
@include hover-focus {
color: $navbar-dark-active-color;
}
}
}
}
scss/_pagination.scss
+1 -3
View File
@@ -1,8 +1,6 @@
.pagination {
display: flex;
// 1-2: Disable browser default list styles
padding-left: 0; // 1
list-style: none; // 2
@include list-unstyled();
@include border-radius();
}
scss/_print.scss
+2 -3
View File
@@ -1,4 +1,4 @@
// scss-lint:disable QualifyingElement
// stylelint-disable declaration-no-important, selector-no-qualifying-type
// Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css
@@ -14,8 +14,7 @@
*::before,
*::after {
// Bootstrap specific; comment out `color` and `background`
//color: #000 !important; // Black prints faster:
// http://www.sanbeiji.com/archives/953
//color: #000 !important; // Black prints faster: http://www.sanbeiji.com/archives/953
text-shadow: none !important;
//background: transparent !important;
box-shadow: none !important;
scss/_reboot.scss
+13 -3
View File
@@ -1,4 +1,4 @@
// scss-lint:disable QualifyingElement, DuplicateProperty, VendorPrefix
// stylelint-disable
// Reboot
//
@@ -93,7 +93,7 @@ hr {
// margin for easier control within type scales as it avoids margin collapsing.
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: .5rem;
margin-bottom: $headings-margin-bottom;
}
// Reset margins on paragraphs
@@ -239,6 +239,9 @@ pre {
margin-bottom: 1rem;
// Don't allow content to break outside
overflow: auto;
// We have @viewport set which causes scrollbars to overlap content in IE11 and Edge, so
// we force a non-overlapping, non-auto-hiding scrollbar to counteract.
-ms-overflow-style: scrollbar;
}
@@ -273,7 +276,7 @@ svg:not(:root) {
// However, they DO support removing the click delay via `touch-action: manipulation`.
// See:
// * https://getbootstrap.com/docs/4.0/content/reboot/#click-delay-optimization-for-touch
// * http://caniuse.com/#feat=css-touch-action
// * https://caniuse.com/#feat=css-touch-action
// * https://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
a,
@@ -322,6 +325,13 @@ label {
margin-bottom: .5rem;
}
// Remove the default `border-radius` that macOS Chrome adds.
//
// Details at https://github.com/twbs/bootstrap/issues/24093
button {
border-radius: 0;
}
// Work around a Firefox/IE bug where the transparent `button` background
// results in a loss of the default `button` focus styles.
//
scss/_root.scss
+16
View File
@@ -0,0 +1,16 @@
:root {
@each $color, $value in $colors {
--#{$color}: $value;
}
@each $color, $value in $theme-colors {
--#{$color}: $value;
}
@each $bp, $value in $grid-breakpoints {
--breakpoint-#{$bp}: $value;
}
--font-family-sans-serif: $font-family-sans-serif;
--font-family-monospace: $font-family-monospace;
}
scss/_transitions.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable selector-no-qualifying-type
.fade {
opacity: 0;
@include transition($transition-fade);
scss/_type.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important, selector-list-comma-newline-after
//
// Headings
//
scss/_variables.scss
+43 -38
View File
@@ -8,6 +8,7 @@
// Color system
//
// stylelint-disable
$white: #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
@@ -22,15 +23,15 @@ $black: #000 !default;
$grays: () !default;
$grays: map-merge((
100: $gray-100,
200: $gray-200,
300: $gray-300,
400: $gray-400,
500: $gray-500,
600: $gray-600,
700: $gray-700,
800: $gray-800,
900: $gray-900
"100": $gray-100,
"200": $gray-200,
"300": $gray-300,
"400": $gray-400,
"500": $gray-500,
"600": $gray-600,
"700": $gray-700,
"800": $gray-800,
"900": $gray-900
), $grays);
$blue: #007bff !default;
@@ -46,32 +47,33 @@ $cyan: #17a2b8 !default;
$colors: () !default;
$colors: map-merge((
blue: $blue,
indigo: $indigo,
purple: $purple,
pink: $pink,
red: $red,
orange: $orange,
yellow: $yellow,
green: $green,
teal: $teal,
cyan: $cyan,
white: $white,
gray: $gray-600,
gray-dark: $gray-800
"blue": $blue,
"indigo": $indigo,
"purple": $purple,
"pink": $pink,
"red": $red,
"orange": $orange,
"yellow": $yellow,
"green": $green,
"teal": $teal,
"cyan": $cyan,
"white": $white,
"gray": $gray-600,
"gray-dark": $gray-800
), $colors);
$theme-colors: () !default;
$theme-colors: map-merge((
primary: $blue,
secondary: $gray-600,
success: $green,
info: $cyan,
warning: $yellow,
danger: $red,
light: $gray-100,
dark: $gray-800
"primary": $blue,
"secondary": $gray-600,
"success": $green,
"info": $cyan,
"warning": $yellow,
"danger": $red,
"light": $gray-100,
"dark": $gray-800
), $theme-colors);
// stylelint-enable
// Set a specific jump point for requesting color jumps
$theme-color-interval: 8% !default;
@@ -81,6 +83,7 @@ $theme-color-interval: 8% !default;
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-caret: true !default;
$enable-rounded: true !default;
$enable-shadows: false !default;
$enable-gradients: false !default;
@@ -201,9 +204,11 @@ $transition-collapse: height .35s ease !default;
//
// Font, line-height, and color for body text, headings, and more.
// stylelint-disable value-keyword-case
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
$font-family-monospace: "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
$font-family-base: $font-family-sans-serif !default;
// stylelint-enable value-keyword-case
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
$font-size-lg: 1.25rem !default;
@@ -294,17 +299,17 @@ $table-dark-color: $body-bg !default;
//
// For each of Bootstrap's buttons, define text, background and border color.
$input-btn-padding-y: .5rem !default;
$input-btn-padding-y: .375rem !default;
$input-btn-padding-x: .75rem !default;
$input-btn-line-height: 1.25 !default;
$input-btn-line-height: $line-height-base !default;
$input-btn-padding-y-sm: .25rem !default;
$input-btn-padding-x-sm: .5rem !default;
$input-btn-line-height-sm: 1.5 !default;
$input-btn-line-height-sm: $line-height-sm !default;
$input-btn-padding-y-lg: .5rem !default;
$input-btn-padding-x-lg: 1rem !default;
$input-btn-line-height-lg: 1.5 !default;
$input-btn-line-height-lg: $line-height-lg !default;
$btn-font-weight: $font-weight-normal !default;
$btn-box-shadow: inset 0 1px 0 rgba($white,.15), 0 1px 1px rgba($black,.075) !default;
@@ -329,7 +334,7 @@ $input-bg: $white !default;
$input-disabled-bg: $gray-200 !default;
$input-color: $gray-700 !default;
$input-border-color: rgba($black,.15) !default;
$input-border-color: $gray-400 !default;
$input-btn-border-width: $border-width !default; // For form controls and buttons
$input-box-shadow: inset 0 1px 1px rgba($black,.075) !default;
@@ -371,7 +376,6 @@ $form-group-margin-bottom: 1rem !default;
$input-group-addon-color: $input-color !default;
$input-group-addon-bg: $gray-200 !default;
$input-group-addon-border-color: $input-border-color !default;
$input-group-btn-border-color: $input-border-color !default;
$custom-control-gutter: 1.5rem !default;
$custom-control-spacer-y: .25rem !default;
@@ -407,8 +411,8 @@ $custom-radio-indicator-border-radius: 50% !default;
$custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default;
$custom-select-padding-y: .375rem !default;
$custom-select-padding-x: .75rem !default;
$custom-select-height: $input-height !default;
$custom-select-padding-x: .75rem !default;
$custom-select-height: $input-height !default;
$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
$custom-select-line-height: $input-btn-line-height !default;
$custom-select-color: $input-color !default;
@@ -650,6 +654,7 @@ $badge-font-size: 75% !default;
$badge-font-weight: $font-weight-bold !default;
$badge-padding-y: .25em !default;
$badge-padding-x: .4em !default;
$badge-border-radius: $border-radius !default;
$badge-pill-padding-x: .6em !default;
// Use a higher than normal value to ensure completely rounded edges when
scss/bootstrap-grid.scss
Vendored
+1 -1
View File
@@ -8,7 +8,7 @@
//
@at-root {
@-ms-viewport { width: device-width; }
@-ms-viewport { width: device-width; } // stylelint-disable-line at-rule-no-vendor-prefix
}
html {
scss/bootstrap.scss
Vendored
+1
View File
@@ -8,6 +8,7 @@
@import "functions";
@import "variables";
@import "mixins";
@import "root";
@import "print";
@import "reboot";
@import "type";
scss/mixins/_background-variant.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Contextual backgrounds
@mixin bg-variant($parent, $color) {
scss/mixins/_breakpoints.scss
+12 -2
View File
@@ -81,8 +81,18 @@
$min: breakpoint-min($lower, $breakpoints);
$max: breakpoint-max($upper, $breakpoints);
@media (min-width: $min) and (max-width: $max) {
@content;
@if $min != null and $max != null {
@media (min-width: $min) and (max-width: $max) {
@content;
}
} @else if $max == null {
@include media-breakpoint-up($lower) {
@content;
}
} @else if $min == null {
@include media-breakpoint-down($upper) {
@content;
}
}
}
scss/mixins/_caret.scss
+35
View File
@@ -0,0 +1,35 @@
@mixin caret-down {
border-top: $caret-width solid;
border-right: $caret-width solid transparent;
border-bottom: 0;
border-left: $caret-width solid transparent;
}
@mixin caret-up {
border-top: 0;
border-right: $caret-width solid transparent;
border-bottom: $caret-width solid;
border-left: $caret-width solid transparent;
}
@mixin caret($direction: down) {
@if $enable-caret {
&::after {
display: inline-block;
width: 0;
height: 0;
margin-left: $caret-width * .85;
vertical-align: $caret-width * .85;
content: "";
@if $direction == down {
@include caret-down;
} @else if $direction == up {
@include caret-up;
}
}
&:empty::after {
margin-left: 0;
}
}
}
scss/mixins/_float.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
@mixin float-left {
float: left !important;
}
scss/mixins/_forms.scss
+23 -1
View File
@@ -1,7 +1,7 @@
// Form control focus state
//
// Generate a customized focus state and for any input with the specified color,
// which defaults to the `@input-border-color-focus` variable.
// which defaults to the `$input-focus-border-color` variable.
//
// We highly encourage you to not customize the default value, but instead use
// this to tweak colors on an as-needed basis. This aesthetic change is based on
@@ -23,6 +23,28 @@
@mixin form-validation-state($state, $color) {
.#{$state}-feedback {
display: none;
margin-top: .25rem;
font-size: .875rem;
color: $color;
}
.#{$state}-tooltip {
position: absolute;
top: 100%;
z-index: 5;
display: none;
width: 250px;
padding: .5rem;
margin-top: .1rem;
font-size: .875rem;
line-height: 1;
color: #fff;
background-color: rgba($color,.8);
border-radius: .2rem;
}
.form-control,
.custom-select {
.was-validated &:#{$state},
scss/mixins/_grid-framework.scss
+6 -2
View File
@@ -10,7 +10,7 @@
width: 100%;
min-height: 1px; // Prevent columns from collapsing when empty
padding-right: ($gutter / 2);
padding-left: ($gutter / 2);
padding-left: ($gutter / 2);
}
@each $breakpoint in map-keys($breakpoints) {
@@ -46,6 +46,10 @@
}
}
.order#{$infix}-first {
order: -1;
}
@for $i from 1 through $columns {
.order#{$infix}-#{$i} {
order: $i;
@@ -56,7 +60,7 @@
@for $i from 0 through ($columns - 1) {
@if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0
.offset#{$infix}-#{$i} {
@include make-col-offset($i, $columns)
@include make-col-offset($i, $columns);
}
}
}
scss/mixins/_grid.scss
+4 -4
View File
@@ -4,10 +4,10 @@
@mixin make-container() {
width: 100%;
padding-right: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
margin-right: auto;
margin-left: auto;
padding-right: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
}
@@ -24,7 +24,7 @@
display: flex;
flex-wrap: wrap;
margin-right: ($grid-gutter-width / -2);
margin-left: ($grid-gutter-width / -2);
margin-left: ($grid-gutter-width / -2);
}
@mixin make-col-ready() {
@@ -35,7 +35,7 @@
width: 100%;
min-height: 1px; // Prevent collapsing
padding-right: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
}
@mixin make-col($size, $columns: $grid-columns) {
scss/mixins/_hover.scss
+13 -12
View File
@@ -1,3 +1,4 @@
// stylelint-disable indentation
@mixin hover {
// TODO: re-enable along with mq4-hover-shim
// @if $enable-hover-media-query {
@@ -8,21 +9,21 @@
// }
// }
// @else {
// scss-lint:disable Indentation
&:hover { @content }
// scss-lint:enable Indentation
&:hover { @content; }
// }
}
@mixin hover-focus {
@if $enable-hover-media-query {
&:focus { @content }
@include hover { @content }
&:focus {
@content;
}
@include hover { @content; }
} @else {
&:focus,
&:hover {
@content
@content;
}
}
}
@@ -31,14 +32,14 @@
@if $enable-hover-media-query {
&,
&:focus {
@content
@content;
}
@include hover { @content }
@include hover { @content; }
} @else {
&,
&:focus,
&:hover {
@content
@content;
}
}
}
@@ -47,14 +48,14 @@
@if $enable-hover-media-query {
&:focus,
&:active {
@content
@content;
}
@include hover { @content }
@include hover { @content; }
} @else {
&:focus,
&:active,
&:hover {
@content
@content;
}
}
}
scss/mixins/_image.scss
+3 -3
View File
@@ -20,15 +20,15 @@
//
// Short retina mixin for setting background-image and -size.
// stylelint-disable indentation, media-query-list-comma-newline-after
@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
background-image: url($file-1x);
// Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
// but doesn't convert dppx=>dpi.
// There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
// Compatibility info: http://caniuse.com/#feat=css-media-resolution
@media
only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
// Compatibility info: https://caniuse.com/#feat=css-media-resolution
@media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
only screen and (min-resolution: 2dppx) { // Standardized
background-image: url($file-2x);
background-size: $width-1x $height-1x;
scss/mixins/_list-group.scss
-2
View File
@@ -6,7 +6,6 @@
background-color: $background;
}
//scss-lint:disable QualifyingElement
a.list-group-item-#{$state},
button.list-group-item-#{$state} {
color: $color;
@@ -22,5 +21,4 @@
border-color: $color;
}
}
// scss-lint:enable QualifyingElement
}
scss/mixins/_navbar-align.scss
+2 -1
View File
@@ -1,7 +1,8 @@
// Navbar vertical align
//
// Vertically center elements in the navbar.
// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);`
// to calculate the appropriate top margin.
// @mixin navbar-vertical-align($element-height) {
// margin-top: (($navbar-height - $element-height) / 2);
scss/mixins/_reset-text.scss
+1 -2
View File
@@ -1,4 +1,3 @@
// scss-lint:disable DuplicateProperty
@mixin reset-text {
font-family: $font-family-base;
// We deliberately do NOT reset font-size or word-wrap.
@@ -6,7 +5,7 @@
font-weight: $font-weight-normal;
line-height: $line-height-base;
text-align: left; // Fallback for where `start` is not supported
text-align: start;
text-align: start; // stylelint-disable-line declaration-block-no-duplicate-properties
text-decoration: none;
text-shadow: none;
text-transform: none;
scss/mixins/_screen-reader.scss
+2 -2
View File
@@ -1,7 +1,7 @@
// Only display content to screen readers
//
// See: http://a11yproject.com/posts/how-to-hide-content
// See: http://hugogiraudel.com/2016/10/13/css-hide-and-seek/
// See: http://a11yproject.com/posts/how-to-hide-content/
// See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
@mixin sr-only {
position: absolute;
scss/mixins/_text-emphasis.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Typography
@mixin text-emphasis-variant($parent, $color) {
scss/mixins/_visibility.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Visibility
@mixin invisible($visibility) {
scss/utilities/_align.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
.align-baseline { vertical-align: baseline !important; } // Browser default
.align-top { vertical-align: top !important; }
.align-middle { vertical-align: middle !important; }
scss/utilities/_background.scss
+10 -3
View File
@@ -1,6 +1,13 @@
// stylelint-disable declaration-no-important
@each $color, $value in $theme-colors {
@include bg-variant('.bg-#{$color}', $value);
@include bg-variant(".bg-#{$color}", $value);
}
.bg-white { background-color: $white !important; }
.bg-transparent { background-color: transparent !important; }
.bg-white {
background-color: $white !important;
}
.bg-transparent {
background-color: transparent !important;
}
scss/utilities/_borders.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
//
// Border
//
scss/utilities/_display.scss
+3
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
//
// Utilities for common `display` values
//
@@ -11,6 +13,7 @@
.d#{$infix}-inline-block { display: inline-block !important; }
.d#{$infix}-block { display: block !important; }
.d#{$infix}-table { display: table !important; }
.d#{$infix}-table-row { display: table-row !important; }
.d#{$infix}-table-cell { display: table-cell !important; }
.d#{$infix}-flex { display: flex !important; }
.d#{$infix}-inline-flex { display: inline-flex !important; }
scss/utilities/_flex.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Flex variation
//
// Custom styles for additional flex alignment options.
scss/utilities/_position.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Common values
// Sass list not in variables since it's not intended for customization.
scss/utilities/_sizing.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Width and height
@each $prop, $abbrev in (width: w, height: h) {
scss/utilities/_spacing.scss
+2
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Margin and Padding
@each $breakpoint in map-keys($grid-breakpoints) {
scss/utilities/_text.scss
+3 -1
View File
@@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
//
// Text
//
@@ -38,7 +40,7 @@
.text-white { color: #fff !important; }
@each $color, $value in $theme-colors {
@include text-emphasis-variant('.text-#{$color}', $value);
@include text-emphasis-variant(".text-#{$color}", $value);
}
.text-muted { color: $text-muted !important; }