mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-13 17:14:04 +02:00
Code Issues Releases Wiki Activity

Merge remote-tracking branch 'twbs/v4-dev' into patch-1

Browse Source 
Conflicts:
	scss/_custom-forms.scss
	scss/_variables.scss
This commit is contained in:
Alexandr Kondrashov
2015-09-11 16:43:00 +03:00
parent 353e0a49a9 b811f8cf96
commit c9725926b2
170 changed files with 3586 additions and 3727 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
scss/.scsslint.yml
View File

@@ -12,6 +12,9 @@ linters:
ColorKeyword:
enabled: true
ColorVariable:
enabled: false
Comment:
enabled: true
exclude: ['_normalize.scss', 'bootstrap.scss']
@@ -55,6 +58,9 @@ linters:
IdSelector:
enabled: true
ImportantRule:
enabled: false
ImportPath:
enabled: true
leading_underscore: false
@@ -96,6 +102,9 @@ linters:
"bottom",
"left",
"z-index",
"-webkit-box-sizing",
"-moz-box-sizing",
"box-sizing",
"display",
"float",
"width",
@@ -104,10 +113,6 @@ linters:
"height",
"min-height",
"max-height",
"-webkit-box-sizing",
"-moz-box-sizing",
"box-sizing",
"-webkit-appearance",
"flex",
"flex-direction",
"flex-flow",

1
scss/_alert.scss
View File

@@ -20,7 +20,6 @@
// Headings for larger alerts
.alert-heading {
margin-top: 0;
// Specified to prevent conflicts of changing $headings-color
color: inherit;
}

8
scss/_breadcrumb.scss
View File

@@ -4,16 +4,16 @@
list-style: none;
background-color: $breadcrumb-bg;
@include border-radius($border-radius);
@include clearfix;
> li {
display: inline-block;
float: left;
+ li:before {
$nbsp: "\00a0";
+ li::before {
padding-right: .5rem;
padding-left: .5rem;
color: $breadcrumb-divider-color;
content: "#{$breadcrumb-divider}#{$nbsp}"; // Unicode space added since inline-block means non-collapsing white-space
content: "#{$breadcrumb-divider}";
}
}

9
scss/_buttons.scss
View File

@@ -39,8 +39,7 @@
}
&.disabled,
&:disabled,
fieldset[disabled] & {
&:disabled {
cursor: $cursor-disabled;
opacity: .65;
@include box-shadow(none);
@@ -111,8 +110,7 @@ fieldset[disabled] a.btn {
&,
&:active,
&.active,
&:disabled,
fieldset[disabled] & {
&:disabled {
background-color: transparent;
@include box-shadow(none);
}
@@ -129,8 +127,7 @@ fieldset[disabled] a.btn {
text-decoration: $link-hover-decoration;
background-color: transparent;
}
&:disabled,
fieldset[disabled] & {
&:disabled {
@include hover-focus {
color: $btn-link-disabled-color;
text-decoration: none;

144
scss/_card.scss
View File

@@ -5,6 +5,7 @@
.card {
position: relative;
margin-bottom: $card-spacer-y;
background-color: #fff;
border: $card-border-width solid $card-border-color;
@include border-radius($card-border-radius);
}
@@ -14,7 +15,6 @@
}
.card-title {
margin-top: 0;
margin-bottom: $card-spacer-y;
}
@@ -181,33 +181,37 @@
//
@if $enable-flex {
.card-deck {
display: flex;
flex-flow: row wrap;
margin-right: -.625rem;
margin-left: -.625rem;
@include media-breakpoint-up(sm) {
.card-deck {
display: flex;
flex-flow: row wrap;
margin-right: -.625rem;
margin-left: -.625rem;
.card {
flex: 1 0 0;
margin-right: .625rem;
margin-left: .625rem;
.card {
flex: 1 0 0;
margin-right: .625rem;
margin-left: .625rem;
}
}
}
} @else {
.card-deck {
display: table;
table-layout: fixed;
border-spacing: 1.25rem 0;
@include media-breakpoint-up(sm) {
.card-deck {
display: table;
table-layout: fixed;
border-spacing: 1.25rem 0;
.card {
display: table-cell;
width: 1%;
vertical-align: top;
.card {
display: table-cell;
width: 1%;
vertical-align: top;
}
}
.card-deck-wrapper {
margin-right: -1.25rem;
margin-left: -1.25rem;
}
}
.card-deck-wrapper {
margin-right: -1.25rem;
margin-left: -1.25rem;
}
}
@@ -215,54 +219,56 @@
// Card groups
//
.card-group {
@if $enable-flex {
display: flex;
flex-flow: row wrap;
} @else {
display: table;
width: 100%;
table-layout: fixed;
}
.card {
@include media-breakpoint-up(sm) {
.card-group {
@if $enable-flex {
flex: 1 0 0;
display: flex;
flex-flow: row wrap;
} @else {
display: table-cell;
vertical-align: top;
display: table;
width: 100%;
table-layout: fixed;
}
+ .card {
margin-left: 0;
border-left: 0;
}
// Handle rounded corners
@if $enable-rounded {
&:first-child {
.card-img-top {
border-top-right-radius: 0;
}
.card-img-bottom {
border-bottom-right-radius: 0;
}
}
&:last-child {
.card-img-top {
border-top-left-radius: 0;
}
.card-img-bottom {
border-bottom-left-radius: 0;
}
.card {
@if $enable-flex {
flex: 1 0 0;
} @else {
display: table-cell;
vertical-align: top;
}
&:not(:first-child):not(:last-child) {
border-radius: 0;
+ .card {
margin-left: 0;
border-left: 0;
}
.card-img-top,
.card-img-bottom {
// Handle rounded corners
@if $enable-rounded {
&:first-child {
.card-img-top {
border-top-right-radius: 0;
}
.card-img-bottom {
border-bottom-right-radius: 0;
}
}
&:last-child {
.card-img-top {
border-top-left-radius: 0;
}
.card-img-bottom {
border-bottom-left-radius: 0;
}
}
&:not(:first-child):not(:last-child) {
border-radius: 0;
.card-img-top,
.card-img-bottom {
border-radius: 0;
}
}
}
}
@@ -274,12 +280,14 @@
// Card
//
.card-columns {
column-count: 3;
column-gap: 1.25rem;
@include media-breakpoint-up(sm) {
.card-columns {
column-count: 3;
column-gap: 1.25rem;
.card {
display: inline-block;
width: 100%; // Don't let them exceed the column width
.card {
display: inline-block;
width: 100%; // Don't let them exceed the column width
}
}
}

6
scss/_carousel.scss
View File

@@ -16,7 +16,7 @@
// Account for jankitude on images
> img,
> a > img {
@extend .img-responsive;
@extend .img-fluid;
line-height: 1;
}
@@ -141,12 +141,12 @@
}
.icon-prev {
&:before {
&::before {
content: "\2039";// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
}
}
.icon-next {
&:before {
&::before {
content: "\203a";// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
}
}

43
scss/_custom-forms.scss
View File

@@ -19,16 +19,17 @@
z-index: -1; // Put the input behind the label so it doesn't overlay text
opacity: 0;
&:focus ~ .c-indicator {
@include box-shadow(0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9);
}
&:checked ~ .c-indicator {
color: #fff;
background-color: #0074d9;
@include box-shadow(none);
}
&:focus ~ .c-indicator {
// the mixin is not used here to make sure there is feedback
box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9;
}
&:active ~ .c-indicator {
color: #fff;
background-color: #84c6ff;
@@ -108,7 +109,7 @@
.c-input {
display: inline;
&:after {
&::after {
display: block;
margin-bottom: .25rem;
content: "";
@@ -125,29 +126,31 @@
//
// Replaces the browser default select with a custom one, mostly pulled from
// http://primercss.io.
//
// Includes IE9-specific hacks (noted by ` \9`).
.c-select {
display: inline-block;
max-width: 100%;
padding: .375rem 1.75rem .375rem .75rem;
padding-right: .75rem \9;
vertical-align: middle;
<<<<<<< HEAD
background: #fff url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0IDUiPjxwYXRoIGZpbGw9IiMzMzMiIGQ9Ik0yIDBMMCAyaDR6bTAgNUwwIDNoNHoiLz48L3N2Zz4=) no-repeat right .75rem center;
=======
background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center;
background-image: none \9;
>>>>>>> twbs/v4-dev
background-size: 8px 10px;
border: 1px solid $input-border;
// Have to include vendor prefixes as the `appearance` property isn't part of the CSS spec.
-webkit-appearance: none;
// Use vendor prefixes as `appearance` isn't part of the CSS spec.
-moz-appearance: none;
appearance: none;
// IE9 hacks to hide the background-image and reduce padding
padding-right: .75rem \9;
background-image: none \9;
-webkit-appearance: none;
&:focus {
outline: none;
border-color: #51a7e8;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 5px rgba(81, 167, 232, 0.5);
outline: none;
@include box-shadow(inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 5px rgba(81, 167, 232, 0.5));
}
// Hides the default caret in IE11
@@ -181,7 +184,7 @@
.file input {
min-width: 14rem;
margin: 0;
filter: alpha(opacity=0);
filter: alpha(opacity = 0);
opacity: 0;
}
.file-custom {
@@ -198,12 +201,12 @@
background-color: #fff;
border: .075rem solid #ddd;
border-radius: .25rem;
box-shadow: inset 0 .2rem .4rem rgba(0,0,0,.05);
@include box-shadow(inset 0 .2rem .4rem rgba(0,0,0,.05));
}
.file-custom:after {
.file-custom::after {
content: "Choose file...";
}
.file-custom:before {
.file-custom::before {
position: absolute;
top: -.075rem;
right: -.075rem;
@@ -222,5 +225,5 @@
// Focus state
.file input:focus ~ .file-custom {
box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9;
@include box-shadow(0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9);
}

23
scss/_dropdown.scss
View File

@@ -6,7 +6,7 @@
.dropdown-toggle {
// Generate the caret automatically
&:after {
&::after {
display: inline-block;
width: 0;
height: 0;
@@ -24,6 +24,15 @@
}
}
.dropup {
.dropdown-toggle {
&::after {
border-top: 0;
border-bottom: $caret-width solid;
}
}
}
// The dropdown menu (ul)
.dropdown-menu {
position: absolute;
@@ -51,20 +60,20 @@
}
// Links, buttons, and more within the dropdown menu
//
// `<button>`-specific styles are denoted with `// for <button>s`
.dropdown-item {
display: block;
width: 100%; // For `<button>`s
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: $line-height;
color: $dropdown-link-color;
text-align: inherit; // For `<button>`s
white-space: nowrap; // prevent links from randomly breaking onto new lines
// For `<button>`s
text-align: inherit;
width: 100%;
background: none;
border: 0;
background: none; // For `<button>`s
border: 0; // For `<button>`s
@include hover-focus {
color: $dropdown-link-hover-color;

27
scss/_forms.scss
View File

@@ -50,15 +50,13 @@
// disabled if the fieldset is disabled. Due to implementation difficulty, we
// don't honor that edge case; we style them as disabled anyway.
&:disabled,
&[readonly],
fieldset[disabled] & {
&[readonly] {
background-color: $input-bg-disabled;
// iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.
opacity: 1;
}
&[disabled],
fieldset[disabled] & {
&:disabled {
cursor: $cursor-disabled;
}
}
@@ -233,24 +231,21 @@
input[type="radio"],
input[type="checkbox"] {
&:disabled,
&.disabled,
fieldset[disabled] & {
&.disabled {
cursor: $cursor-disabled;
}
}
// These classes are used directly on <label>s
.radio-inline,
.checkbox-inline {
&.disabled,
fieldset[disabled] & {
&.disabled {
cursor: $cursor-disabled;
}
}
// These classes are used on elements with <label> descendants
.radio,
.checkbox {
&.disabled,
fieldset[disabled] & {
&.disabled {
label {
cursor: $cursor-disabled;
}
@@ -266,14 +261,14 @@ input[type="checkbox"] {
.form-control-warning,
.form-control-error {
padding-right: ($input-padding-x * 3);
background-repeat: no-repeat;
background-position: center right ($input-height * .25);
background-size: ($input-height * .65) ($input-height * .65);
background-repeat: no-repeat;
}
// Form validation states
.has-success {
@include form-control-validation(success, $brand-success);
@include form-control-validation($brand-success);
.form-control-success {
background-image: url($form-icon-success);
@@ -281,7 +276,7 @@ input[type="checkbox"] {
}
.has-warning {
@include form-control-validation(warning, $brand-warning);
@include form-control-validation($brand-warning);
.form-control-warning {
background-image: url($form-icon-warning);
@@ -289,7 +284,7 @@ input[type="checkbox"] {
}
.has-error {
@include form-control-validation(error, $brand-danger);
@include form-control-validation($brand-danger);
.form-control-error {
background-image: url($form-icon-error);
@@ -384,7 +379,7 @@ input[type="checkbox"] {
// Requires wrapping inputs and labels with `.form-group` for proper display of
// default HTML form controls and our custom form controls (e.g., input groups).
//
// Heads up! This is mixin-ed into `.navbar-form` in navbars.less.
// Heads up! This is mixin-ed into `.navbar-form` in _navbar.scss.
.form-inline {
@@ -425,7 +420,7 @@ input[type="checkbox"] {
width: 100%;
}
.control-label {
.form-control-label {
margin-bottom: 0;
vertical-align: middle;
}

19
scss/_grid.scss
View File

@@ -4,13 +4,8 @@
.container {
@include make-container();
@include make-container-max-widths();
// For each breakpoint, define the maximum width of the container in a media query
@each $breakpoint, $container-max-width in $container-max-widths {
@include media-breakpoint-up($breakpoint) {
max-width: $container-max-width;
}
}
}
@@ -28,8 +23,10 @@
//
// Rows contain and clear the floats of your columns.
.row {
@include make-row();
@if $enable-grid-classes {
.row {
@include make-row();
}
}
@@ -37,14 +34,16 @@
//
// Common styles for small and large grid columns
@include make-grid-columns();
@if $enable-grid-classes {
@include make-grid-columns();
}
// Flex variation
//
// Custom styles for additional flex alignment options.
@if $enable-flex {
@if $enable-flex and $enable-grid-classes {
// Flex column reordering

6
scss/_images.scss
View File

@@ -1,6 +1,6 @@
// Responsive images (ensure images don't scale beyond their parents)
.img-responsive {
@include img-responsive();
.img-fluid {
@include img-fluid();
}
// Rounded corners
@@ -19,7 +19,7 @@
@include box-shadow(0 1px 2px rgba(0,0,0,.075));
// Keep them at most 100% wide
@include img-responsive(inline-block);
@include img-fluid(inline-block);
}
// Perfect circle

2
scss/_input-group.scss
View File

@@ -97,7 +97,7 @@
@include border-radius($border-radius-sm);
}
&.form-control-lg {
padding: $input-padding-x-lg $input-padding-x-lg;
padding: $input-padding-y-lg $input-padding-x-lg;
font-size: $font-size-lg;
@include border-radius($border-radius-lg);
}

12
scss/_labels.scss
View File

@@ -19,12 +19,12 @@
&:empty {
display: none;
}
}
// Quick fix for labels in buttons
.btn & {
position: relative;
top: -1px;
}
// Quick fix for labels in buttons
.btn .label {
position: relative;
top: -1px;
}
// Add hover effects, but only for links
@@ -41,8 +41,8 @@ a.label {
// Make them extra rounded with a modifier to replace v3's badges.
.label-pill {
padding-left: .6em;
padding-right: .6em;
padding-left: .6em;
border-radius: 1rem;
}

8
scss/_list-group.scss
View File

@@ -18,9 +18,9 @@
display: block;
padding: .75rem 1.25rem;
// Place the border on the list items and negative margin up for better styling
margin-bottom: -.0625rem;
margin-bottom: -$border-width;
background-color: $list-group-bg;
border: .0625rem solid $list-group-border;
border: $border-width solid $list-group-border;
// Round the first and last items
&:first-child {
@@ -34,7 +34,7 @@
.list-group-flush {
.list-group-item {
border-width: .0625rem 0;
border-width: $border-width 0;
border-radius: 0;
}
}
@@ -48,8 +48,8 @@
a.list-group-item,
button.list-group-item {
width: 100%;
text-align: inherit;
color: $list-group-link-color;
text-align: inherit;
.list-group-item-heading {
color: $list-group-link-heading-color;

6
scss/_media.scss
View File

@@ -6,6 +6,12 @@
.media-body {
flex: 1;
}
.media-middle {
align-self: center;
}
.media-bottom {
align-self: flex-end;
}
} @else {
.media {
margin-top: 15px;

3
scss/_mixins.scss
View File

@@ -22,18 +22,17 @@
// Utilities
@import "mixins/breakpoints";
@import "mixins/hide-text";
@import "mixins/hover";
@import "mixins/image";
@import "mixins/label";
@import "mixins/reset-filter";
@import "mixins/resize";
@import "mixins/responsive-visibility";
@import "mixins/screen-reader";
@import "mixins/size";
@import "mixins/tab-focus";
@import "mixins/reset-text";
@import "mixins/text-emphasis";
@import "mixins/text-hide";
@import "mixins/text-truncate";
// // Components

2
scss/_modal.scss
View File

@@ -26,8 +26,8 @@
// When fading in the modal, animate it to slide down
&.fade .modal-dialog {
transform: translate(0, -25%);
transition: transform .3s ease-out;
transform: translate(0, -25%);
}
&.in .modal-dialog { transform: translate(0, 0); }
}

20
scss/_navbar.scss
View File

@@ -19,8 +19,8 @@
// Display the navbar across the entirety of the page or fixed it to the top or
// bottom of the page.
// Static top (unfixed, but 100% wide) navbar
.navbar-static-top {
// A static, full width modifier with no rounded corners.
.navbar-full {
z-index: $zindex-navbar;
@include media-breakpoint-up(sm) {
@@ -35,7 +35,6 @@
right: 0;
left: 0;
z-index: $zindex-navbar-fixed;
margin-bottom: 0; // override .navbar defaults
// Undo the rounded corners
@include media-breakpoint-up(sm) {
@@ -70,9 +69,9 @@
.navbar-brand {
float: left;
margin-right: 1rem;
padding-top: .25rem;
padding-bottom: .25rem;
margin-right: 1rem;
font-size: $font-size-lg;
@include hover-focus {
@@ -90,12 +89,12 @@
width: 1px;
padding-top: .425rem;
padding-bottom: .425rem;
overflow: hidden;
margin-left: $navbar-padding-horizontal;
margin-right: $navbar-padding-horizontal;
margin-left: $navbar-padding-horizontal;
overflow: hidden;
&:before {
content: '\00a0';
&::before {
content: "\00a0";
}
}
@@ -130,6 +129,11 @@
display: block !important;
}
}
&-md {
@include media-breakpoint-up(lg) {
display: block !important;
}
}
}

14
scss/_popover.scss
View File

@@ -29,7 +29,7 @@
margin-left: -$popover-arrow-outer-width;
border-top-color: $popover-arrow-outer-color;
border-bottom-width: 0;
&:after {
&::after {
bottom: 1px;
margin-left: -$popover-arrow-width;
content: "";
@@ -49,7 +49,7 @@
margin-top: -$popover-arrow-outer-width;
border-right-color: $popover-arrow-outer-color;
border-left-width: 0;
&:after {
&::after {
bottom: -$popover-arrow-width;
left: 1px;
content: "";
@@ -69,7 +69,7 @@
margin-left: -$popover-arrow-outer-width;
border-top-width: 0;
border-bottom-color: $popover-arrow-outer-color;
&:after {
&::after {
top: 1px;
margin-left: -$popover-arrow-width;
content: "";
@@ -89,7 +89,7 @@
margin-top: -$popover-arrow-outer-width;
border-right-width: 0;
border-left-color: $popover-arrow-outer-color;
&:after {
&::after {
right: 1px;
bottom: -$popover-arrow-width;
content: "";
@@ -118,11 +118,11 @@
// Arrows
//
// .popover-arrow is outer, .popover-arrow:after is inner
// .popover-arrow is outer, .popover-arrow::after is inner
.popover-arrow {
&,
&:after {
&::after {
position: absolute;
display: block;
width: 0;
@@ -134,7 +134,7 @@
.popover-arrow {
border-width: $popover-arrow-outer-width;
}
.popover-arrow:after {
.popover-arrow::after {
content: "";
border-width: $popover-arrow-width;
}

6
scss/_print.scss
View File

@@ -7,8 +7,8 @@
@media print {
*,
*:before,
*:after {
*::before,
*::after {
text-shadow: none !important;
box-shadow: none !important;
}
@@ -18,7 +18,7 @@
text-decoration: underline;
}
abbr[title]:after {
abbr[title]::after {
content: " (" attr(title) ")";
}

10
scss/_reboot.scss
View File

@@ -1,7 +1,7 @@
// Reboot
//
// Global resets to common HTML elements and more for easier usage by Bootstrap.
// Builds on the resets of Normalize.css.
// Adds additional rules on top of Normalize.css, including several overrides.
// Reset the box-sizing
@@ -22,8 +22,8 @@ html {
}
*,
*:before,
*:after {
*::before,
*::after {
box-sizing: inherit;
}
@@ -146,7 +146,7 @@ blockquote {
a {
color: $link-color;
text-decoration: none;
text-decoration: $link-decoration;
@include hover-focus {
color: $link-hover-color;
@@ -279,6 +279,8 @@ legend {
}
input[type="search"] {
// Undo Normalize's default here to match our global overrides.
box-sizing: inherit;
// This overrides the extra rounded corners on search inputs in iOS so that our
// `.form-control` class can properly style them. Note that this cannot simply
// be added to `.form-control` as it's not specific enough. For details, see

10
scss/_type.scss
View File

@@ -143,7 +143,7 @@ mark,
line-height: $line-height;
color: $blockquote-small-color;
&:before {
&::before {
content: "\2014 \00A0"; // em dash, nbsp
}
}
@@ -159,8 +159,8 @@ mark,
// Account for citation
footer {
&:before { content: ""; }
&:after {
&::before { content: ""; }
&::after {
content: "\00A0 \2014"; // nbsp, em dash
}
}
@@ -175,9 +175,9 @@ mark,
display: inline-block;
> img {
@extend .img-responsive;
line-height: 1;
@extend .img-fluid;
margin-bottom: ($spacer-y / 2);
line-height: 1;
}
}

2
scss/_utilities-responsive.scss
View File

@@ -44,6 +44,6 @@
.hidden-print {
@media print {
@include responsive-invisibility(".hidden-print");
display: none !important;
}
}

2
scss/_utilities-spacing.scss
View File

@@ -40,7 +40,7 @@
.p-r-0 { padding-right: 0 !important; }
.p-b-0 { padding-bottom: 0 !important; }
.p-l-0 { padding-left: 0 !important; }
.p-x-0 { padding-left: 0 !important; padding-right: 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: $spacer !important; }

63
scss/_variables.scss
View File

@@ -49,6 +49,7 @@ $enable-shadows: false !default;
$enable-gradients: false !default;
$enable-transitions: false !default;
$enable-hover-media-query: false !default;
$enable-grid-classes: true !default;
// Spacing
@@ -75,6 +76,7 @@ $body-color: $gray-dark !default;
// Style anchor elements.
$link-color: $brand-primary !default;
$link-decoration: none !default;
$link-hover-color: darken($link-color, 15%) !default;
$link-hover-decoration: underline !default;
@@ -142,10 +144,10 @@ $font-size-h4: 1.5rem !default;
$font-size-h5: 1.25rem !default;
$font-size-h6: 1rem !default;
$display1-size: 3.5rem !default;
$display2-size: 4.5rem !default;
$display3-size: 5.5rem !default;
$display4-size: 6rem !default;
$display1-size: 6rem !default;
$display2-size: 5.5rem !default;
$display3-size: 4.5rem !default;
$display4-size: 3.5rem !default;
$display1-weight: 300 !default;
$display2-weight: 300 !default;
@@ -172,14 +174,14 @@ $blockquote-font-size: ($font-size-base * 1.25) !default;
$blockquote-border-color: $gray-lighter !default;
$hr-border-color: rgba(0,0,0,.1) !default;
$hr-border-width: $border-width;
$hr-border-width: $border-width !default;
// Components
//
// Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
$line-height-lg: (4/3) !default;
$line-height-lg: (4 / 3) !default;
$line-height-sm: 1.5 !default;
$border-radius: .25rem !default;
@@ -212,8 +214,8 @@ $table-border-color: $gray-lighter !default;
//
// For each of Bootstrap's buttons, define text, background and border color.
$btn-padding-x: 1rem;
$btn-padding-y: .375rem;
$btn-padding-x: 1rem !default;
$btn-padding-y: .375rem !default;
$btn-font-weight: normal !default;
$btn-primary-color: #fff !default;
@@ -249,9 +251,9 @@ $btn-padding-x-lg: 1.25rem !default;
$btn-padding-y-lg: .75rem !default;
// Allows for customizing button radius independently from global border radius
$btn-border-radius: $border-radius;
$btn-border-radius-lg: $border-radius-lg;
$btn-border-radius-sm: $border-radius-sm;
$btn-border-radius: $border-radius !default;
$btn-border-radius-lg: $border-radius-lg !default;
$btn-border-radius-sm: $border-radius-sm !default;
// Forms
@@ -285,7 +287,7 @@ $input-height: (($font-size-base * $line-height) + ($input-pad
$input-height-lg: (($font-size-lg * $line-height-lg) + ($input-padding-y-lg * 2) + ($border-width * 2)) !default;
$input-height-sm: (($font-size-sm * $line-height-sm) + ($input-padding-y-sm * 2) + ($border-width * 2)) !default;
$form-group-margin-bottom: 15px;
$form-group-margin-bottom: $spacer-y !default;
$input-group-addon-bg: $gray-lighter !default;
$input-group-addon-border-color: $input-border !default;
@@ -293,9 +295,15 @@ $input-group-addon-border-color: $input-border !default;
$cursor-disabled: not-allowed !default;
// Form validation icons
<<<<<<< HEAD
$form-icon-success: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2MTIgNzkyIj48cGF0aCBmaWxsPSIjNWNiODVjIiBkPSJNMjMzLjggNjEwYy0xMy4zIDAtMjYtNi0zNC0xNi44TDkwLjUgNDQ4LjhDNzYuMyA0MzAgODAgNDAzLjMgOTguOCAzODljMTguOC0xNC4yIDQ1LjUtMTAuNCA1OS44IDguNGw3MiA5NUw0NTEuMyAyNDJjMTIuNS0yMCAzOC44LTI2LjIgNTguOC0xMy43IDIwIDEyLjQgMjYgMzguNyAxMy43IDU4LjhMMjcwIDU5MGMtNy40IDEyLTIwLjIgMTkuNC0zNC4zIDIwaC0yeiIvPjwvc3ZnPg==";
$form-icon-warning: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2MTIgNzkyIj48cGF0aCBmaWxsPSIjZjBhZDRlIiBkPSJNNjAzIDY0MC4ybC0yNzguNS01MDljLTMuOC02LjYtMTAuOC0xMC42LTE4LjUtMTAuNnMtMTQuNyA0LTE4LjUgMTAuNkw5IDY0MC4yYy0zLjcgNi41LTMuNiAxNC40LjIgMjAuOCAzLjggNi41IDEwLjggMTAuNCAxOC4zIDEwLjRoNTU3YzcuNiAwIDE0LjYtNCAxOC40LTEwLjQgMy41LTYuNCAzLjYtMTQuNCAwLTIwLjh6bS0yNjYuNC0zMGgtNjEuMlY1NDloNjEuMnY2MS4yem0wLTEwN2gtNjEuMlYzMDRoNjEuMnYxOTl6Ii8+PC9zdmc+";
$form-icon-error: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2MTIgNzkyIj48cGF0aCBmaWxsPSIjZDk1MzRmIiBkPSJNNDQ3IDU0NC40Yy0xNC40IDE0LjQtMzcuNiAxNC40LTUyIDBsLTg5LTkyLjctODkgOTIuN2MtMTQuNSAxNC40LTM3LjcgMTQuNC01MiAwLTE0LjQtMTQuNC0xNC40LTM3LjYgMC01Mmw5Mi40LTk2LjMtOTIuNC05Ni4zYy0xNC40LTE0LjQtMTQuNC0zNy42IDAtNTJzMzcuNi0xNC4zIDUyIDBsODkgOTIuOCA4OS4yLTkyLjdjMTQuNC0xNC40IDM3LjYtMTQuNCA1MiAwIDE0LjMgMTQuNCAxNC4zIDM3LjYgMCA1MkwzNTQuNiAzOTZsOTIuNCA5Ni40YzE0LjQgMTQuNCAxNC40IDM3LjYgMCA1MnoiLz48L3N2Zz4=";
=======
$form-icon-success: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNoZWNrIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDYxMiA3OTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYxMiA3OTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGZpbGw9IiM1Q0I4NUMiIGQ9Ik0yMzMuOCw2MTAuMWMtMTMuMywwLTI1LjktNi4yLTM0LTE2LjlMOTAuNSw0NDguOEM3Ni4zLDQzMCw4MCw0MDMuMyw5OC44LDM4OS4xYzE4LjgtMTQuMyw0NS41LTEwLjUsNTkuOCw4LjNsNzEuOSw5NWwyMjAuOS0yNTAuNWMxMi41LTIwLDM4LjgtMjYuMSw1OC44LTEzLjZjMjAsMTIuNCwyNi4xLDM4LjcsMTMuNiw1OC44TDI3MCw1OTBjLTcuNCwxMi0yMC4yLDE5LjQtMzQuMywyMC4xQzIzNS4xLDYxMC4xLDIzNC41LDYxMC4xLDIzMy44LDYxMC4xeiIvPjwvc3ZnPg==" !default;
$form-icon-warning: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9Ildhcm5pbmciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgNjEyIDc5MiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNjEyIDc5MiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZmlsbD0iI0YwQUQ0RSIgZD0iTTYwMyw2NDAuMmwtMjc4LjUtNTA5Yy0zLjgtNi42LTEwLjgtMTAuNi0xOC41LTEwLjZzLTE0LjcsNC4xLTE4LjUsMTAuNkw5LDY0MC4yYy0zLjcsNi41LTMuNiwxNC40LDAuMiwyMC44YzMuOCw2LjUsMTAuOCwxMC40LDE4LjMsMTAuNGg1NTcuMWM3LjUsMCwxNC41LTMuOSwxOC4zLTEwLjRDNjA2LjYsNjU0LjYsNjA2LjcsNjQ2LjYsNjAzLDY0MC4yeiBNMzM2LjYsNjEwLjJoLTYxLjJWNTQ5aDYxLjJWNjEwLjJ6IE0zMzYuNiw1MDMuMWgtNjEuMlYzMDQuMmg2MS4yVjUwMy4xeiIvPjwvc3ZnPg==" !default;
$form-icon-error: "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNyb3NzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDYxMiA3OTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYxMiA3OTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGZpbGw9IiNEOTUzNEYiIGQ9Ik00NDcsNTQ0LjRjLTE0LjQsMTQuNC0zNy42LDE0LjQtNTEuOSwwTDMwNiw0NTEuN2wtODkuMSw5Mi43Yy0xNC40LDE0LjQtMzcuNiwxNC40LTUxLjksMGMtMTQuNC0xNC40LTE0LjQtMzcuNiwwLTUxLjlsOTIuNC05Ni40TDE2NSwyOTkuNmMtMTQuNC0xNC40LTE0LjQtMzcuNiwwLTUxLjlzMzcuNi0xNC40LDUxLjksMGw4OS4yLDkyLjdsODkuMS05Mi43YzE0LjQtMTQuNCwzNy42LTE0LjQsNTEuOSwwYzE0LjQsMTQuNCwxNC40LDM3LjYsMCw1MS45TDM1NC43LDM5Nmw5Mi40LDk2LjRDNDYxLjQsNTA2LjgsNDYxLjQsNTMwLDQ0Nyw1NDQuNHoiLz48L3N2Zz4=" !default;
>>>>>>> twbs/v4-dev
// Dropdowns
@@ -341,15 +349,15 @@ $navbar-border-radius: $border-radius !default;
$navbar-padding-horizontal: $spacer !default;
$navbar-padding-vertical: ($spacer / 2) !default;
$navbar-dark-color: rgba(255,255,255,.5);
$navbar-dark-hover-color: rgba(255,255,255,.75);
$navbar-dark-active-color: rgba(255,255,255,1);
$navbar-dark-disabled-color: rgba(255,255,255,.25);
$navbar-dark-color: rgba(255,255,255,.5) !default;
$navbar-dark-hover-color: rgba(255,255,255,.75) !default;
$navbar-dark-active-color: rgba(255,255,255,1) !default;
$navbar-dark-disabled-color: rgba(255,255,255,.25) !default;
$navbar-light-color: rgba(0,0,0,.3);
$navbar-light-hover-color: rgba(0,0,0,.6);
$navbar-light-active-color: rgba(0,0,0,.8);
$navbar-light-disabled-color: rgba(0,0,0,.15);
$navbar-light-color: rgba(0,0,0,.3) !default;
$navbar-light-hover-color: rgba(0,0,0,.6) !default;
$navbar-light-active-color: rgba(0,0,0,.8) !default;
$navbar-light-disabled-color: rgba(0,0,0,.15) !default;
// Navs
@@ -445,14 +453,13 @@ $state-danger-border: darken($state-danger-bg, 5%) !default;
// Cards
$card-spacer-x: 1.25rem;
$card-spacer-y: .75rem;
$card-border-width: .0625rem;
$card-border-radius: .25rem;
$card-border-color: #e5e5e5;
$card-border-radius-inner: ($card-border-radius - $card-border-width);
$card-cap-bg: #f5f5f5;
$card-spacer-x: 1.25rem !default;
$card-spacer-y: .75rem !default;
$card-border-width: .0625rem !default;
$card-border-radius: .25rem !default;
$card-border-color: #e5e5e5 !default;
$card-border-radius-inner: ($card-border-radius - $card-border-width) !default;
$card-cap-bg: #f5f5f5 !default;
// Tooltips

8
scss/bootstrap.scss vendored
View File

@@ -1,4 +1,10 @@
// Core variables and mixins
/*!
* Bootstrap v4.0.0-alpha (http://getbootstrap.com)
* Copyright 2011-2015 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
// Core variables and mixins
@import "variables";
@import "mixins";

24
scss/mixins/_border-radius.scss
View File

@@ -1,21 +1,29 @@
// Single side border-radius
@mixin border-top-radius($radius) {
border-top-right-radius: $radius;
border-top-left-radius: $radius;
@if $enable-rounded {
border-top-right-radius: $radius;
border-top-left-radius: $radius;
}
}
@mixin border-right-radius($radius) {
border-bottom-right-radius: $radius;
border-top-right-radius: $radius;
@if $enable-rounded {
border-bottom-right-radius: $radius;
border-top-right-radius: $radius;
}
}
@mixin border-bottom-radius($radius) {
border-bottom-right-radius: $radius;
border-bottom-left-radius: $radius;
@if $enable-rounded {
border-bottom-right-radius: $radius;
border-bottom-left-radius: $radius;
}
}
@mixin border-left-radius($radius) {
border-bottom-left-radius: $radius;
border-top-left-radius: $radius;
@if $enable-rounded {
border-bottom-left-radius: $radius;
border-top-left-radius: $radius;
}
}

46
scss/mixins/_buttons.scss
View File

@@ -4,39 +4,48 @@
// and disabled options for all buttons
@mixin button-variant($color, $background, $border) {
color: $color;
background-color: $background;
border-color: $border;
// $shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
// .box-shadow($shadow);
$active-background: darken($background, 10%);
$active-border: darken($border, 12%);
&:focus,
&.focus,
&:active,
&.active,
.open > &.dropdown-toggle {
color: $color;
background-color: $active-background;
border-color: $active-border;
}
color: $color;
background-color: $background;
border-color: $border;
@include box-shadow(inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075));
@include hover {
color: $color;
background-color: $active-background;
border-color: $active-border;
}
&:focus,
&.focus {
color: $color;
background-color: $active-background;
border-color: $active-border;
}
&:active,
&.active,
.open > &.dropdown-toggle {
color: $color;
background-color: $active-background;
border-color: $active-border;
// Remove the gradient for the pressed/active state
background-image: none;
@include box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
&:hover,
&:focus,
&.focus {
color: $color;
background-color: darken($background, 17%);
border-color: darken($border, 25%);
}
}
&.disabled,
&:disabled,
fieldset[disabled] & {
&:disabled {
&:focus,
&.focus {
background-color: $background;
@@ -71,8 +80,7 @@
}
&.disabled,
&:disabled,
fieldset[disabled] & {
&:disabled {
&:focus,
&.focus {
border-color: lighten($color, 20%);

21
scss/mixins/_clearfix.scss
View File

@@ -1,22 +1,7 @@
// Clearfix
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
// contenteditable attribute is included anywhere else in the document.
// Otherwise it causes space to appear at the top and bottom of elements
// that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
// `:before` to contain the top-margins of child elements.
//
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
@mixin clearfix() {
&:before,
&:after {
content: " "; // 1
display: table; // 2
}
&:after {
&::after {
content: "";
display: table;
clear: both;
}
}

4
scss/mixins/_forms.scss
View File

@@ -3,10 +3,10 @@
// Used in _forms.scss to generate the form validation CSS for warnings, errors,
// and successes.
@mixin form-control-validation($state, $color) {
@mixin form-control-validation($color) {
// Color the label and help text
.help-block,
.control-label,
.form-control-label,
.radio,
.checkbox,
.radio-inline,

10
scss/mixins/_grid.scss
View File

@@ -10,6 +10,16 @@
@include clearfix();
}
// For each breakpoint, define the maximum width of the container in a media query
@mixin make-container-max-widths($max-widths: $container-max-widths) {
@each $breakpoint, $container-max-width in $max-widths {
@include media-breakpoint-up($breakpoint) {
max-width: $container-max-width;
}
}
}
@mixin make-row($gutter: $grid-gutter-width) {
@if $enable-flex {
display: flex;

6
scss/mixins/_image.scss
View File

@@ -7,7 +7,7 @@
//
// Keep images from scaling beyond the width of their parents.
@mixin img-responsive($display: block) {
@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
@@ -19,7 +19,7 @@
// Short retina mixin for setting background-image and -size.
@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
background-image: url("#{file-1x}");
background-image: url($file-1x);
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
@@ -27,7 +27,7 @@
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
background-image: url("#{file-2x}");
background-image: url($file-2x);
background-size: $width-1x $height-1x;
}
}

6
scss/mixins/_list-group.scss
View File

@@ -1,13 +1,13 @@
// List Groups
@mixin list-group-item-variant($state, $background, $color) {
.list-group-item-#{state} {
.list-group-item-#{$state} {
color: $color;
background-color: $background;
}
a.list-group-item-#{state},
button.list-group-item-#{state} {
a.list-group-item-#{$state},
button.list-group-item-#{$state} {
color: $color;
.list-group-item-heading {

21
scss/mixins/_responsive-visibility.scss
View File

@@ -1,21 +0,0 @@
// Responsive utilities
//
// More easily include all the states for responsive-utilities.less.
// [converter] $parent hack
@mixin responsive-visibility($parent) {
#{$parent} {
display: block !important;
}
table#{$parent} { display: table !important; }
tr#{$parent} { display: table-row !important; }
th#{$parent},
td#{$parent} { display: table-cell !important; }
}
// [converter] $parent hack
@mixin responsive-invisibility($parent) {
#{$parent} {
display: none !important;
}
}

6
scss/mixins/_size.scss
View File

@@ -1,10 +1,6 @@
// Sizing shortcuts
@mixin size($width, $height) {
@mixin size($width, $height: $width) {
width: $width;
height: $height;
}
@mixin square($size) {
@include size($size, $size);
}

0
scss/mixins/_hide-text.scss → scss/mixins/_text-hide.scss
View File