mirror of
https://github.com/gcushen/hugo-academic.git
synced 2025-07-27 03:25:16 +02:00
refactor: format code
This commit is contained in:
gcushen
GitHub Action
parent
68c25ddc4a
commit
067b2a7f09
71 changed files with 2612 additions and 2098 deletions
|
|
@ -27,5 +27,5 @@
|
||||||
border: 0;
|
border: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 1px 0;
|
padding: 1px 0;
|
||||||
font-family: MJXc-TeX-math-I,MJXc-TeX-math-Ix,MJXc-TeX-math-Iw;
|
font-family: MJXc-TeX-math-I, MJXc-TeX-math-Ix, MJXc-TeX-math-Iw;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
1425
wowchemy/assets/js/_vendor/bootstrap.bundle.js
vendored
1425
wowchemy/assets/js/_vendor/bootstrap.bundle.js
vendored
File diff suppressed because it is too large
Load diff
|
|
@ -179,7 +179,7 @@ if (typeof Fuse === 'function') {
|
||||||
let fuse = new Fuse(search_index, fuseOptions);
|
let fuse = new Fuse(search_index, fuseOptions);
|
||||||
|
|
||||||
// On page load, check for search query in URL.
|
// On page load, check for search query in URL.
|
||||||
let query = getSearchQuery('q')
|
let query = getSearchQuery('q');
|
||||||
if (query) {
|
if (query) {
|
||||||
$('body').addClass('searching');
|
$('body').addClass('searching');
|
||||||
$('.search-results').css({opacity: 0, visibility: 'visible'}).animate({opacity: 1}, 200);
|
$('.search-results').css({opacity: 0, visibility: 'visible'}).animate({opacity: 1}, 200);
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,6 @@
|
||||||
font-weight: $alert-link-font-weight;
|
font-weight: $alert-link-font-weight;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Dismissible alerts
|
// Dismissible alerts
|
||||||
//
|
//
|
||||||
// Expand the right padding and account for the close button's positioning.
|
// Expand the right padding and account for the close button's positioning.
|
||||||
|
|
@ -39,13 +38,16 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Alternate styles
|
// Alternate styles
|
||||||
//
|
//
|
||||||
// Generate contextual modifier classes for colorizing the alert.
|
// Generate contextual modifier classes for colorizing the alert.
|
||||||
|
|
||||||
@each $color, $value in $theme-colors {
|
@each $color, $value in $theme-colors {
|
||||||
.alert-#{$color} {
|
.alert-#{$color} {
|
||||||
@include alert-variant(theme-color-level($color, $alert-bg-level), theme-color-level($color, $alert-border-level), theme-color-level($color, $alert-color-level));
|
@include alert-variant(
|
||||||
|
theme-color-level($color, $alert-bg-level),
|
||||||
|
theme-color-level($color, $alert-border-level),
|
||||||
|
theme-color-level($color, $alert-color-level)
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -58,17 +58,20 @@
|
||||||
//
|
//
|
||||||
// Remix the default button sizing classes into new ones for easier manipulation.
|
// Remix the default button sizing classes into new ones for easier manipulation.
|
||||||
|
|
||||||
.btn-group-sm > .btn { @extend .btn-sm; }
|
.btn-group-sm > .btn {
|
||||||
.btn-group-lg > .btn { @extend .btn-lg; }
|
@extend .btn-sm;
|
||||||
|
}
|
||||||
|
.btn-group-lg > .btn {
|
||||||
|
@extend .btn-lg;
|
||||||
|
}
|
||||||
|
|
||||||
//
|
//
|
||||||
// Split button dropdowns
|
// Split button dropdowns
|
||||||
//
|
//
|
||||||
|
|
||||||
.dropdown-toggle-split {
|
.dropdown-toggle-split {
|
||||||
padding-right: $btn-padding-x * .75;
|
padding-right: $btn-padding-x * 0.75;
|
||||||
padding-left: $btn-padding-x * .75;
|
padding-left: $btn-padding-x * 0.75;
|
||||||
|
|
||||||
&::after,
|
&::after,
|
||||||
.dropup &::after,
|
.dropup &::after,
|
||||||
|
|
@ -82,16 +85,15 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-sm + .dropdown-toggle-split {
|
.btn-sm + .dropdown-toggle-split {
|
||||||
padding-right: $btn-padding-x-sm * .75;
|
padding-right: $btn-padding-x-sm * 0.75;
|
||||||
padding-left: $btn-padding-x-sm * .75;
|
padding-left: $btn-padding-x-sm * 0.75;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-lg + .dropdown-toggle-split {
|
.btn-lg + .dropdown-toggle-split {
|
||||||
padding-right: $btn-padding-x-lg * .75;
|
padding-right: $btn-padding-x-lg * 0.75;
|
||||||
padding-left: $btn-padding-x-lg * .75;
|
padding-left: $btn-padding-x-lg * 0.75;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// The clickable button for toggling the menu
|
// The clickable button for toggling the menu
|
||||||
// Set the same inset shadow as the :active state
|
// Set the same inset shadow as the :active state
|
||||||
.btn-group.show .dropdown-toggle {
|
.btn-group.show .dropdown-toggle {
|
||||||
|
|
@ -103,7 +105,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Vertical button groups
|
// Vertical button groups
|
||||||
//
|
//
|
||||||
|
|
@ -135,7 +136,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Checkbox and radio options
|
// Checkbox and radio options
|
||||||
//
|
//
|
||||||
// In order to support the browser's form validation feedback, powered by the
|
// In order to support the browser's form validation feedback, powered by the
|
||||||
|
|
@ -153,8 +153,8 @@
|
||||||
> .btn-group > .btn {
|
> .btn-group > .btn {
|
||||||
margin-bottom: 0; // Override default `<label>` value
|
margin-bottom: 0; // Override default `<label>` value
|
||||||
|
|
||||||
input[type="radio"],
|
input[type='radio'],
|
||||||
input[type="checkbox"] {
|
input[type='checkbox'] {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
clip: rect(0, 0, 0, 0);
|
clip: rect(0, 0, 0, 0);
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
|
||||||
|
|
@ -53,7 +53,6 @@ fieldset:disabled a.btn {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Alternate buttons
|
// Alternate buttons
|
||||||
//
|
//
|
||||||
|
|
@ -70,7 +69,6 @@ fieldset:disabled a.btn {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Link buttons
|
// Link buttons
|
||||||
//
|
//
|
||||||
|
|
@ -101,20 +99,30 @@ fieldset:disabled a.btn {
|
||||||
// No need for an active state here
|
// No need for an active state here
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Button Sizes
|
// Button Sizes
|
||||||
//
|
//
|
||||||
|
|
||||||
.btn-lg {
|
.btn-lg {
|
||||||
@include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
|
@include button-size(
|
||||||
|
$btn-padding-y-lg,
|
||||||
|
$btn-padding-x-lg,
|
||||||
|
$btn-font-size-lg,
|
||||||
|
$btn-line-height-lg,
|
||||||
|
$btn-border-radius-lg
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-sm {
|
.btn-sm {
|
||||||
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
|
@include button-size(
|
||||||
|
$btn-padding-y-sm,
|
||||||
|
$btn-padding-x-sm,
|
||||||
|
$btn-font-size-sm,
|
||||||
|
$btn-line-height-sm,
|
||||||
|
$btn-border-radius-sm
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Block button
|
// Block button
|
||||||
//
|
//
|
||||||
|
|
@ -130,9 +138,9 @@ fieldset:disabled a.btn {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Specificity overrides
|
// Specificity overrides
|
||||||
input[type="submit"],
|
input[type='submit'],
|
||||||
input[type="reset"],
|
input[type='reset'],
|
||||||
input[type="button"] {
|
input[type='button'] {
|
||||||
&.btn-block {
|
&.btn-block {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -98,7 +98,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Header navs
|
// Header navs
|
||||||
//
|
//
|
||||||
|
|
@ -142,7 +141,6 @@
|
||||||
@include border-bottom-radius($card-inner-border-radius);
|
@include border-bottom-radius($card-inner-border-radius);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Card deck
|
// Card deck
|
||||||
|
|
||||||
.card-deck {
|
.card-deck {
|
||||||
|
|
@ -166,7 +164,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Card groups
|
// Card groups
|
||||||
//
|
//
|
||||||
|
|
@ -229,7 +226,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Columns
|
// Columns
|
||||||
//
|
//
|
||||||
|
|
@ -252,7 +248,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Accordion
|
// Accordion
|
||||||
//
|
//
|
||||||
|
|
|
||||||
|
|
@ -52,7 +52,6 @@
|
||||||
transform: translateX(-100%);
|
transform: translateX(-100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Alternate transitions
|
// Alternate transitions
|
||||||
//
|
//
|
||||||
|
|
@ -79,7 +78,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Left/right controls for nav
|
// Left/right controls for nav
|
||||||
//
|
//
|
||||||
|
|
@ -111,13 +109,13 @@
|
||||||
.carousel-control-prev {
|
.carousel-control-prev {
|
||||||
left: 0;
|
left: 0;
|
||||||
@if $enable-gradients {
|
@if $enable-gradients {
|
||||||
background-image: linear-gradient(90deg, rgba($black, .25), rgba($black, .001));
|
background-image: linear-gradient(90deg, rgba($black, 0.25), rgba($black, 0.001));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.carousel-control-next {
|
.carousel-control-next {
|
||||||
right: 0;
|
right: 0;
|
||||||
@if $enable-gradients {
|
@if $enable-gradients {
|
||||||
background-image: linear-gradient(270deg, rgba($black, .25), rgba($black, .001));
|
background-image: linear-gradient(270deg, rgba($black, 0.25), rgba($black, 0.001));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -136,7 +134,6 @@
|
||||||
background-image: escape-svg($carousel-control-next-icon-bg);
|
background-image: escape-svg($carousel-control-next-icon-bg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Optional indicator pips
|
// Optional indicator pips
|
||||||
//
|
//
|
||||||
// Add an ordered list with the following class and add a list item for each
|
// Add an ordered list with the following class and add a list item for each
|
||||||
|
|
@ -170,7 +167,7 @@
|
||||||
// Use transparent borders to increase the hit area by 10px on top and bottom.
|
// Use transparent borders to increase the hit area by 10px on top and bottom.
|
||||||
border-top: $carousel-indicator-hit-area-height solid transparent;
|
border-top: $carousel-indicator-hit-area-height solid transparent;
|
||||||
border-bottom: $carousel-indicator-hit-area-height solid transparent;
|
border-bottom: $carousel-indicator-hit-area-height solid transparent;
|
||||||
opacity: .5;
|
opacity: 0.5;
|
||||||
@include transition($carousel-indicator-transition);
|
@include transition($carousel-indicator-transition);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -179,7 +176,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Optional captions
|
// Optional captions
|
||||||
//
|
//
|
||||||
//
|
//
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
color: $close-color;
|
color: $close-color;
|
||||||
text-shadow: $close-text-shadow;
|
text-shadow: $close-text-shadow;
|
||||||
opacity: .5;
|
opacity: 0.5;
|
||||||
|
|
||||||
// Override <a>'s hover style
|
// Override <a>'s hover style
|
||||||
@include hover() {
|
@include hover() {
|
||||||
|
|
@ -15,7 +15,7 @@
|
||||||
|
|
||||||
&:not(:disabled):not(.disabled) {
|
&:not(:disabled):not(.disabled) {
|
||||||
@include hover-focus() {
|
@include hover-focus() {
|
||||||
opacity: .75;
|
opacity: 0.75;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,6 @@
|
||||||
// Released under MIT and copyright 2014 Waybury.
|
// Released under MIT and copyright 2014 Waybury.
|
||||||
// https://useiconic.com/open
|
// https://useiconic.com/open
|
||||||
|
|
||||||
|
|
||||||
// Checkboxes and radios
|
// Checkboxes and radios
|
||||||
//
|
//
|
||||||
// Base class takes care of all the key behavioral aspects.
|
// Base class takes care of all the key behavioral aspects.
|
||||||
|
|
@ -87,7 +86,7 @@
|
||||||
width: $custom-control-indicator-size;
|
width: $custom-control-indicator-size;
|
||||||
height: $custom-control-indicator-size;
|
height: $custom-control-indicator-size;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
content: "";
|
content: '';
|
||||||
background-color: $custom-control-indicator-bg;
|
background-color: $custom-control-indicator-bg;
|
||||||
border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
|
border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
|
||||||
@include box-shadow($custom-control-indicator-box-shadow);
|
@include box-shadow($custom-control-indicator-box-shadow);
|
||||||
|
|
@ -101,12 +100,11 @@
|
||||||
display: block;
|
display: block;
|
||||||
width: $custom-control-indicator-size;
|
width: $custom-control-indicator-size;
|
||||||
height: $custom-control-indicator-size;
|
height: $custom-control-indicator-size;
|
||||||
content: "";
|
content: '';
|
||||||
background: no-repeat 50% / #{$custom-control-indicator-bg-size};
|
background: no-repeat 50% / #{$custom-control-indicator-bg-size};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Checkboxes
|
// Checkboxes
|
||||||
//
|
//
|
||||||
// Tweak just a few things for checkboxes.
|
// Tweak just a few things for checkboxes.
|
||||||
|
|
@ -166,7 +164,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// switches
|
// switches
|
||||||
//
|
//
|
||||||
// Tweak a few things for switches
|
// Tweak a few things for switches
|
||||||
|
|
@ -184,14 +181,17 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
top: add(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2, $custom-control-indicator-border-width * 2);
|
top: add(
|
||||||
|
($font-size-base * $line-height-base - $custom-control-indicator-size) / 2,
|
||||||
|
$custom-control-indicator-border-width * 2
|
||||||
|
);
|
||||||
left: add(-($custom-switch-width + $custom-control-gutter), $custom-control-indicator-border-width * 2);
|
left: add(-($custom-switch-width + $custom-control-gutter), $custom-control-indicator-border-width * 2);
|
||||||
width: $custom-switch-indicator-size;
|
width: $custom-switch-indicator-size;
|
||||||
height: $custom-switch-indicator-size;
|
height: $custom-switch-indicator-size;
|
||||||
background-color: $custom-control-indicator-border-color;
|
background-color: $custom-control-indicator-border-color;
|
||||||
// stylelint-disable-next-line property-blacklist
|
// stylelint-disable-next-line property-blacklist
|
||||||
border-radius: $custom-switch-indicator-border-radius;
|
border-radius: $custom-switch-indicator-border-radius;
|
||||||
@include transition(transform .15s ease-in-out, $custom-forms-transition);
|
@include transition(transform 0.15s ease-in-out, $custom-forms-transition);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -209,7 +209,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Select
|
// Select
|
||||||
//
|
//
|
||||||
// Replaces the browser default select with a custom one, mostly pulled from
|
// Replaces the browser default select with a custom one, mostly pulled from
|
||||||
|
|
@ -220,7 +219,8 @@
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: $custom-select-height;
|
height: $custom-select-height;
|
||||||
padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
|
padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding)
|
||||||
|
$custom-select-padding-y $custom-select-padding-x;
|
||||||
font-family: $custom-select-font-family;
|
font-family: $custom-select-font-family;
|
||||||
@include font-size($custom-select-font-size);
|
@include font-size($custom-select-font-size);
|
||||||
font-weight: $custom-select-font-weight;
|
font-weight: $custom-select-font-weight;
|
||||||
|
|
@ -254,7 +254,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&[multiple],
|
&[multiple],
|
||||||
&[size]:not([size="1"]) {
|
&[size]:not([size='1']) {
|
||||||
height: auto;
|
height: auto;
|
||||||
padding-right: $custom-select-padding-x;
|
padding-right: $custom-select-padding-x;
|
||||||
background-image: none;
|
background-image: none;
|
||||||
|
|
@ -293,7 +293,6 @@
|
||||||
@include font-size($custom-select-font-size-lg);
|
@include font-size($custom-select-font-size-lg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// File
|
// File
|
||||||
//
|
//
|
||||||
// Custom file input.
|
// Custom file input.
|
||||||
|
|
@ -364,7 +363,7 @@
|
||||||
padding: $custom-file-padding-y $custom-file-padding-x;
|
padding: $custom-file-padding-y $custom-file-padding-x;
|
||||||
line-height: $custom-file-line-height;
|
line-height: $custom-file-line-height;
|
||||||
color: $custom-file-button-color;
|
color: $custom-file-button-color;
|
||||||
content: "Browse";
|
content: 'Browse';
|
||||||
@include gradient-bg($custom-file-button-bg);
|
@include gradient-bg($custom-file-button-bg);
|
||||||
border-left: inherit;
|
border-left: inherit;
|
||||||
@include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
|
@include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
|
||||||
|
|
@ -389,9 +388,15 @@
|
||||||
|
|
||||||
// Pseudo-elements must be split across multiple rulesets to have an effect.
|
// Pseudo-elements must be split across multiple rulesets to have an effect.
|
||||||
// No box-shadow() mixin for focus accessibility.
|
// No box-shadow() mixin for focus accessibility.
|
||||||
&::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
|
&::-webkit-slider-thumb {
|
||||||
&::-moz-range-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
|
box-shadow: $custom-range-thumb-focus-box-shadow;
|
||||||
&::-ms-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
|
}
|
||||||
|
&::-moz-range-thumb {
|
||||||
|
box-shadow: $custom-range-thumb-focus-box-shadow;
|
||||||
|
}
|
||||||
|
&::-ms-thumb {
|
||||||
|
box-shadow: $custom-range-thumb-focus-box-shadow;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&::-moz-focus-outer {
|
&::-moz-focus-outer {
|
||||||
|
|
|
||||||
|
|
@ -103,10 +103,10 @@
|
||||||
// When enabled Popper.js, reset basic dropdown position
|
// When enabled Popper.js, reset basic dropdown position
|
||||||
// stylelint-disable-next-line no-duplicate-selectors
|
// stylelint-disable-next-line no-duplicate-selectors
|
||||||
.dropdown-menu {
|
.dropdown-menu {
|
||||||
&[x-placement^="top"],
|
&[x-placement^='top'],
|
||||||
&[x-placement^="right"],
|
&[x-placement^='right'],
|
||||||
&[x-placement^="bottom"],
|
&[x-placement^='bottom'],
|
||||||
&[x-placement^="left"] {
|
&[x-placement^='left'] {
|
||||||
right: auto;
|
right: auto;
|
||||||
bottom: auto;
|
bottom: auto;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -78,7 +78,6 @@ select.form-control {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Labels
|
// Labels
|
||||||
//
|
//
|
||||||
|
|
@ -107,7 +106,6 @@ select.form-control {
|
||||||
line-height: $input-line-height-sm;
|
line-height: $input-line-height-sm;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Readonly controls as plain text
|
// Readonly controls as plain text
|
||||||
//
|
//
|
||||||
// Apply class to a readonly input to make it appear like regular plain
|
// Apply class to a readonly input to make it appear like regular plain
|
||||||
|
|
@ -132,7 +130,6 @@ select.form-control {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Form control sizing
|
// Form control sizing
|
||||||
//
|
//
|
||||||
// Build on `.form-control` with modifier classes to decrease or increase the
|
// Build on `.form-control` with modifier classes to decrease or increase the
|
||||||
|
|
@ -182,7 +179,6 @@ textarea.form-control {
|
||||||
margin-top: $form-text-margin-top;
|
margin-top: $form-text-margin-top;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Form grid
|
// Form grid
|
||||||
//
|
//
|
||||||
// Special replacement for our grid system's `.row` for tighter form layouts.
|
// Special replacement for our grid system's `.row` for tighter form layouts.
|
||||||
|
|
@ -194,13 +190,12 @@ textarea.form-control {
|
||||||
margin-left: -$form-grid-gutter-width / 2;
|
margin-left: -$form-grid-gutter-width / 2;
|
||||||
|
|
||||||
> .col,
|
> .col,
|
||||||
> [class*="col-"] {
|
> [class*='col-'] {
|
||||||
padding-right: $form-grid-gutter-width / 2;
|
padding-right: $form-grid-gutter-width / 2;
|
||||||
padding-left: $form-grid-gutter-width / 2;
|
padding-left: $form-grid-gutter-width / 2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Checkboxes and radios
|
// Checkboxes and radios
|
||||||
//
|
//
|
||||||
// Indent the labels to position radios/checkboxes as hanging controls.
|
// Indent the labels to position radios/checkboxes as hanging controls.
|
||||||
|
|
@ -242,7 +237,6 @@ textarea.form-control {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Form validation
|
// Form validation
|
||||||
//
|
//
|
||||||
// Provide feedback to users when form field values are valid or invalid. Works
|
// Provide feedback to users when form field values are valid or invalid. Works
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
$prev-key: null;
|
$prev-key: null;
|
||||||
$prev-num: null;
|
$prev-num: null;
|
||||||
@each $key, $num in $map {
|
@each $key, $num in $map {
|
||||||
@if $prev-num == null or unit($num) == "%" or unit($prev-num) == "%" {
|
@if $prev-num == null or unit($num) == '%' or unit($prev-num) == '%' {
|
||||||
// Do nothing
|
// Do nothing
|
||||||
} @else if not comparable($prev-num, $num) {
|
} @else if not comparable($prev-num, $num) {
|
||||||
@warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
|
@warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
|
||||||
|
|
@ -22,7 +22,7 @@
|
||||||
|
|
||||||
// Starts at zero
|
// Starts at zero
|
||||||
// Used to ensure the min-width of the lowest breakpoint starts at 0.
|
// Used to ensure the min-width of the lowest breakpoint starts at 0.
|
||||||
@mixin _assert-starts-at-zero($map, $map-name: "$grid-breakpoints") {
|
@mixin _assert-starts-at-zero($map, $map-name: '$grid-breakpoints') {
|
||||||
$values: map-values($map);
|
$values: map-values($map);
|
||||||
$first-value: nth($values, 1);
|
$first-value: nth($values, 1);
|
||||||
@if $first-value != 0 {
|
@if $first-value != 0 {
|
||||||
|
|
@ -38,11 +38,12 @@
|
||||||
// @param {String} $search - Substring to replace
|
// @param {String} $search - Substring to replace
|
||||||
// @param {String} $replace ('') - New value
|
// @param {String} $replace ('') - New value
|
||||||
// @return {String} - Updated string
|
// @return {String} - Updated string
|
||||||
@function str-replace($string, $search, $replace: "") {
|
@function str-replace($string, $search, $replace: '') {
|
||||||
$index: str-index($string, $search);
|
$index: str-index($string, $search);
|
||||||
|
|
||||||
@if $index {
|
@if $index {
|
||||||
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
|
@return str-slice($string, 1, $index - 1) + $replace +
|
||||||
|
str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
|
||||||
}
|
}
|
||||||
|
|
||||||
@return $string;
|
@return $string;
|
||||||
|
|
@ -50,7 +51,7 @@
|
||||||
|
|
||||||
// See https://codepen.io/kevinweber/pen/dXWoRw
|
// See https://codepen.io/kevinweber/pen/dXWoRw
|
||||||
@function escape-svg($string) {
|
@function escape-svg($string) {
|
||||||
@if str-index($string, "data:image/svg+xml") {
|
@if str-index($string, 'data:image/svg+xml') {
|
||||||
@each $char, $encoded in $escaped-characters {
|
@each $char, $encoded in $escaped-characters {
|
||||||
$string: str-replace($string, $char, $encoded);
|
$string: str-replace($string, $char, $encoded);
|
||||||
}
|
}
|
||||||
|
|
@ -75,20 +76,20 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
// Retrieve color Sass maps
|
// Retrieve color Sass maps
|
||||||
@function color($key: "blue") {
|
@function color($key: 'blue') {
|
||||||
@return map-get($colors, $key);
|
@return map-get($colors, $key);
|
||||||
}
|
}
|
||||||
|
|
||||||
@function theme-color($key: "primary") {
|
@function theme-color($key: 'primary') {
|
||||||
@return map-get($theme-colors, $key);
|
@return map-get($theme-colors, $key);
|
||||||
}
|
}
|
||||||
|
|
||||||
@function gray($key: "100") {
|
@function gray($key: '100') {
|
||||||
@return map-get($grays, $key);
|
@return map-get($grays, $key);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Request a theme color level
|
// Request a theme color level
|
||||||
@function theme-color-level($color-name: "primary", $level: 0) {
|
@function theme-color-level($color-name: 'primary', $level: 0) {
|
||||||
$color: theme-color($color-name);
|
$color: theme-color($color-name);
|
||||||
$color-base: if($level > 0, $black, $white);
|
$color-base: if($level > 0, $black, $white);
|
||||||
$level: abs($level);
|
$level: abs($level);
|
||||||
|
|
@ -110,7 +111,7 @@
|
||||||
@return $value1 + $value2;
|
@return $value1 + $value2;
|
||||||
}
|
}
|
||||||
|
|
||||||
@return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(" + ") + $value2);
|
@return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(' + ') + $value2);
|
||||||
}
|
}
|
||||||
|
|
||||||
@function subtract($value1, $value2, $return-calc: true) {
|
@function subtract($value1, $value2, $return-calc: true) {
|
||||||
|
|
@ -130,5 +131,5 @@
|
||||||
@return $value1 - $value2;
|
@return $value1 - $value2;
|
||||||
}
|
}
|
||||||
|
|
||||||
@return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(" - ") + $value2);
|
@return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(' - ') + $value2);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -36,7 +36,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Row
|
// Row
|
||||||
//
|
//
|
||||||
// Rows contain your columns.
|
// Rows contain your columns.
|
||||||
|
|
@ -53,7 +52,7 @@
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
|
|
||||||
> .col,
|
> .col,
|
||||||
> [class*="col-"] {
|
> [class*='col-'] {
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,6 @@
|
||||||
@include img-fluid();
|
@include img-fluid();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Image thumbnails
|
// Image thumbnails
|
||||||
.img-thumbnail {
|
.img-thumbnail {
|
||||||
padding: $thumbnail-padding;
|
padding: $thumbnail-padding;
|
||||||
|
|
|
||||||
|
|
@ -41,8 +41,12 @@
|
||||||
|
|
||||||
> .form-control,
|
> .form-control,
|
||||||
> .custom-select {
|
> .custom-select {
|
||||||
&:not(:last-child) { @include border-right-radius(0); }
|
&:not(:last-child) {
|
||||||
&:not(:first-child) { @include border-left-radius(0); }
|
@include border-right-radius(0);
|
||||||
|
}
|
||||||
|
&:not(:first-child) {
|
||||||
|
@include border-left-radius(0);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Custom file inputs have more complex markup, thus requiring different
|
// Custom file inputs have more complex markup, thus requiring different
|
||||||
|
|
@ -52,12 +56,15 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
&:not(:last-child) .custom-file-label,
|
&:not(:last-child) .custom-file-label,
|
||||||
&:not(:last-child) .custom-file-label::after { @include border-right-radius(0); }
|
&:not(:last-child) .custom-file-label::after {
|
||||||
&:not(:first-child) .custom-file-label { @include border-left-radius(0); }
|
@include border-right-radius(0);
|
||||||
|
}
|
||||||
|
&:not(:first-child) .custom-file-label {
|
||||||
|
@include border-left-radius(0);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Prepend and append
|
// Prepend and append
|
||||||
//
|
//
|
||||||
// While it requires one extra layer of HTML for each, dedicated prepend and
|
// While it requires one extra layer of HTML for each, dedicated prepend and
|
||||||
|
|
@ -88,9 +95,12 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.input-group-prepend { margin-right: -$input-border-width; }
|
.input-group-prepend {
|
||||||
.input-group-append { margin-left: -$input-border-width; }
|
margin-right: -$input-border-width;
|
||||||
|
}
|
||||||
|
.input-group-append {
|
||||||
|
margin-left: -$input-border-width;
|
||||||
|
}
|
||||||
|
|
||||||
// Textual addons
|
// Textual addons
|
||||||
//
|
//
|
||||||
|
|
@ -113,13 +123,12 @@
|
||||||
@include border-radius($input-border-radius);
|
@include border-radius($input-border-radius);
|
||||||
|
|
||||||
// Nuke default margins from checkboxes and radios to vertically center within.
|
// Nuke default margins from checkboxes and radios to vertically center within.
|
||||||
input[type="radio"],
|
input[type='radio'],
|
||||||
input[type="checkbox"] {
|
input[type='checkbox'] {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Sizing
|
// Sizing
|
||||||
//
|
//
|
||||||
// Remix the default form control sizing classes into new ones for easier
|
// Remix the default form control sizing classes into new ones for easier
|
||||||
|
|
@ -164,14 +173,12 @@
|
||||||
padding-right: $custom-select-padding-x + $custom-select-indicator-padding;
|
padding-right: $custom-select-padding-x + $custom-select-indicator-padding;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Prepend and append rounded corners
|
// Prepend and append rounded corners
|
||||||
//
|
//
|
||||||
// These rulesets must come after the sizing ones to properly override sm and lg
|
// These rulesets must come after the sizing ones to properly override sm and lg
|
||||||
// border-radius values when extending. They're more specific than we'd like
|
// border-radius values when extending. They're more specific than we'd like
|
||||||
// with the `.input-group >` part, but without it, we cannot override the sizing.
|
// with the `.input-group >` part, but without it, we cannot override the sizing.
|
||||||
|
|
||||||
|
|
||||||
.input-group > .input-group-prepend > .btn,
|
.input-group > .input-group-prepend > .btn,
|
||||||
.input-group > .input-group-prepend > .input-group-text,
|
.input-group > .input-group-prepend > .input-group-text,
|
||||||
.input-group > .input-group-append:not(:last-child) > .btn,
|
.input-group > .input-group-append:not(:last-child) > .btn,
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,6 @@
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Interactive list items
|
// Interactive list items
|
||||||
//
|
//
|
||||||
// Use anchor or button elements instead of `li`s or `div`s to create interactive
|
// Use anchor or button elements instead of `li`s or `div`s to create interactive
|
||||||
|
|
@ -36,7 +35,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Individual list items
|
// Individual list items
|
||||||
//
|
//
|
||||||
// Use on `li`s or `div`s within the `.list-group` parent.
|
// Use on `li`s or `div`s within the `.list-group` parent.
|
||||||
|
|
@ -82,7 +80,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Horizontal
|
// Horizontal
|
||||||
//
|
//
|
||||||
// Change the layout of list group items from vertical (default) to horizontal.
|
// Change the layout of list group items from vertical (default) to horizontal.
|
||||||
|
|
@ -123,7 +120,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Flush list items
|
// Flush list items
|
||||||
//
|
//
|
||||||
// Remove borders and border-radius to keep list group items edge-to-edge. Most
|
// Remove borders and border-radius to keep list group items edge-to-edge. Most
|
||||||
|
|
@ -147,7 +143,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Contextual variants
|
// Contextual variants
|
||||||
//
|
//
|
||||||
// Add modifier classes to change text and background color on individual items.
|
// Add modifier classes to change text and background color on individual items.
|
||||||
|
|
|
||||||
|
|
@ -3,45 +3,45 @@
|
||||||
// Used in conjunction with global variables to enable certain theme features.
|
// Used in conjunction with global variables to enable certain theme features.
|
||||||
|
|
||||||
// Vendor
|
// Vendor
|
||||||
@import "_vendor/rfs";
|
@import '_vendor/rfs';
|
||||||
|
|
||||||
// Deprecate
|
// Deprecate
|
||||||
@import "mixins/deprecate";
|
@import 'mixins/deprecate';
|
||||||
|
|
||||||
// Utilities
|
// Utilities
|
||||||
@import "mixins/breakpoints";
|
@import 'mixins/breakpoints';
|
||||||
@import "mixins/hover";
|
@import 'mixins/hover';
|
||||||
@import "mixins/image";
|
@import 'mixins/image';
|
||||||
@import "mixins/badge";
|
@import 'mixins/badge';
|
||||||
@import "mixins/resize";
|
@import 'mixins/resize';
|
||||||
@import "mixins/screen-reader";
|
@import 'mixins/screen-reader';
|
||||||
@import "mixins/size";
|
@import 'mixins/size';
|
||||||
@import "mixins/reset-text";
|
@import 'mixins/reset-text';
|
||||||
@import "mixins/text-emphasis";
|
@import 'mixins/text-emphasis';
|
||||||
@import "mixins/text-hide";
|
@import 'mixins/text-hide';
|
||||||
@import "mixins/text-truncate";
|
@import 'mixins/text-truncate';
|
||||||
@import "mixins/visibility";
|
@import 'mixins/visibility';
|
||||||
|
|
||||||
// Components
|
// Components
|
||||||
@import "mixins/alert";
|
@import 'mixins/alert';
|
||||||
@import "mixins/buttons";
|
@import 'mixins/buttons';
|
||||||
@import "mixins/caret";
|
@import 'mixins/caret';
|
||||||
@import "mixins/pagination";
|
@import 'mixins/pagination';
|
||||||
@import "mixins/lists";
|
@import 'mixins/lists';
|
||||||
@import "mixins/list-group";
|
@import 'mixins/list-group';
|
||||||
@import "mixins/nav-divider";
|
@import 'mixins/nav-divider';
|
||||||
@import "mixins/forms";
|
@import 'mixins/forms';
|
||||||
@import "mixins/table-row";
|
@import 'mixins/table-row';
|
||||||
|
|
||||||
// Skins
|
// Skins
|
||||||
@import "mixins/background-variant";
|
@import 'mixins/background-variant';
|
||||||
@import "mixins/border-radius";
|
@import 'mixins/border-radius';
|
||||||
@import "mixins/box-shadow";
|
@import 'mixins/box-shadow';
|
||||||
@import "mixins/gradients";
|
@import 'mixins/gradients';
|
||||||
@import "mixins/transition";
|
@import 'mixins/transition';
|
||||||
|
|
||||||
// Layout
|
// Layout
|
||||||
@import "mixins/clearfix";
|
@import 'mixins/clearfix';
|
||||||
@import "mixins/grid-framework";
|
@import 'mixins/grid-framework';
|
||||||
@import "mixins/grid";
|
@import 'mixins/grid';
|
||||||
@import "mixins/float";
|
@import 'mixins/float';
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,6 @@
|
||||||
// .modal-dialog - positioning shell for the actual modal
|
// .modal-dialog - positioning shell for the actual modal
|
||||||
// .modal-content - actual modal w/ bg and corners and stuff
|
// .modal-content - actual modal w/ bg and corners and stuff
|
||||||
|
|
||||||
|
|
||||||
.modal-open {
|
.modal-open {
|
||||||
// Kill the scroll on the body
|
// Kill the scroll on the body
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -83,7 +82,7 @@
|
||||||
&::before {
|
&::before {
|
||||||
display: block; // IE10
|
display: block; // IE10
|
||||||
height: subtract(100vh, $modal-dialog-margin * 2);
|
height: subtract(100vh, $modal-dialog-margin * 2);
|
||||||
content: "";
|
content: '';
|
||||||
}
|
}
|
||||||
|
|
||||||
// Ensure `.modal-body` shows scrollbar (IE10/11)
|
// Ensure `.modal-body` shows scrollbar (IE10/11)
|
||||||
|
|
@ -131,8 +130,12 @@
|
||||||
background-color: $modal-backdrop-bg;
|
background-color: $modal-backdrop-bg;
|
||||||
|
|
||||||
// Fade for backdrop
|
// Fade for backdrop
|
||||||
&.fade { opacity: 0; }
|
&.fade {
|
||||||
&.show { opacity: $modal-backdrop-opacity; }
|
opacity: 0;
|
||||||
|
}
|
||||||
|
&.show {
|
||||||
|
opacity: $modal-backdrop-opacity;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Modal header
|
// Modal header
|
||||||
|
|
@ -224,7 +227,9 @@
|
||||||
@include box-shadow($modal-content-box-shadow-sm-up);
|
@include box-shadow($modal-content-box-shadow-sm-up);
|
||||||
}
|
}
|
||||||
|
|
||||||
.modal-sm { max-width: $modal-sm; }
|
.modal-sm {
|
||||||
|
max-width: $modal-sm;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@include media-breakpoint-up(lg) {
|
@include media-breakpoint-up(lg) {
|
||||||
|
|
@ -235,5 +240,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
@include media-breakpoint-up(xl) {
|
@include media-breakpoint-up(xl) {
|
||||||
.modal-xl { max-width: $modal-xl; }
|
.modal-xl {
|
||||||
|
max-width: $modal-xl;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -68,7 +68,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Pills
|
// Pills
|
||||||
//
|
//
|
||||||
|
|
@ -85,7 +84,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Justified variants
|
// Justified variants
|
||||||
//
|
//
|
||||||
|
|
@ -105,7 +103,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Tabbable tabs
|
// Tabbable tabs
|
||||||
//
|
//
|
||||||
// Hide tabbable panes to start, show them when `.active`
|
// Hide tabbable panes to start, show them when `.active`
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,6 @@
|
||||||
// Navbar position
|
// Navbar position
|
||||||
// Navbar themes
|
// Navbar themes
|
||||||
|
|
||||||
|
|
||||||
// Navbar
|
// Navbar
|
||||||
//
|
//
|
||||||
// Provide a static navbar from which we expand to create full-width, fixed, and
|
// Provide a static navbar from which we expand to create full-width, fixed, and
|
||||||
|
|
@ -44,7 +43,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Navbar brand
|
// Navbar brand
|
||||||
//
|
//
|
||||||
// Used for brand, project, or site names.
|
// Used for brand, project, or site names.
|
||||||
|
|
@ -63,7 +61,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Navbar nav
|
// Navbar nav
|
||||||
//
|
//
|
||||||
// Custom navbar navigation (doesn't require `.nav`, but does make use of `.nav-link`).
|
// Custom navbar navigation (doesn't require `.nav`, but does make use of `.nav-link`).
|
||||||
|
|
@ -86,7 +83,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Navbar text
|
// Navbar text
|
||||||
//
|
//
|
||||||
//
|
//
|
||||||
|
|
@ -97,7 +93,6 @@
|
||||||
padding-bottom: $nav-link-padding-y;
|
padding-bottom: $nav-link-padding-y;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Responsive navbar
|
// Responsive navbar
|
||||||
//
|
//
|
||||||
// Custom styles for responsive collapsing and toggling of navbar contents.
|
// Custom styles for responsive collapsing and toggling of navbar contents.
|
||||||
|
|
@ -135,7 +130,7 @@
|
||||||
width: 1.5em;
|
width: 1.5em;
|
||||||
height: 1.5em;
|
height: 1.5em;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
content: "";
|
content: '';
|
||||||
background: no-repeat center center;
|
background: no-repeat center center;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
@ -214,7 +209,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Navbar themes
|
// Navbar themes
|
||||||
//
|
//
|
||||||
// Styles for switching between navbars with light or dark background.
|
// Styles for switching between navbars with light or dark background.
|
||||||
|
|
|
||||||
|
|
@ -59,15 +59,26 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Sizing
|
// Sizing
|
||||||
//
|
//
|
||||||
|
|
||||||
.pagination-lg {
|
.pagination-lg {
|
||||||
@include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $line-height-lg, $border-radius-lg);
|
@include pagination-size(
|
||||||
|
$pagination-padding-y-lg,
|
||||||
|
$pagination-padding-x-lg,
|
||||||
|
$font-size-lg,
|
||||||
|
$line-height-lg,
|
||||||
|
$border-radius-lg
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
.pagination-sm {
|
.pagination-sm {
|
||||||
@include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $line-height-sm, $border-radius-sm);
|
@include pagination-size(
|
||||||
|
$pagination-padding-y-sm,
|
||||||
|
$pagination-padding-x-sm,
|
||||||
|
$font-size-sm,
|
||||||
|
$line-height-sm,
|
||||||
|
$border-radius-sm
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -28,7 +28,7 @@
|
||||||
&::after {
|
&::after {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: block;
|
display: block;
|
||||||
content: "";
|
content: '';
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
}
|
}
|
||||||
|
|
@ -105,7 +105,7 @@
|
||||||
display: block;
|
display: block;
|
||||||
width: $popover-arrow-width;
|
width: $popover-arrow-width;
|
||||||
margin-left: -$popover-arrow-width / 2;
|
margin-left: -$popover-arrow-width / 2;
|
||||||
content: "";
|
content: '';
|
||||||
border-bottom: $popover-border-width solid $popover-header-bg;
|
border-bottom: $popover-border-width solid $popover-header-bg;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -134,21 +134,20 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.bs-popover-auto {
|
.bs-popover-auto {
|
||||||
&[x-placement^="top"] {
|
&[x-placement^='top'] {
|
||||||
@extend .bs-popover-top;
|
@extend .bs-popover-top;
|
||||||
}
|
}
|
||||||
&[x-placement^="right"] {
|
&[x-placement^='right'] {
|
||||||
@extend .bs-popover-right;
|
@extend .bs-popover-right;
|
||||||
}
|
}
|
||||||
&[x-placement^="bottom"] {
|
&[x-placement^='bottom'] {
|
||||||
@extend .bs-popover-bottom;
|
@extend .bs-popover-bottom;
|
||||||
}
|
}
|
||||||
&[x-placement^="left"] {
|
&[x-placement^='left'] {
|
||||||
@extend .bs-popover-left;
|
@extend .bs-popover-left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Offset the popover to account for the popover arrow
|
// Offset the popover to account for the popover arrow
|
||||||
.popover-header {
|
.popover-header {
|
||||||
padding: $popover-header-padding-y $popover-header-padding-x;
|
padding: $popover-header-padding-y $popover-header-padding-x;
|
||||||
|
|
|
||||||
|
|
@ -32,7 +32,7 @@
|
||||||
//}
|
//}
|
||||||
|
|
||||||
abbr[title]::after {
|
abbr[title]::after {
|
||||||
content: " (" attr(title) ")";
|
content: ' (' attr(title) ')';
|
||||||
}
|
}
|
||||||
|
|
||||||
// Bootstrap specific; comment the following selector out
|
// Bootstrap specific; comment the following selector out
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,12 @@
|
||||||
// Disable animation if transitions are disabled
|
// Disable animation if transitions are disabled
|
||||||
@if $enable-transitions {
|
@if $enable-transitions {
|
||||||
@keyframes progress-bar-stripes {
|
@keyframes progress-bar-stripes {
|
||||||
from { background-position: $progress-height 0; }
|
from {
|
||||||
to { background-position: 0 0; }
|
background-position: $progress-height 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
background-position: 0 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,6 @@
|
||||||
//
|
//
|
||||||
// Normalize is licensed MIT. https://github.com/necolas/normalize.css
|
// Normalize is licensed MIT. https://github.com/necolas/normalize.css
|
||||||
|
|
||||||
|
|
||||||
// Document
|
// Document
|
||||||
//
|
//
|
||||||
// 1. Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
|
// 1. Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
|
||||||
|
|
@ -32,7 +31,16 @@ html {
|
||||||
// Shim for "new" HTML5 structural elements to display correctly (IE10, older browsers)
|
// Shim for "new" HTML5 structural elements to display correctly (IE10, older browsers)
|
||||||
// TODO: remove in v5
|
// TODO: remove in v5
|
||||||
// stylelint-disable-next-line selector-list-comma-newline-after
|
// stylelint-disable-next-line selector-list-comma-newline-after
|
||||||
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
|
article,
|
||||||
|
aside,
|
||||||
|
figcaption,
|
||||||
|
figure,
|
||||||
|
footer,
|
||||||
|
header,
|
||||||
|
hgroup,
|
||||||
|
main,
|
||||||
|
nav,
|
||||||
|
section {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -63,11 +71,10 @@ body {
|
||||||
//
|
//
|
||||||
// See https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible
|
// See https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible
|
||||||
// and https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/
|
// and https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/
|
||||||
[tabindex="-1"]:focus:not(:focus-visible) {
|
[tabindex='-1']:focus:not(:focus-visible) {
|
||||||
outline: 0 !important;
|
outline: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Content grouping
|
// Content grouping
|
||||||
//
|
//
|
||||||
// 1. Add the correct box sizing in Firefox.
|
// 1. Add the correct box sizing in Firefox.
|
||||||
|
|
@ -79,7 +86,6 @@ hr {
|
||||||
overflow: visible; // 2
|
overflow: visible; // 2
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Typography
|
// Typography
|
||||||
//
|
//
|
||||||
|
|
@ -89,7 +95,12 @@ hr {
|
||||||
// By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
|
// By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
|
||||||
// margin for easier control within type scales as it avoids margin collapsing.
|
// margin for easier control within type scales as it avoids margin collapsing.
|
||||||
// stylelint-disable-next-line selector-list-comma-newline-after
|
// stylelint-disable-next-line selector-list-comma-newline-after
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: $headings-margin-bottom;
|
margin-bottom: $headings-margin-bottom;
|
||||||
}
|
}
|
||||||
|
|
@ -112,7 +123,8 @@ p {
|
||||||
// 5. Prevent the text-decoration to be skipped.
|
// 5. Prevent the text-decoration to be skipped.
|
||||||
|
|
||||||
abbr[title],
|
abbr[title],
|
||||||
abbr[data-original-title] { // 1
|
abbr[data-original-title] {
|
||||||
|
// 1
|
||||||
text-decoration: underline; // 2
|
text-decoration: underline; // 2
|
||||||
text-decoration: underline dotted; // 2
|
text-decoration: underline dotted; // 2
|
||||||
cursor: help; // 3
|
cursor: help; // 3
|
||||||
|
|
@ -145,7 +157,7 @@ dt {
|
||||||
}
|
}
|
||||||
|
|
||||||
dd {
|
dd {
|
||||||
margin-bottom: .5rem;
|
margin-bottom: 0.5rem;
|
||||||
margin-left: 0; // Undo browser default
|
margin-left: 0; // Undo browser default
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -175,9 +187,12 @@ sup {
|
||||||
vertical-align: baseline;
|
vertical-align: baseline;
|
||||||
}
|
}
|
||||||
|
|
||||||
sub { bottom: -.25em; }
|
sub {
|
||||||
sup { top: -.5em; }
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
//
|
//
|
||||||
// Links
|
// Links
|
||||||
|
|
@ -209,7 +224,6 @@ a:not([href]) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Code
|
// Code
|
||||||
//
|
//
|
||||||
|
|
@ -231,7 +245,6 @@ pre {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Figures
|
// Figures
|
||||||
//
|
//
|
||||||
|
|
@ -241,7 +254,6 @@ figure {
|
||||||
margin: 0 0 1rem;
|
margin: 0 0 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Images and content
|
// Images and content
|
||||||
//
|
//
|
||||||
|
|
@ -258,7 +270,6 @@ svg {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Tables
|
// Tables
|
||||||
//
|
//
|
||||||
|
|
@ -281,7 +292,6 @@ th {
|
||||||
text-align: inherit;
|
text-align: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Forms
|
// Forms
|
||||||
//
|
//
|
||||||
|
|
@ -337,7 +347,6 @@ select {
|
||||||
word-wrap: normal;
|
word-wrap: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||||
// controls in Android 4.
|
// controls in Android 4.
|
||||||
// 2. Correct the inability to style clickable types in iOS and Safari.
|
// 2. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
|
@ -351,9 +360,9 @@ button,
|
||||||
// Opinionated: add "hand" cursor to non-disabled button elements.
|
// Opinionated: add "hand" cursor to non-disabled button elements.
|
||||||
@if $enable-pointer-cursor-for-buttons {
|
@if $enable-pointer-cursor-for-buttons {
|
||||||
button,
|
button,
|
||||||
[type="button"],
|
[type='button'],
|
||||||
[type="reset"],
|
[type='reset'],
|
||||||
[type="submit"] {
|
[type='submit'] {
|
||||||
&:not(:disabled) {
|
&:not(:disabled) {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
@ -362,24 +371,23 @@ button,
|
||||||
|
|
||||||
// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
|
// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
|
||||||
button::-moz-focus-inner,
|
button::-moz-focus-inner,
|
||||||
[type="button"]::-moz-focus-inner,
|
[type='button']::-moz-focus-inner,
|
||||||
[type="reset"]::-moz-focus-inner,
|
[type='reset']::-moz-focus-inner,
|
||||||
[type="submit"]::-moz-focus-inner {
|
[type='submit']::-moz-focus-inner {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
border-style: none;
|
border-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type="radio"],
|
input[type='radio'],
|
||||||
input[type="checkbox"] {
|
input[type='checkbox'] {
|
||||||
box-sizing: border-box; // 1. Add the correct box sizing in IE 10-
|
box-sizing: border-box; // 1. Add the correct box sizing in IE 10-
|
||||||
padding: 0; // 2. Remove the padding in IE 10-
|
padding: 0; // 2. Remove the padding in IE 10-
|
||||||
}
|
}
|
||||||
|
|
||||||
|
input[type='date'],
|
||||||
input[type="date"],
|
input[type='time'],
|
||||||
input[type="time"],
|
input[type='datetime-local'],
|
||||||
input[type="datetime-local"],
|
input[type='month'] {
|
||||||
input[type="month"] {
|
|
||||||
// Remove the default appearance of temporal inputs to avoid a Mobile Safari
|
// Remove the default appearance of temporal inputs to avoid a Mobile Safari
|
||||||
// bug where setting a custom line-height prevents text from being vertically
|
// bug where setting a custom line-height prevents text from being vertically
|
||||||
// centered within the input.
|
// centered within the input.
|
||||||
|
|
@ -414,7 +422,7 @@ legend {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 100%; // 1
|
max-width: 100%; // 1
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin-bottom: .5rem;
|
margin-bottom: 0.5rem;
|
||||||
@include font-size(1.5rem);
|
@include font-size(1.5rem);
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
color: inherit; // 2
|
color: inherit; // 2
|
||||||
|
|
@ -426,12 +434,12 @@ progress {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Correct the cursor style of increment and decrement buttons in Chrome.
|
// Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
[type="number"]::-webkit-inner-spin-button,
|
[type='number']::-webkit-inner-spin-button,
|
||||||
[type="number"]::-webkit-outer-spin-button {
|
[type='number']::-webkit-outer-spin-button {
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
[type="search"] {
|
[type='search'] {
|
||||||
// This overrides the extra rounded corners on search inputs in iOS so that our
|
// 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
|
// `.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
|
// be added to `.form-control` as it's not specific enough. For details, see
|
||||||
|
|
@ -444,7 +452,7 @@ progress {
|
||||||
// Remove the inner padding in Chrome and Safari on macOS.
|
// Remove the inner padding in Chrome and Safari on macOS.
|
||||||
//
|
//
|
||||||
|
|
||||||
[type="search"]::-webkit-search-decoration {
|
[type='search']::-webkit-search-decoration {
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,9 @@
|
||||||
//
|
//
|
||||||
|
|
||||||
@keyframes spinner-border {
|
@keyframes spinner-border {
|
||||||
to { transform: rotate(360deg); }
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.spinner-border {
|
.spinner-border {
|
||||||
|
|
@ -15,7 +17,7 @@
|
||||||
border-right-color: transparent;
|
border-right-color: transparent;
|
||||||
// stylelint-disable-next-line property-blacklist
|
// stylelint-disable-next-line property-blacklist
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
animation: spinner-border .75s linear infinite;
|
animation: spinner-border 0.75s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.spinner-border-sm {
|
.spinner-border-sm {
|
||||||
|
|
@ -46,7 +48,7 @@
|
||||||
// stylelint-disable-next-line property-blacklist
|
// stylelint-disable-next-line property-blacklist
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
animation: spinner-grow .75s linear infinite;
|
animation: spinner-grow 0.75s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.spinner-grow-sm {
|
.spinner-grow-sm {
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Condensed table w/ half padding
|
// Condensed table w/ half padding
|
||||||
//
|
//
|
||||||
|
|
@ -37,7 +36,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Border versions
|
// Border versions
|
||||||
//
|
//
|
||||||
// Add or remove borders all around the table and between all the columns.
|
// Add or remove borders all around the table and between all the columns.
|
||||||
|
|
@ -77,7 +75,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Hover effect
|
// Hover effect
|
||||||
//
|
//
|
||||||
// Placed here since it has to come after the potential zebra striping
|
// Placed here since it has to come after the potential zebra striping
|
||||||
|
|
@ -91,19 +88,21 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Table backgrounds
|
// Table backgrounds
|
||||||
//
|
//
|
||||||
// Exact selectors below required to override `.table-striped` and prevent
|
// Exact selectors below required to override `.table-striped` and prevent
|
||||||
// inheritance to nested tables.
|
// inheritance to nested tables.
|
||||||
|
|
||||||
@each $color, $value in $theme-colors {
|
@each $color, $value in $theme-colors {
|
||||||
@include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
|
@include table-row-variant(
|
||||||
|
$color,
|
||||||
|
theme-color-level($color, $table-bg-level),
|
||||||
|
theme-color-level($color, $table-border-level)
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@include table-row-variant(active, $table-active-bg);
|
@include table-row-variant(active, $table-active-bg);
|
||||||
|
|
||||||
|
|
||||||
// Dark styles
|
// Dark styles
|
||||||
//
|
//
|
||||||
// Same table markup, but inverted color scheme: dark background and light text.
|
// Same table markup, but inverted color scheme: dark background and light text.
|
||||||
|
|
@ -157,7 +156,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Responsive tables
|
// Responsive tables
|
||||||
//
|
//
|
||||||
// Generate series of `.table-responsive-*` classes for configuring the screen
|
// Generate series of `.table-responsive-*` classes for configuring the screen
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,9 @@
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
|
||||||
&.show { opacity: $tooltip-opacity; }
|
&.show {
|
||||||
|
opacity: $tooltip-opacity;
|
||||||
|
}
|
||||||
|
|
||||||
.arrow {
|
.arrow {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -22,7 +24,7 @@
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
content: "";
|
content: '';
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
}
|
}
|
||||||
|
|
@ -90,16 +92,16 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.bs-tooltip-auto {
|
.bs-tooltip-auto {
|
||||||
&[x-placement^="top"] {
|
&[x-placement^='top'] {
|
||||||
@extend .bs-tooltip-top;
|
@extend .bs-tooltip-top;
|
||||||
}
|
}
|
||||||
&[x-placement^="right"] {
|
&[x-placement^='right'] {
|
||||||
@extend .bs-tooltip-right;
|
@extend .bs-tooltip-right;
|
||||||
}
|
}
|
||||||
&[x-placement^="bottom"] {
|
&[x-placement^='bottom'] {
|
||||||
@extend .bs-tooltip-bottom;
|
@extend .bs-tooltip-bottom;
|
||||||
}
|
}
|
||||||
&[x-placement^="left"] {
|
&[x-placement^='left'] {
|
||||||
@extend .bs-tooltip-left;
|
@extend .bs-tooltip-left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,8 +4,18 @@
|
||||||
// Headings
|
// Headings
|
||||||
//
|
//
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6,
|
h1,
|
||||||
.h1, .h2, .h3, .h4, .h5, .h6 {
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6,
|
||||||
|
.h1,
|
||||||
|
.h2,
|
||||||
|
.h3,
|
||||||
|
.h4,
|
||||||
|
.h5,
|
||||||
|
.h6 {
|
||||||
margin-bottom: $headings-margin-bottom;
|
margin-bottom: $headings-margin-bottom;
|
||||||
font-family: $headings-font-family;
|
font-family: $headings-font-family;
|
||||||
font-weight: $headings-font-weight;
|
font-weight: $headings-font-weight;
|
||||||
|
|
@ -13,12 +23,30 @@ h1, h2, h3, h4, h5, h6,
|
||||||
color: $headings-color;
|
color: $headings-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, .h1 { @include font-size($h1-font-size); }
|
h1,
|
||||||
h2, .h2 { @include font-size($h2-font-size); }
|
.h1 {
|
||||||
h3, .h3 { @include font-size($h3-font-size); }
|
@include font-size($h1-font-size);
|
||||||
h4, .h4 { @include font-size($h4-font-size); }
|
}
|
||||||
h5, .h5 { @include font-size($h5-font-size); }
|
h2,
|
||||||
h6, .h6 { @include font-size($h6-font-size); }
|
.h2 {
|
||||||
|
@include font-size($h2-font-size);
|
||||||
|
}
|
||||||
|
h3,
|
||||||
|
.h3 {
|
||||||
|
@include font-size($h3-font-size);
|
||||||
|
}
|
||||||
|
h4,
|
||||||
|
.h4 {
|
||||||
|
@include font-size($h4-font-size);
|
||||||
|
}
|
||||||
|
h5,
|
||||||
|
.h5 {
|
||||||
|
@include font-size($h5-font-size);
|
||||||
|
}
|
||||||
|
h6,
|
||||||
|
.h6 {
|
||||||
|
@include font-size($h6-font-size);
|
||||||
|
}
|
||||||
|
|
||||||
.lead {
|
.lead {
|
||||||
@include font-size($lead-font-size);
|
@include font-size($lead-font-size);
|
||||||
|
|
@ -47,7 +75,6 @@ h6, .h6 { @include font-size($h6-font-size); }
|
||||||
line-height: $display-line-height;
|
line-height: $display-line-height;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Horizontal rules
|
// Horizontal rules
|
||||||
//
|
//
|
||||||
|
|
@ -59,7 +86,6 @@ hr {
|
||||||
border-top: $hr-border-width solid $hr-border-color;
|
border-top: $hr-border-width solid $hr-border-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Emphasis
|
// Emphasis
|
||||||
//
|
//
|
||||||
|
|
@ -76,7 +102,6 @@ mark,
|
||||||
background-color: $mark-bg;
|
background-color: $mark-bg;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Lists
|
// Lists
|
||||||
//
|
//
|
||||||
|
|
@ -97,7 +122,6 @@ mark,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Misc
|
// Misc
|
||||||
//
|
//
|
||||||
|
|
@ -120,6 +144,6 @@ mark,
|
||||||
color: $blockquote-small-color;
|
color: $blockquote-small-color;
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
content: "\2014\00A0"; // em dash, nbsp
|
content: '\2014\00A0'; // em dash, nbsp
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,17 @@
|
||||||
@import "utilities/align";
|
@import 'utilities/align';
|
||||||
@import "utilities/background";
|
@import 'utilities/background';
|
||||||
@import "utilities/borders";
|
@import 'utilities/borders';
|
||||||
@import "utilities/clearfix";
|
@import 'utilities/clearfix';
|
||||||
@import "utilities/display";
|
@import 'utilities/display';
|
||||||
@import "utilities/embed";
|
@import 'utilities/embed';
|
||||||
@import "utilities/flex";
|
@import 'utilities/flex';
|
||||||
@import "utilities/float";
|
@import 'utilities/float';
|
||||||
@import "utilities/overflow";
|
@import 'utilities/overflow';
|
||||||
@import "utilities/position";
|
@import 'utilities/position';
|
||||||
@import "utilities/screenreaders";
|
@import 'utilities/screenreaders';
|
||||||
@import "utilities/shadows";
|
@import 'utilities/shadows';
|
||||||
@import "utilities/sizing";
|
@import 'utilities/sizing';
|
||||||
@import "utilities/stretched-link";
|
@import 'utilities/stretched-link';
|
||||||
@import "utilities/spacing";
|
@import 'utilities/spacing';
|
||||||
@import "utilities/text";
|
@import 'utilities/text';
|
||||||
@import "utilities/visibility";
|
@import 'utilities/visibility';
|
||||||
|
|
|
||||||
|
|
@ -21,15 +21,15 @@ $grays: () !default;
|
||||||
// stylelint-disable-next-line scss/dollar-variable-default
|
// stylelint-disable-next-line scss/dollar-variable-default
|
||||||
$grays: map-merge(
|
$grays: map-merge(
|
||||||
(
|
(
|
||||||
"100": $gray-100,
|
'100': $gray-100,
|
||||||
"200": $gray-200,
|
'200': $gray-200,
|
||||||
"300": $gray-300,
|
'300': $gray-300,
|
||||||
"400": $gray-400,
|
'400': $gray-400,
|
||||||
"500": $gray-500,
|
'500': $gray-500,
|
||||||
"600": $gray-600,
|
'600': $gray-600,
|
||||||
"700": $gray-700,
|
'700': $gray-700,
|
||||||
"800": $gray-800,
|
'800': $gray-800,
|
||||||
"900": $gray-900
|
'900': $gray-900,
|
||||||
),
|
),
|
||||||
$grays
|
$grays
|
||||||
);
|
);
|
||||||
|
|
@ -49,19 +49,19 @@ $colors: () !default;
|
||||||
// stylelint-disable-next-line scss/dollar-variable-default
|
// stylelint-disable-next-line scss/dollar-variable-default
|
||||||
$colors: map-merge(
|
$colors: map-merge(
|
||||||
(
|
(
|
||||||
"blue": $blue,
|
'blue': $blue,
|
||||||
"indigo": $indigo,
|
'indigo': $indigo,
|
||||||
"purple": $purple,
|
'purple': $purple,
|
||||||
"pink": $pink,
|
'pink': $pink,
|
||||||
"red": $red,
|
'red': $red,
|
||||||
"orange": $orange,
|
'orange': $orange,
|
||||||
"yellow": $yellow,
|
'yellow': $yellow,
|
||||||
"green": $green,
|
'green': $green,
|
||||||
"teal": $teal,
|
'teal': $teal,
|
||||||
"cyan": $cyan,
|
'cyan': $cyan,
|
||||||
"white": $white,
|
'white': $white,
|
||||||
"gray": $gray-600,
|
'gray': $gray-600,
|
||||||
"gray-dark": $gray-800
|
'gray-dark': $gray-800,
|
||||||
),
|
),
|
||||||
$colors
|
$colors
|
||||||
);
|
);
|
||||||
|
|
@ -79,14 +79,14 @@ $theme-colors: () !default;
|
||||||
// stylelint-disable-next-line scss/dollar-variable-default
|
// stylelint-disable-next-line scss/dollar-variable-default
|
||||||
$theme-colors: map-merge(
|
$theme-colors: map-merge(
|
||||||
(
|
(
|
||||||
"primary": $primary,
|
'primary': $primary,
|
||||||
"secondary": $secondary,
|
'secondary': $secondary,
|
||||||
"success": $success,
|
'success': $success,
|
||||||
"info": $info,
|
'info': $info,
|
||||||
"warning": $warning,
|
'warning': $warning,
|
||||||
"danger": $danger,
|
'danger': $danger,
|
||||||
"light": $light,
|
'light': $light,
|
||||||
"dark": $dark
|
'dark': $dark,
|
||||||
),
|
),
|
||||||
$theme-colors
|
$theme-colors
|
||||||
);
|
);
|
||||||
|
|
@ -102,12 +102,7 @@ $yiq-text-dark: $gray-900 !default;
|
||||||
$yiq-text-light: $white !default;
|
$yiq-text-light: $white !default;
|
||||||
|
|
||||||
// Characters which are escaped by the escape-svg function
|
// Characters which are escaped by the escape-svg function
|
||||||
$escaped-characters: (
|
$escaped-characters: (('<', '%3c'), ('>', '%3e'), ('#', '%23')) !default;
|
||||||
("<","%3c"),
|
|
||||||
(">","%3e"),
|
|
||||||
("#","%23"),
|
|
||||||
) !default;
|
|
||||||
|
|
||||||
|
|
||||||
// Options
|
// Options
|
||||||
//
|
//
|
||||||
|
|
@ -127,7 +122,6 @@ $enable-responsive-font-sizes: false !default;
|
||||||
$enable-validation-icons: true !default;
|
$enable-validation-icons: true !default;
|
||||||
$enable-deprecation-messages: true !default;
|
$enable-deprecation-messages: true !default;
|
||||||
|
|
||||||
|
|
||||||
// Spacing
|
// Spacing
|
||||||
//
|
//
|
||||||
// Control the default styling of most Bootstrap elements by modifying these
|
// Control the default styling of most Bootstrap elements by modifying these
|
||||||
|
|
@ -140,11 +134,19 @@ $spacers: () !default;
|
||||||
$spacers: map-merge(
|
$spacers: map-merge(
|
||||||
(
|
(
|
||||||
0: 0,
|
0: 0,
|
||||||
1: ($spacer * .25),
|
1: (
|
||||||
2: ($spacer * .5),
|
$spacer * 0.25,
|
||||||
|
),
|
||||||
|
2: (
|
||||||
|
$spacer * 0.5,
|
||||||
|
),
|
||||||
3: $spacer,
|
3: $spacer,
|
||||||
4: ($spacer * 1.5),
|
4: (
|
||||||
5: ($spacer * 3)
|
$spacer * 1.5,
|
||||||
|
),
|
||||||
|
5: (
|
||||||
|
$spacer * 3,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
$spacers
|
$spacers
|
||||||
);
|
);
|
||||||
|
|
@ -158,12 +160,11 @@ $sizes: map-merge(
|
||||||
50: 50%,
|
50: 50%,
|
||||||
75: 75%,
|
75: 75%,
|
||||||
100: 100%,
|
100: 100%,
|
||||||
auto: auto
|
auto: auto,
|
||||||
),
|
),
|
||||||
$sizes
|
$sizes
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
// Body
|
// Body
|
||||||
//
|
//
|
||||||
// Settings for the `<body>` element.
|
// Settings for the `<body>` element.
|
||||||
|
|
@ -171,12 +172,11 @@ $sizes: map-merge(
|
||||||
$body-bg: $white !default;
|
$body-bg: $white !default;
|
||||||
$body-color: $gray-900 !default;
|
$body-color: $gray-900 !default;
|
||||||
|
|
||||||
|
|
||||||
// Links
|
// Links
|
||||||
//
|
//
|
||||||
// Style anchor elements.
|
// Style anchor elements.
|
||||||
|
|
||||||
$link-color: theme-color("primary") !default;
|
$link-color: theme-color('primary') !default;
|
||||||
$link-decoration: none !default;
|
$link-decoration: none !default;
|
||||||
$link-hover-color: darken($link-color, 15%) !default;
|
$link-hover-color: darken($link-color, 15%) !default;
|
||||||
$link-hover-decoration: underline !default;
|
$link-hover-decoration: underline !default;
|
||||||
|
|
@ -189,7 +189,6 @@ $emphasized-link-hover-darken-percentage: 15% !default;
|
||||||
|
|
||||||
$paragraph-margin-bottom: 1rem !default;
|
$paragraph-margin-bottom: 1rem !default;
|
||||||
|
|
||||||
|
|
||||||
// Grid breakpoints
|
// Grid breakpoints
|
||||||
//
|
//
|
||||||
// Define the minimum dimensions at which your layout will change,
|
// Define the minimum dimensions at which your layout will change,
|
||||||
|
|
@ -200,12 +199,11 @@ $grid-breakpoints: (
|
||||||
sm: 576px,
|
sm: 576px,
|
||||||
md: 768px,
|
md: 768px,
|
||||||
lg: 992px,
|
lg: 992px,
|
||||||
xl: 1200px
|
xl: 1200px,
|
||||||
) !default;
|
) !default;
|
||||||
|
|
||||||
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
|
@include _assert-ascending($grid-breakpoints, '$grid-breakpoints');
|
||||||
@include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints");
|
@include _assert-starts-at-zero($grid-breakpoints, '$grid-breakpoints');
|
||||||
|
|
||||||
|
|
||||||
// Grid containers
|
// Grid containers
|
||||||
//
|
//
|
||||||
|
|
@ -215,11 +213,10 @@ $container-max-widths: (
|
||||||
sm: 540px,
|
sm: 540px,
|
||||||
md: 720px,
|
md: 720px,
|
||||||
lg: 960px,
|
lg: 960px,
|
||||||
xl: 1140px
|
xl: 1140px,
|
||||||
) !default;
|
) !default;
|
||||||
|
|
||||||
@include _assert-ascending($container-max-widths, "$container-max-widths");
|
@include _assert-ascending($container-max-widths, '$container-max-widths');
|
||||||
|
|
||||||
|
|
||||||
// Grid columns
|
// Grid columns
|
||||||
//
|
//
|
||||||
|
|
@ -229,7 +226,6 @@ $grid-columns: 12 !default;
|
||||||
$grid-gutter-width: 30px !default;
|
$grid-gutter-width: 30px !default;
|
||||||
$grid-row-columns: 6 !default;
|
$grid-row-columns: 6 !default;
|
||||||
|
|
||||||
|
|
||||||
// Components
|
// Components
|
||||||
//
|
//
|
||||||
// Define common padding and border radius sizes and more.
|
// Define common padding and border radius sizes and more.
|
||||||
|
|
@ -240,52 +236,45 @@ $line-height-sm: 1.5 !default;
|
||||||
$border-width: 1px !default;
|
$border-width: 1px !default;
|
||||||
$border-color: $gray-300 !default;
|
$border-color: $gray-300 !default;
|
||||||
|
|
||||||
$border-radius: .25rem !default;
|
$border-radius: 0.25rem !default;
|
||||||
$border-radius-lg: .3rem !default;
|
$border-radius-lg: 0.3rem !default;
|
||||||
$border-radius-sm: .2rem !default;
|
$border-radius-sm: 0.2rem !default;
|
||||||
|
|
||||||
$rounded-pill: 50rem !default;
|
$rounded-pill: 50rem !default;
|
||||||
|
|
||||||
$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
|
$box-shadow-sm: 0 0.125rem 0.25rem rgba($black, 0.075) !default;
|
||||||
$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;
|
$box-shadow: 0 0.5rem 1rem rgba($black, 0.15) !default;
|
||||||
$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
|
$box-shadow-lg: 0 1rem 3rem rgba($black, 0.175) !default;
|
||||||
|
|
||||||
$component-active-color: $white !default;
|
$component-active-color: $white !default;
|
||||||
$component-active-bg: theme-color("primary") !default;
|
$component-active-bg: theme-color('primary') !default;
|
||||||
|
|
||||||
$caret-width: .3em !default;
|
$caret-width: 0.3em !default;
|
||||||
$caret-vertical-align: $caret-width * .85 !default;
|
$caret-vertical-align: $caret-width * 0.85 !default;
|
||||||
$caret-spacing: $caret-width * .85 !default;
|
$caret-spacing: $caret-width * 0.85 !default;
|
||||||
|
|
||||||
$transition-base: all .2s ease-in-out !default;
|
$transition-base: all 0.2s ease-in-out !default;
|
||||||
$transition-fade: opacity .15s linear !default;
|
$transition-fade: opacity 0.15s linear !default;
|
||||||
$transition-collapse: height .35s ease !default;
|
$transition-collapse: height 0.35s ease !default;
|
||||||
|
|
||||||
$embed-responsive-aspect-ratios: () !default;
|
$embed-responsive-aspect-ratios: () !default;
|
||||||
// stylelint-disable-next-line scss/dollar-variable-default
|
// stylelint-disable-next-line scss/dollar-variable-default
|
||||||
$embed-responsive-aspect-ratios: join(
|
$embed-responsive-aspect-ratios: join(((21 9), (16 9), (4 3), (1 1)), $embed-responsive-aspect-ratios);
|
||||||
(
|
|
||||||
(21 9),
|
|
||||||
(16 9),
|
|
||||||
(4 3),
|
|
||||||
(1 1),
|
|
||||||
),
|
|
||||||
$embed-responsive-aspect-ratios
|
|
||||||
);
|
|
||||||
|
|
||||||
// Typography
|
// Typography
|
||||||
//
|
//
|
||||||
// Font, line-height, and color for body text, headings, and more.
|
// Font, line-height, and color for body text, headings, and more.
|
||||||
|
|
||||||
// stylelint-disable value-keyword-case
|
// stylelint-disable value-keyword-case
|
||||||
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
|
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||||
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
|
sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji' !default;
|
||||||
|
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !default;
|
||||||
$font-family-base: $font-family-sans-serif !default;
|
$font-family-base: $font-family-sans-serif !default;
|
||||||
// stylelint-enable value-keyword-case
|
// stylelint-enable value-keyword-case
|
||||||
|
|
||||||
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
|
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
|
||||||
$font-size-lg: $font-size-base * 1.25 !default;
|
$font-size-lg: $font-size-base * 1.25 !default;
|
||||||
$font-size-sm: $font-size-base * .875 !default;
|
$font-size-sm: $font-size-base * 0.875 !default;
|
||||||
|
|
||||||
$font-weight-lighter: lighter !default;
|
$font-weight-lighter: lighter !default;
|
||||||
$font-weight-light: 300 !default;
|
$font-weight-light: 300 !default;
|
||||||
|
|
@ -331,35 +320,34 @@ $blockquote-small-color: $gray-600 !default;
|
||||||
$blockquote-small-font-size: $small-font-size !default;
|
$blockquote-small-font-size: $small-font-size !default;
|
||||||
$blockquote-font-size: $font-size-base * 1.25 !default;
|
$blockquote-font-size: $font-size-base * 1.25 !default;
|
||||||
|
|
||||||
$hr-border-color: rgba($black, .1) !default;
|
$hr-border-color: rgba($black, 0.1) !default;
|
||||||
$hr-border-width: $border-width !default;
|
$hr-border-width: $border-width !default;
|
||||||
|
|
||||||
$mark-padding: .2em !default;
|
$mark-padding: 0.2em !default;
|
||||||
|
|
||||||
$dt-font-weight: $font-weight-bold !default;
|
$dt-font-weight: $font-weight-bold !default;
|
||||||
|
|
||||||
$kbd-box-shadow: inset 0 -.1rem 0 rgba($black, .25) !default;
|
$kbd-box-shadow: inset 0 -0.1rem 0 rgba($black, 0.25) !default;
|
||||||
$nested-kbd-font-weight: $font-weight-bold !default;
|
$nested-kbd-font-weight: $font-weight-bold !default;
|
||||||
|
|
||||||
$list-inline-padding: .5rem !default;
|
$list-inline-padding: 0.5rem !default;
|
||||||
|
|
||||||
$mark-bg: #fcf8e3 !default;
|
$mark-bg: #fcf8e3 !default;
|
||||||
|
|
||||||
$hr-margin-y: $spacer !default;
|
$hr-margin-y: $spacer !default;
|
||||||
|
|
||||||
|
|
||||||
// Tables
|
// Tables
|
||||||
//
|
//
|
||||||
// Customizes the `.table` component with basic values, each used across all table variations.
|
// Customizes the `.table` component with basic values, each used across all table variations.
|
||||||
|
|
||||||
$table-cell-padding: .75rem !default;
|
$table-cell-padding: 0.75rem !default;
|
||||||
$table-cell-padding-sm: .3rem !default;
|
$table-cell-padding-sm: 0.3rem !default;
|
||||||
|
|
||||||
$table-color: $body-color !default;
|
$table-color: $body-color !default;
|
||||||
$table-bg: null !default;
|
$table-bg: null !default;
|
||||||
$table-accent-bg: rgba($black, .05) !default;
|
$table-accent-bg: rgba($black, 0.05) !default;
|
||||||
$table-hover-color: $table-color !default;
|
$table-hover-color: $table-color !default;
|
||||||
$table-hover-bg: rgba($black, .075) !default;
|
$table-hover-bg: rgba($black, 0.075) !default;
|
||||||
$table-active-bg: $table-hover-bg !default;
|
$table-active-bg: $table-hover-bg !default;
|
||||||
|
|
||||||
$table-border-width: $border-width !default;
|
$table-border-width: $border-width !default;
|
||||||
|
|
@ -370,9 +358,9 @@ $table-head-color: $gray-700 !default;
|
||||||
|
|
||||||
$table-dark-color: $white !default;
|
$table-dark-color: $white !default;
|
||||||
$table-dark-bg: $gray-800 !default;
|
$table-dark-bg: $gray-800 !default;
|
||||||
$table-dark-accent-bg: rgba($white, .05) !default;
|
$table-dark-accent-bg: rgba($white, 0.05) !default;
|
||||||
$table-dark-hover-color: $table-dark-color !default;
|
$table-dark-hover-color: $table-dark-color !default;
|
||||||
$table-dark-hover-bg: rgba($white, .075) !default;
|
$table-dark-hover-bg: rgba($white, 0.075) !default;
|
||||||
$table-dark-border-color: lighten($table-dark-bg, 7.5%) !default;
|
$table-dark-border-color: lighten($table-dark-bg, 7.5%) !default;
|
||||||
|
|
||||||
$table-striped-order: odd !default;
|
$table-striped-order: odd !default;
|
||||||
|
|
@ -382,34 +370,32 @@ $table-caption-color: $text-muted !default;
|
||||||
$table-bg-level: -9 !default;
|
$table-bg-level: -9 !default;
|
||||||
$table-border-level: -6 !default;
|
$table-border-level: -6 !default;
|
||||||
|
|
||||||
|
|
||||||
// Buttons + Forms
|
// Buttons + Forms
|
||||||
//
|
//
|
||||||
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
|
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
|
||||||
|
|
||||||
$input-btn-padding-y: .375rem !default;
|
$input-btn-padding-y: 0.375rem !default;
|
||||||
$input-btn-padding-x: .75rem !default;
|
$input-btn-padding-x: 0.75rem !default;
|
||||||
$input-btn-font-family: null !default;
|
$input-btn-font-family: null !default;
|
||||||
$input-btn-font-size: $font-size-base !default;
|
$input-btn-font-size: $font-size-base !default;
|
||||||
$input-btn-line-height: $line-height-base !default;
|
$input-btn-line-height: $line-height-base !default;
|
||||||
|
|
||||||
$input-btn-focus-width: .2rem !default;
|
$input-btn-focus-width: 0.2rem !default;
|
||||||
$input-btn-focus-color: rgba($component-active-bg, .25) !default;
|
$input-btn-focus-color: rgba($component-active-bg, 0.25) !default;
|
||||||
$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
|
$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
|
||||||
|
|
||||||
$input-btn-padding-y-sm: .25rem !default;
|
$input-btn-padding-y-sm: 0.25rem !default;
|
||||||
$input-btn-padding-x-sm: .5rem !default;
|
$input-btn-padding-x-sm: 0.5rem !default;
|
||||||
$input-btn-font-size-sm: $font-size-sm !default;
|
$input-btn-font-size-sm: $font-size-sm !default;
|
||||||
$input-btn-line-height-sm: $line-height-sm !default;
|
$input-btn-line-height-sm: $line-height-sm !default;
|
||||||
|
|
||||||
$input-btn-padding-y-lg: .5rem !default;
|
$input-btn-padding-y-lg: 0.5rem !default;
|
||||||
$input-btn-padding-x-lg: 1rem !default;
|
$input-btn-padding-x-lg: 1rem !default;
|
||||||
$input-btn-font-size-lg: $font-size-lg !default;
|
$input-btn-font-size-lg: $font-size-lg !default;
|
||||||
$input-btn-line-height-lg: $line-height-lg !default;
|
$input-btn-line-height-lg: $line-height-lg !default;
|
||||||
|
|
||||||
$input-btn-border-width: $border-width !default;
|
$input-btn-border-width: $border-width !default;
|
||||||
|
|
||||||
|
|
||||||
// Buttons
|
// Buttons
|
||||||
//
|
//
|
||||||
// For each of Bootstrap's buttons, define text, background, and border color.
|
// For each of Bootstrap's buttons, define text, background, and border color.
|
||||||
|
|
@ -434,27 +420,27 @@ $btn-line-height-lg: $input-btn-line-height-lg !default;
|
||||||
$btn-border-width: $input-btn-border-width !default;
|
$btn-border-width: $input-btn-border-width !default;
|
||||||
|
|
||||||
$btn-font-weight: $font-weight-normal !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;
|
$btn-box-shadow: inset 0 1px 0 rgba($white, 0.15), 0 1px 1px rgba($black, 0.075) !default;
|
||||||
$btn-focus-width: $input-btn-focus-width !default;
|
$btn-focus-width: $input-btn-focus-width !default;
|
||||||
$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;
|
$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;
|
||||||
$btn-disabled-opacity: .65 !default;
|
$btn-disabled-opacity: 0.65 !default;
|
||||||
$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;
|
$btn-active-box-shadow: inset 0 3px 5px rgba($black, 0.125) !default;
|
||||||
|
|
||||||
$btn-link-disabled-color: $gray-600 !default;
|
$btn-link-disabled-color: $gray-600 !default;
|
||||||
|
|
||||||
$btn-block-spacing-y: .5rem !default;
|
$btn-block-spacing-y: 0.5rem !default;
|
||||||
|
|
||||||
// Allows for customizing button radius independently from global border radius
|
// Allows for customizing button radius independently from global border radius
|
||||||
$btn-border-radius: $border-radius !default;
|
$btn-border-radius: $border-radius !default;
|
||||||
$btn-border-radius-lg: $border-radius-lg !default;
|
$btn-border-radius-lg: $border-radius-lg !default;
|
||||||
$btn-border-radius-sm: $border-radius-sm !default;
|
$btn-border-radius-sm: $border-radius-sm !default;
|
||||||
|
|
||||||
$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
|
$btn-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
|
||||||
|
box-shadow 0.15s ease-in-out !default;
|
||||||
|
|
||||||
// Forms
|
// Forms
|
||||||
|
|
||||||
$label-margin-bottom: .5rem !default;
|
$label-margin-bottom: 0.5rem !default;
|
||||||
|
|
||||||
$input-padding-y: $input-btn-padding-y !default;
|
$input-padding-y: $input-btn-padding-y !default;
|
||||||
$input-padding-x: $input-btn-padding-x !default;
|
$input-padding-x: $input-btn-padding-x !default;
|
||||||
|
|
@ -479,7 +465,7 @@ $input-disabled-bg: $gray-200 !default;
|
||||||
$input-color: $gray-700 !default;
|
$input-color: $gray-700 !default;
|
||||||
$input-border-color: $gray-400 !default;
|
$input-border-color: $gray-400 !default;
|
||||||
$input-border-width: $input-btn-border-width !default;
|
$input-border-width: $input-btn-border-width !default;
|
||||||
$input-box-shadow: inset 0 1px 1px rgba($black, .075) !default;
|
$input-box-shadow: inset 0 1px 1px rgba($black, 0.075) !default;
|
||||||
|
|
||||||
$input-border-radius: $border-radius !default;
|
$input-border-radius: $border-radius !default;
|
||||||
$input-border-radius-lg: $border-radius-lg !default;
|
$input-border-radius-lg: $border-radius-lg !default;
|
||||||
|
|
@ -497,23 +483,23 @@ $input-plaintext-color: $body-color !default;
|
||||||
$input-height-border: $input-border-width * 2 !default;
|
$input-height-border: $input-border-width * 2 !default;
|
||||||
|
|
||||||
$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;
|
$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;
|
||||||
$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;
|
$input-height-inner-half: add($input-line-height * 0.5em, $input-padding-y) !default;
|
||||||
$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y / 2) !default;
|
$input-height-inner-quarter: add($input-line-height * 0.25em, $input-padding-y / 2) !default;
|
||||||
|
|
||||||
$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;
|
$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;
|
||||||
$input-height-sm: add($input-line-height-sm * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;
|
$input-height-sm: add($input-line-height-sm * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;
|
||||||
$input-height-lg: add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;
|
$input-height-lg: add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;
|
||||||
|
|
||||||
$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
|
$input-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !default;
|
||||||
|
|
||||||
$form-text-margin-top: .25rem !default;
|
$form-text-margin-top: 0.25rem !default;
|
||||||
|
|
||||||
$form-check-input-gutter: 1.25rem !default;
|
$form-check-input-gutter: 1.25rem !default;
|
||||||
$form-check-input-margin-y: .3rem !default;
|
$form-check-input-margin-y: 0.3rem !default;
|
||||||
$form-check-input-margin-x: .25rem !default;
|
$form-check-input-margin-x: 0.25rem !default;
|
||||||
|
|
||||||
$form-check-inline-margin-x: .75rem !default;
|
$form-check-inline-margin-x: 0.75rem !default;
|
||||||
$form-check-inline-input-margin-x: .3125rem !default;
|
$form-check-inline-input-margin-x: 0.3125rem !default;
|
||||||
|
|
||||||
$form-grid-gutter-width: 10px !default;
|
$form-grid-gutter-width: 10px !default;
|
||||||
$form-group-margin-bottom: 1rem !default;
|
$form-group-margin-bottom: 1rem !default;
|
||||||
|
|
@ -522,9 +508,10 @@ $input-group-addon-color: $input-color !default;
|
||||||
$input-group-addon-bg: $gray-200 !default;
|
$input-group-addon-bg: $gray-200 !default;
|
||||||
$input-group-addon-border-color: $input-border-color !default;
|
$input-group-addon-border-color: $input-border-color !default;
|
||||||
|
|
||||||
$custom-forms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
|
$custom-forms-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
|
||||||
|
box-shadow 0.15s ease-in-out !default;
|
||||||
|
|
||||||
$custom-control-gutter: .5rem !default;
|
$custom-control-gutter: 0.5rem !default;
|
||||||
$custom-control-spacer-x: 1rem !default;
|
$custom-control-spacer-x: 1rem !default;
|
||||||
$custom-control-cursor: null !default;
|
$custom-control-cursor: null !default;
|
||||||
|
|
||||||
|
|
@ -543,7 +530,7 @@ $custom-control-label-disabled-color: $gray-600 !default;
|
||||||
|
|
||||||
$custom-control-indicator-checked-color: $component-active-color !default;
|
$custom-control-indicator-checked-color: $component-active-color !default;
|
||||||
$custom-control-indicator-checked-bg: $component-active-bg !default;
|
$custom-control-indicator-checked-bg: $component-active-bg !default;
|
||||||
$custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default;
|
$custom-control-indicator-checked-disabled-bg: rgba(theme-color('primary'), 0.5) !default;
|
||||||
$custom-control-indicator-checked-box-shadow: none !default;
|
$custom-control-indicator-checked-box-shadow: none !default;
|
||||||
$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
|
$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
|
||||||
|
|
||||||
|
|
@ -569,7 +556,10 @@ $custom-radio-indicator-icon-checked: url("data:image/svg+xml,<svg xml
|
||||||
|
|
||||||
$custom-switch-width: $custom-control-indicator-size * 1.75 !default;
|
$custom-switch-width: $custom-control-indicator-size * 1.75 !default;
|
||||||
$custom-switch-indicator-border-radius: $custom-control-indicator-size / 2 !default;
|
$custom-switch-indicator-border-radius: $custom-control-indicator-size / 2 !default;
|
||||||
$custom-switch-indicator-size: subtract($custom-control-indicator-size, $custom-control-indicator-border-width * 4) !default;
|
$custom-switch-indicator-size: subtract(
|
||||||
|
$custom-control-indicator-size,
|
||||||
|
$custom-control-indicator-border-width * 4
|
||||||
|
) !default;
|
||||||
|
|
||||||
$custom-select-padding-y: $input-padding-y !default;
|
$custom-select-padding-y: $input-padding-y !default;
|
||||||
$custom-select-padding-x: $input-padding-x !default;
|
$custom-select-padding-x: $input-padding-x !default;
|
||||||
|
|
@ -586,16 +576,20 @@ $custom-select-disabled-bg: $gray-200 !default;
|
||||||
$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
|
$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
|
||||||
$custom-select-indicator-color: $gray-800 !default;
|
$custom-select-indicator-color: $gray-800 !default;
|
||||||
$custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") !default;
|
$custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") !default;
|
||||||
$custom-select-background: escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
|
$custom-select-background: escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center /
|
||||||
|
$custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
|
||||||
|
|
||||||
$custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default;
|
$custom-select-feedback-icon-padding-right: add(
|
||||||
|
1em * 0.75,
|
||||||
|
(2 * $custom-select-padding-y * 0.75) + $custom-select-padding-x + $custom-select-indicator-padding
|
||||||
|
) !default;
|
||||||
$custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
|
$custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
|
||||||
$custom-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;
|
$custom-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;
|
||||||
|
|
||||||
$custom-select-border-width: $input-border-width !default;
|
$custom-select-border-width: $input-border-width !default;
|
||||||
$custom-select-border-color: $input-border-color !default;
|
$custom-select-border-color: $input-border-color !default;
|
||||||
$custom-select-border-radius: $border-radius !default;
|
$custom-select-border-radius: $border-radius !default;
|
||||||
$custom-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default;
|
$custom-select-box-shadow: inset 0 1px 2px rgba($black, 0.075) !default;
|
||||||
|
|
||||||
$custom-select-focus-border-color: $input-focus-border-color !default;
|
$custom-select-focus-border-color: $input-focus-border-color !default;
|
||||||
$custom-select-focus-width: $input-focus-width !default;
|
$custom-select-focus-width: $input-focus-width !default;
|
||||||
|
|
@ -612,18 +606,18 @@ $custom-select-font-size-lg: $input-font-size-lg !default;
|
||||||
$custom-select-height-lg: $input-height-lg !default;
|
$custom-select-height-lg: $input-height-lg !default;
|
||||||
|
|
||||||
$custom-range-track-width: 100% !default;
|
$custom-range-track-width: 100% !default;
|
||||||
$custom-range-track-height: .5rem !default;
|
$custom-range-track-height: 0.5rem !default;
|
||||||
$custom-range-track-cursor: pointer !default;
|
$custom-range-track-cursor: pointer !default;
|
||||||
$custom-range-track-bg: $gray-300 !default;
|
$custom-range-track-bg: $gray-300 !default;
|
||||||
$custom-range-track-border-radius: 1rem !default;
|
$custom-range-track-border-radius: 1rem !default;
|
||||||
$custom-range-track-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default;
|
$custom-range-track-box-shadow: inset 0 0.25rem 0.25rem rgba($black, 0.1) !default;
|
||||||
|
|
||||||
$custom-range-thumb-width: 1rem !default;
|
$custom-range-thumb-width: 1rem !default;
|
||||||
$custom-range-thumb-height: $custom-range-thumb-width !default;
|
$custom-range-thumb-height: $custom-range-thumb-width !default;
|
||||||
$custom-range-thumb-bg: $component-active-bg !default;
|
$custom-range-thumb-bg: $component-active-bg !default;
|
||||||
$custom-range-thumb-border: 0 !default;
|
$custom-range-thumb-border: 0 !default;
|
||||||
$custom-range-thumb-border-radius: 1rem !default;
|
$custom-range-thumb-border-radius: 1rem !default;
|
||||||
$custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
|
$custom-range-thumb-box-shadow: 0 0.1rem 0.25rem rgba($black, 0.1) !default;
|
||||||
$custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
|
$custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
|
||||||
$custom-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in IE/Edge
|
$custom-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in IE/Edge
|
||||||
$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;
|
$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;
|
||||||
|
|
@ -649,16 +643,15 @@ $custom-file-box-shadow: $input-box-shadow !default;
|
||||||
$custom-file-button-color: $custom-file-color !default;
|
$custom-file-button-color: $custom-file-color !default;
|
||||||
$custom-file-button-bg: $input-group-addon-bg !default;
|
$custom-file-button-bg: $input-group-addon-bg !default;
|
||||||
$custom-file-text: (
|
$custom-file-text: (
|
||||||
en: "Browse"
|
en: 'Browse',
|
||||||
) !default;
|
) !default;
|
||||||
|
|
||||||
|
|
||||||
// Form validation
|
// Form validation
|
||||||
|
|
||||||
$form-feedback-margin-top: $form-text-margin-top !default;
|
$form-feedback-margin-top: $form-text-margin-top !default;
|
||||||
$form-feedback-font-size: $small-font-size !default;
|
$form-feedback-font-size: $small-font-size !default;
|
||||||
$form-feedback-valid-color: theme-color("success") !default;
|
$form-feedback-valid-color: theme-color('success') !default;
|
||||||
$form-feedback-invalid-color: theme-color("danger") !default;
|
$form-feedback-invalid-color: theme-color('danger') !default;
|
||||||
|
|
||||||
$form-feedback-icon-valid-color: $form-feedback-valid-color !default;
|
$form-feedback-icon-valid-color: $form-feedback-valid-color !default;
|
||||||
$form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>") !default;
|
$form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>") !default;
|
||||||
|
|
@ -669,13 +662,13 @@ $form-validation-states: () !default;
|
||||||
// stylelint-disable-next-line scss/dollar-variable-default
|
// stylelint-disable-next-line scss/dollar-variable-default
|
||||||
$form-validation-states: map-merge(
|
$form-validation-states: map-merge(
|
||||||
(
|
(
|
||||||
"valid": (
|
'valid': (
|
||||||
"color": $form-feedback-valid-color,
|
'color': $form-feedback-valid-color,
|
||||||
"icon": $form-feedback-icon-valid
|
'icon': $form-feedback-icon-valid,
|
||||||
),
|
),
|
||||||
"invalid": (
|
'invalid': (
|
||||||
"color": $form-feedback-invalid-color,
|
'color': $form-feedback-invalid-color,
|
||||||
"icon": $form-feedback-icon-invalid
|
'icon': $form-feedback-icon-invalid,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
$form-validation-states
|
$form-validation-states
|
||||||
|
|
@ -694,10 +687,9 @@ $zindex-modal: 1050 !default;
|
||||||
$zindex-popover: 1060 !default;
|
$zindex-popover: 1060 !default;
|
||||||
$zindex-tooltip: 1070 !default;
|
$zindex-tooltip: 1070 !default;
|
||||||
|
|
||||||
|
|
||||||
// Navs
|
// Navs
|
||||||
|
|
||||||
$nav-link-padding-y: .5rem !default;
|
$nav-link-padding-y: 0.5rem !default;
|
||||||
$nav-link-padding-x: 1rem !default;
|
$nav-link-padding-x: 1rem !default;
|
||||||
$nav-link-disabled-color: $gray-600 !default;
|
$nav-link-disabled-color: $gray-600 !default;
|
||||||
|
|
||||||
|
|
@ -716,13 +708,12 @@ $nav-pills-link-active-bg: $component-active-bg !default;
|
||||||
$nav-divider-color: $gray-200 !default;
|
$nav-divider-color: $gray-200 !default;
|
||||||
$nav-divider-margin-y: $spacer / 2 !default;
|
$nav-divider-margin-y: $spacer / 2 !default;
|
||||||
|
|
||||||
|
|
||||||
// Navbar
|
// Navbar
|
||||||
|
|
||||||
$navbar-padding-y: $spacer / 2 !default;
|
$navbar-padding-y: $spacer / 2 !default;
|
||||||
$navbar-padding-x: $spacer !default;
|
$navbar-padding-x: $spacer !default;
|
||||||
|
|
||||||
$navbar-nav-link-padding-x: .5rem !default;
|
$navbar-nav-link-padding-x: 0.5rem !default;
|
||||||
|
|
||||||
$navbar-brand-font-size: $font-size-lg !default;
|
$navbar-brand-font-size: $font-size-lg !default;
|
||||||
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
|
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
|
||||||
|
|
@ -730,48 +721,47 @@ $nav-link-height: $font-size-base * $line-height-base + $nav-l
|
||||||
$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
|
$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
|
||||||
$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default;
|
$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default;
|
||||||
|
|
||||||
$navbar-toggler-padding-y: .25rem !default;
|
$navbar-toggler-padding-y: 0.25rem !default;
|
||||||
$navbar-toggler-padding-x: .75rem !default;
|
$navbar-toggler-padding-x: 0.75rem !default;
|
||||||
$navbar-toggler-font-size: $font-size-lg !default;
|
$navbar-toggler-font-size: $font-size-lg !default;
|
||||||
$navbar-toggler-border-radius: $btn-border-radius !default;
|
$navbar-toggler-border-radius: $btn-border-radius !default;
|
||||||
|
|
||||||
$navbar-dark-color: rgba($white, .5) !default;
|
$navbar-dark-color: rgba($white, 0.5) !default;
|
||||||
$navbar-dark-hover-color: rgba($white, .75) !default;
|
$navbar-dark-hover-color: rgba($white, 0.75) !default;
|
||||||
$navbar-dark-active-color: $white !default;
|
$navbar-dark-active-color: $white !default;
|
||||||
$navbar-dark-disabled-color: rgba($white, .25) !default;
|
$navbar-dark-disabled-color: rgba($white, 0.25) !default;
|
||||||
$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
|
$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
|
||||||
$navbar-dark-toggler-border-color: rgba($white, .1) !default;
|
$navbar-dark-toggler-border-color: rgba($white, 0.1) !default;
|
||||||
|
|
||||||
$navbar-light-color: rgba($black, .5) !default;
|
$navbar-light-color: rgba($black, 0.5) !default;
|
||||||
$navbar-light-hover-color: rgba($black, .7) !default;
|
$navbar-light-hover-color: rgba($black, 0.7) !default;
|
||||||
$navbar-light-active-color: rgba($black, .9) !default;
|
$navbar-light-active-color: rgba($black, 0.9) !default;
|
||||||
$navbar-light-disabled-color: rgba($black, .3) !default;
|
$navbar-light-disabled-color: rgba($black, 0.3) !default;
|
||||||
$navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
|
$navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
|
||||||
$navbar-light-toggler-border-color: rgba($black, .1) !default;
|
$navbar-light-toggler-border-color: rgba($black, 0.1) !default;
|
||||||
|
|
||||||
$navbar-light-brand-color: $navbar-light-active-color !default;
|
$navbar-light-brand-color: $navbar-light-active-color !default;
|
||||||
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
|
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
|
||||||
$navbar-dark-brand-color: $navbar-dark-active-color !default;
|
$navbar-dark-brand-color: $navbar-dark-active-color !default;
|
||||||
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
|
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
|
||||||
|
|
||||||
|
|
||||||
// Dropdowns
|
// Dropdowns
|
||||||
//
|
//
|
||||||
// Dropdown menu container and contents.
|
// Dropdown menu container and contents.
|
||||||
|
|
||||||
$dropdown-min-width: 10rem !default;
|
$dropdown-min-width: 10rem !default;
|
||||||
$dropdown-padding-y: .5rem !default;
|
$dropdown-padding-y: 0.5rem !default;
|
||||||
$dropdown-spacer: .125rem !default;
|
$dropdown-spacer: 0.125rem !default;
|
||||||
$dropdown-font-size: $font-size-base !default;
|
$dropdown-font-size: $font-size-base !default;
|
||||||
$dropdown-color: $body-color !default;
|
$dropdown-color: $body-color !default;
|
||||||
$dropdown-bg: $white !default;
|
$dropdown-bg: $white !default;
|
||||||
$dropdown-border-color: rgba($black, .15) !default;
|
$dropdown-border-color: rgba($black, 0.15) !default;
|
||||||
$dropdown-border-radius: $border-radius !default;
|
$dropdown-border-radius: $border-radius !default;
|
||||||
$dropdown-border-width: $border-width !default;
|
$dropdown-border-width: $border-width !default;
|
||||||
$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;
|
$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;
|
||||||
$dropdown-divider-bg: $gray-200 !default;
|
$dropdown-divider-bg: $gray-200 !default;
|
||||||
$dropdown-divider-margin-y: $nav-divider-margin-y !default;
|
$dropdown-divider-margin-y: $nav-divider-margin-y !default;
|
||||||
$dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default;
|
$dropdown-box-shadow: 0 0.5rem 1rem rgba($black, 0.175) !default;
|
||||||
|
|
||||||
$dropdown-link-color: $gray-900 !default;
|
$dropdown-link-color: $gray-900 !default;
|
||||||
$dropdown-link-hover-color: darken($gray-900, 5%) !default;
|
$dropdown-link-hover-color: darken($gray-900, 5%) !default;
|
||||||
|
|
@ -782,19 +772,18 @@ $dropdown-link-active-bg: $component-active-bg !default;
|
||||||
|
|
||||||
$dropdown-link-disabled-color: $gray-600 !default;
|
$dropdown-link-disabled-color: $gray-600 !default;
|
||||||
|
|
||||||
$dropdown-item-padding-y: .25rem !default;
|
$dropdown-item-padding-y: 0.25rem !default;
|
||||||
$dropdown-item-padding-x: 1.5rem !default;
|
$dropdown-item-padding-x: 1.5rem !default;
|
||||||
|
|
||||||
$dropdown-header-color: $gray-600 !default;
|
$dropdown-header-color: $gray-600 !default;
|
||||||
|
|
||||||
|
|
||||||
// Pagination
|
// Pagination
|
||||||
|
|
||||||
$pagination-padding-y: .5rem !default;
|
$pagination-padding-y: 0.5rem !default;
|
||||||
$pagination-padding-x: .75rem !default;
|
$pagination-padding-x: 0.75rem !default;
|
||||||
$pagination-padding-y-sm: .25rem !default;
|
$pagination-padding-y-sm: 0.25rem !default;
|
||||||
$pagination-padding-x-sm: .5rem !default;
|
$pagination-padding-x-sm: 0.5rem !default;
|
||||||
$pagination-padding-y-lg: .75rem !default;
|
$pagination-padding-y-lg: 0.75rem !default;
|
||||||
$pagination-padding-x-lg: 1.5rem !default;
|
$pagination-padding-x-lg: 1.5rem !default;
|
||||||
$pagination-line-height: 1.25 !default;
|
$pagination-line-height: 1.25 !default;
|
||||||
|
|
||||||
|
|
@ -818,23 +807,21 @@ $pagination-disabled-color: $gray-600 !default;
|
||||||
$pagination-disabled-bg: $white !default;
|
$pagination-disabled-bg: $white !default;
|
||||||
$pagination-disabled-border-color: $gray-300 !default;
|
$pagination-disabled-border-color: $gray-300 !default;
|
||||||
|
|
||||||
|
|
||||||
// Jumbotron
|
// Jumbotron
|
||||||
|
|
||||||
$jumbotron-padding: 2rem !default;
|
$jumbotron-padding: 2rem !default;
|
||||||
$jumbotron-color: null !default;
|
$jumbotron-color: null !default;
|
||||||
$jumbotron-bg: $gray-200 !default;
|
$jumbotron-bg: $gray-200 !default;
|
||||||
|
|
||||||
|
|
||||||
// Cards
|
// Cards
|
||||||
|
|
||||||
$card-spacer-y: .75rem !default;
|
$card-spacer-y: 0.75rem !default;
|
||||||
$card-spacer-x: 1.25rem !default;
|
$card-spacer-x: 1.25rem !default;
|
||||||
$card-border-width: $border-width !default;
|
$card-border-width: $border-width !default;
|
||||||
$card-border-radius: $border-radius !default;
|
$card-border-radius: $border-radius !default;
|
||||||
$card-border-color: rgba($black, .125) !default;
|
$card-border-color: rgba($black, 0.125) !default;
|
||||||
$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;
|
$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;
|
||||||
$card-cap-bg: rgba($black, .03) !default;
|
$card-cap-bg: rgba($black, 0.03) !default;
|
||||||
$card-cap-color: null !default;
|
$card-cap-color: null !default;
|
||||||
$card-height: null !default;
|
$card-height: null !default;
|
||||||
$card-color: null !default;
|
$card-color: null !default;
|
||||||
|
|
@ -849,7 +836,6 @@ $card-columns-count: 3 !default;
|
||||||
$card-columns-gap: 1.25rem !default;
|
$card-columns-gap: 1.25rem !default;
|
||||||
$card-columns-margin: $card-spacer-y !default;
|
$card-columns-margin: $card-spacer-y !default;
|
||||||
|
|
||||||
|
|
||||||
// Tooltips
|
// Tooltips
|
||||||
|
|
||||||
$tooltip-font-size: $font-size-sm !default;
|
$tooltip-font-size: $font-size-sm !default;
|
||||||
|
|
@ -857,13 +843,13 @@ $tooltip-max-width: 200px !default;
|
||||||
$tooltip-color: $white !default;
|
$tooltip-color: $white !default;
|
||||||
$tooltip-bg: $black !default;
|
$tooltip-bg: $black !default;
|
||||||
$tooltip-border-radius: $border-radius !default;
|
$tooltip-border-radius: $border-radius !default;
|
||||||
$tooltip-opacity: .9 !default;
|
$tooltip-opacity: 0.9 !default;
|
||||||
$tooltip-padding-y: .25rem !default;
|
$tooltip-padding-y: 0.25rem !default;
|
||||||
$tooltip-padding-x: .5rem !default;
|
$tooltip-padding-x: 0.5rem !default;
|
||||||
$tooltip-margin: 0 !default;
|
$tooltip-margin: 0 !default;
|
||||||
|
|
||||||
$tooltip-arrow-width: .8rem !default;
|
$tooltip-arrow-width: 0.8rem !default;
|
||||||
$tooltip-arrow-height: .4rem !default;
|
$tooltip-arrow-height: 0.4rem !default;
|
||||||
$tooltip-arrow-color: $tooltip-bg !default;
|
$tooltip-arrow-color: $tooltip-bg !default;
|
||||||
|
|
||||||
// Form tooltips must come after regular tooltips
|
// Form tooltips must come after regular tooltips
|
||||||
|
|
@ -874,93 +860,89 @@ $form-feedback-tooltip-line-height: $line-height-base !default;
|
||||||
$form-feedback-tooltip-opacity: $tooltip-opacity !default;
|
$form-feedback-tooltip-opacity: $tooltip-opacity !default;
|
||||||
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
|
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
|
||||||
|
|
||||||
|
|
||||||
// Popovers
|
// Popovers
|
||||||
|
|
||||||
$popover-font-size: $font-size-sm !default;
|
$popover-font-size: $font-size-sm !default;
|
||||||
$popover-bg: $white !default;
|
$popover-bg: $white !default;
|
||||||
$popover-max-width: 276px !default;
|
$popover-max-width: 276px !default;
|
||||||
$popover-border-width: $border-width !default;
|
$popover-border-width: $border-width !default;
|
||||||
$popover-border-color: rgba($black, .2) !default;
|
$popover-border-color: rgba($black, 0.2) !default;
|
||||||
$popover-border-radius: $border-radius-lg !default;
|
$popover-border-radius: $border-radius-lg !default;
|
||||||
$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;
|
$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;
|
||||||
$popover-box-shadow: 0 .25rem .5rem rgba($black, .2) !default;
|
$popover-box-shadow: 0 0.25rem 0.5rem rgba($black, 0.2) !default;
|
||||||
|
|
||||||
$popover-header-bg: darken($popover-bg, 3%) !default;
|
$popover-header-bg: darken($popover-bg, 3%) !default;
|
||||||
$popover-header-color: $headings-color !default;
|
$popover-header-color: $headings-color !default;
|
||||||
$popover-header-padding-y: .5rem !default;
|
$popover-header-padding-y: 0.5rem !default;
|
||||||
$popover-header-padding-x: .75rem !default;
|
$popover-header-padding-x: 0.75rem !default;
|
||||||
|
|
||||||
$popover-body-color: $body-color !default;
|
$popover-body-color: $body-color !default;
|
||||||
$popover-body-padding-y: $popover-header-padding-y !default;
|
$popover-body-padding-y: $popover-header-padding-y !default;
|
||||||
$popover-body-padding-x: $popover-header-padding-x !default;
|
$popover-body-padding-x: $popover-header-padding-x !default;
|
||||||
|
|
||||||
$popover-arrow-width: 1rem !default;
|
$popover-arrow-width: 1rem !default;
|
||||||
$popover-arrow-height: .5rem !default;
|
$popover-arrow-height: 0.5rem !default;
|
||||||
$popover-arrow-color: $popover-bg !default;
|
$popover-arrow-color: $popover-bg !default;
|
||||||
|
|
||||||
$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
|
$popover-arrow-outer-color: fade-in($popover-border-color, 0.05) !default;
|
||||||
|
|
||||||
|
|
||||||
// Toasts
|
// Toasts
|
||||||
|
|
||||||
$toast-max-width: 350px !default;
|
$toast-max-width: 350px !default;
|
||||||
$toast-padding-x: .75rem !default;
|
$toast-padding-x: 0.75rem !default;
|
||||||
$toast-padding-y: .25rem !default;
|
$toast-padding-y: 0.25rem !default;
|
||||||
$toast-font-size: .875rem !default;
|
$toast-font-size: 0.875rem !default;
|
||||||
$toast-color: null !default;
|
$toast-color: null !default;
|
||||||
$toast-background-color: rgba($white, .85) !default;
|
$toast-background-color: rgba($white, 0.85) !default;
|
||||||
$toast-border-width: 1px !default;
|
$toast-border-width: 1px !default;
|
||||||
$toast-border-color: rgba(0, 0, 0, .1) !default;
|
$toast-border-color: rgba(0, 0, 0, 0.1) !default;
|
||||||
$toast-border-radius: .25rem !default;
|
$toast-border-radius: 0.25rem !default;
|
||||||
$toast-box-shadow: 0 .25rem .75rem rgba($black, .1) !default;
|
$toast-box-shadow: 0 0.25rem 0.75rem rgba($black, 0.1) !default;
|
||||||
|
|
||||||
$toast-header-color: $gray-600 !default;
|
$toast-header-color: $gray-600 !default;
|
||||||
$toast-header-background-color: rgba($white, .85) !default;
|
$toast-header-background-color: rgba($white, 0.85) !default;
|
||||||
$toast-header-border-color: rgba(0, 0, 0, .05) !default;
|
$toast-header-border-color: rgba(0, 0, 0, 0.05) !default;
|
||||||
|
|
||||||
|
|
||||||
// Badges
|
// Badges
|
||||||
|
|
||||||
$badge-font-size: 75% !default;
|
$badge-font-size: 75% !default;
|
||||||
$badge-font-weight: $font-weight-bold !default;
|
$badge-font-weight: $font-weight-bold !default;
|
||||||
$badge-padding-y: .25em !default;
|
$badge-padding-y: 0.25em !default;
|
||||||
$badge-padding-x: .4em !default;
|
$badge-padding-x: 0.4em !default;
|
||||||
$badge-border-radius: $border-radius !default;
|
$badge-border-radius: $border-radius !default;
|
||||||
|
|
||||||
$badge-transition: $btn-transition !default;
|
$badge-transition: $btn-transition !default;
|
||||||
$badge-focus-width: $input-btn-focus-width !default;
|
$badge-focus-width: $input-btn-focus-width !default;
|
||||||
|
|
||||||
$badge-pill-padding-x: .6em !default;
|
$badge-pill-padding-x: 0.6em !default;
|
||||||
// Use a higher than normal value to ensure completely rounded edges when
|
// Use a higher than normal value to ensure completely rounded edges when
|
||||||
// customizing padding or font-size on labels.
|
// customizing padding or font-size on labels.
|
||||||
$badge-pill-border-radius: 10rem !default;
|
$badge-pill-border-radius: 10rem !default;
|
||||||
|
|
||||||
|
|
||||||
// Modals
|
// Modals
|
||||||
|
|
||||||
// Padding applied to the modal body
|
// Padding applied to the modal body
|
||||||
$modal-inner-padding: 1rem !default;
|
$modal-inner-padding: 1rem !default;
|
||||||
|
|
||||||
// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding
|
// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding
|
||||||
$modal-footer-margin-between: .5rem !default;
|
$modal-footer-margin-between: 0.5rem !default;
|
||||||
|
|
||||||
$modal-dialog-margin: .5rem !default;
|
$modal-dialog-margin: 0.5rem !default;
|
||||||
$modal-dialog-margin-y-sm-up: 1.75rem !default;
|
$modal-dialog-margin-y-sm-up: 1.75rem !default;
|
||||||
|
|
||||||
$modal-title-line-height: $line-height-base !default;
|
$modal-title-line-height: $line-height-base !default;
|
||||||
|
|
||||||
$modal-content-color: null !default;
|
$modal-content-color: null !default;
|
||||||
$modal-content-bg: $white !default;
|
$modal-content-bg: $white !default;
|
||||||
$modal-content-border-color: rgba($black, .2) !default;
|
$modal-content-border-color: rgba($black, 0.2) !default;
|
||||||
$modal-content-border-width: $border-width !default;
|
$modal-content-border-width: $border-width !default;
|
||||||
$modal-content-border-radius: $border-radius-lg !default;
|
$modal-content-border-radius: $border-radius-lg !default;
|
||||||
$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;
|
$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;
|
||||||
$modal-content-box-shadow-xs: 0 .25rem .5rem rgba($black, .5) !default;
|
$modal-content-box-shadow-xs: 0 0.25rem 0.5rem rgba($black, 0.5) !default;
|
||||||
$modal-content-box-shadow-sm-up: 0 .5rem 1rem rgba($black, .5) !default;
|
$modal-content-box-shadow-sm-up: 0 0.5rem 1rem rgba($black, 0.5) !default;
|
||||||
|
|
||||||
$modal-backdrop-bg: $black !default;
|
$modal-backdrop-bg: $black !default;
|
||||||
$modal-backdrop-opacity: .5 !default;
|
$modal-backdrop-opacity: 0.5 !default;
|
||||||
$modal-header-border-color: $border-color !default;
|
$modal-header-border-color: $border-color !default;
|
||||||
$modal-footer-border-color: $modal-header-border-color !default;
|
$modal-footer-border-color: $modal-header-border-color !default;
|
||||||
$modal-header-border-width: $modal-content-border-width !default;
|
$modal-header-border-width: $modal-content-border-width !default;
|
||||||
|
|
@ -976,15 +958,14 @@ $modal-sm: 300px !default;
|
||||||
|
|
||||||
$modal-fade-transform: translate(0, -50px) !default;
|
$modal-fade-transform: translate(0, -50px) !default;
|
||||||
$modal-show-transform: none !default;
|
$modal-show-transform: none !default;
|
||||||
$modal-transition: transform .3s ease-out !default;
|
$modal-transition: transform 0.3s ease-out !default;
|
||||||
$modal-scale-transform: scale(1.02) !default;
|
$modal-scale-transform: scale(1.02) !default;
|
||||||
|
|
||||||
|
|
||||||
// Alerts
|
// Alerts
|
||||||
//
|
//
|
||||||
// Define alert colors, border radius, and padding.
|
// Define alert colors, border radius, and padding.
|
||||||
|
|
||||||
$alert-padding-y: .75rem !default;
|
$alert-padding-y: 0.75rem !default;
|
||||||
$alert-padding-x: 1.25rem !default;
|
$alert-padding-x: 1.25rem !default;
|
||||||
$alert-margin-bottom: 1rem !default;
|
$alert-margin-bottom: 1rem !default;
|
||||||
$alert-border-radius: $border-radius !default;
|
$alert-border-radius: $border-radius !default;
|
||||||
|
|
@ -995,29 +976,27 @@ $alert-bg-level: -10 !default;
|
||||||
$alert-border-level: -9 !default;
|
$alert-border-level: -9 !default;
|
||||||
$alert-color-level: 6 !default;
|
$alert-color-level: 6 !default;
|
||||||
|
|
||||||
|
|
||||||
// Progress bars
|
// Progress bars
|
||||||
|
|
||||||
$progress-height: 1rem !default;
|
$progress-height: 1rem !default;
|
||||||
$progress-font-size: $font-size-base * .75 !default;
|
$progress-font-size: $font-size-base * 0.75 !default;
|
||||||
$progress-bg: $gray-200 !default;
|
$progress-bg: $gray-200 !default;
|
||||||
$progress-border-radius: $border-radius !default;
|
$progress-border-radius: $border-radius !default;
|
||||||
$progress-box-shadow: inset 0 .1rem .1rem rgba($black, .1) !default;
|
$progress-box-shadow: inset 0 0.1rem 0.1rem rgba($black, 0.1) !default;
|
||||||
$progress-bar-color: $white !default;
|
$progress-bar-color: $white !default;
|
||||||
$progress-bar-bg: theme-color("primary") !default;
|
$progress-bar-bg: theme-color('primary') !default;
|
||||||
$progress-bar-animation-timing: 1s linear infinite !default;
|
$progress-bar-animation-timing: 1s linear infinite !default;
|
||||||
$progress-bar-transition: width .6s ease !default;
|
$progress-bar-transition: width 0.6s ease !default;
|
||||||
|
|
||||||
|
|
||||||
// List group
|
// List group
|
||||||
|
|
||||||
$list-group-color: null !default;
|
$list-group-color: null !default;
|
||||||
$list-group-bg: $white !default;
|
$list-group-bg: $white !default;
|
||||||
$list-group-border-color: rgba($black, .125) !default;
|
$list-group-border-color: rgba($black, 0.125) !default;
|
||||||
$list-group-border-width: $border-width !default;
|
$list-group-border-width: $border-width !default;
|
||||||
$list-group-border-radius: $border-radius !default;
|
$list-group-border-radius: $border-radius !default;
|
||||||
|
|
||||||
$list-group-item-padding-y: .75rem !default;
|
$list-group-item-padding-y: 0.75rem !default;
|
||||||
$list-group-item-padding-x: 1.25rem !default;
|
$list-group-item-padding-x: 1.25rem !default;
|
||||||
|
|
||||||
$list-group-hover-bg: $gray-100 !default;
|
$list-group-hover-bg: $gray-100 !default;
|
||||||
|
|
@ -1034,55 +1013,51 @@ $list-group-action-hover-color: $list-group-action-color !default;
|
||||||
$list-group-action-active-color: $body-color !default;
|
$list-group-action-active-color: $body-color !default;
|
||||||
$list-group-action-active-bg: $gray-200 !default;
|
$list-group-action-active-bg: $gray-200 !default;
|
||||||
|
|
||||||
|
|
||||||
// Image thumbnails
|
// Image thumbnails
|
||||||
|
|
||||||
$thumbnail-padding: .25rem !default;
|
$thumbnail-padding: 0.25rem !default;
|
||||||
$thumbnail-bg: $body-bg !default;
|
$thumbnail-bg: $body-bg !default;
|
||||||
$thumbnail-border-width: $border-width !default;
|
$thumbnail-border-width: $border-width !default;
|
||||||
$thumbnail-border-color: $gray-300 !default;
|
$thumbnail-border-color: $gray-300 !default;
|
||||||
$thumbnail-border-radius: $border-radius !default;
|
$thumbnail-border-radius: $border-radius !default;
|
||||||
$thumbnail-box-shadow: 0 1px 2px rgba($black, .075) !default;
|
$thumbnail-box-shadow: 0 1px 2px rgba($black, 0.075) !default;
|
||||||
|
|
||||||
|
|
||||||
// Figures
|
// Figures
|
||||||
|
|
||||||
$figure-caption-font-size: 90% !default;
|
$figure-caption-font-size: 90% !default;
|
||||||
$figure-caption-color: $gray-600 !default;
|
$figure-caption-color: $gray-600 !default;
|
||||||
|
|
||||||
|
|
||||||
// Breadcrumbs
|
// Breadcrumbs
|
||||||
|
|
||||||
$breadcrumb-font-size: null !default;
|
$breadcrumb-font-size: null !default;
|
||||||
|
|
||||||
$breadcrumb-padding-y: .75rem !default;
|
$breadcrumb-padding-y: 0.75rem !default;
|
||||||
$breadcrumb-padding-x: 1rem !default;
|
$breadcrumb-padding-x: 1rem !default;
|
||||||
$breadcrumb-item-padding: .5rem !default;
|
$breadcrumb-item-padding: 0.5rem !default;
|
||||||
|
|
||||||
$breadcrumb-margin-bottom: 1rem !default;
|
$breadcrumb-margin-bottom: 1rem !default;
|
||||||
|
|
||||||
$breadcrumb-bg: $gray-200 !default;
|
$breadcrumb-bg: $gray-200 !default;
|
||||||
$breadcrumb-divider-color: $gray-600 !default;
|
$breadcrumb-divider-color: $gray-600 !default;
|
||||||
$breadcrumb-active-color: $gray-600 !default;
|
$breadcrumb-active-color: $gray-600 !default;
|
||||||
$breadcrumb-divider: quote("/") !default;
|
$breadcrumb-divider: quote('/') !default;
|
||||||
|
|
||||||
$breadcrumb-border-radius: $border-radius !default;
|
$breadcrumb-border-radius: $border-radius !default;
|
||||||
|
|
||||||
|
|
||||||
// Carousel
|
// Carousel
|
||||||
|
|
||||||
$carousel-control-color: $white !default;
|
$carousel-control-color: $white !default;
|
||||||
$carousel-control-width: 15% !default;
|
$carousel-control-width: 15% !default;
|
||||||
$carousel-control-opacity: .5 !default;
|
$carousel-control-opacity: 0.5 !default;
|
||||||
$carousel-control-hover-opacity: .9 !default;
|
$carousel-control-hover-opacity: 0.9 !default;
|
||||||
$carousel-control-transition: opacity .15s ease !default;
|
$carousel-control-transition: opacity 0.15s ease !default;
|
||||||
|
|
||||||
$carousel-indicator-width: 30px !default;
|
$carousel-indicator-width: 30px !default;
|
||||||
$carousel-indicator-height: 3px !default;
|
$carousel-indicator-height: 3px !default;
|
||||||
$carousel-indicator-hit-area-height: 10px !default;
|
$carousel-indicator-hit-area-height: 10px !default;
|
||||||
$carousel-indicator-spacer: 3px !default;
|
$carousel-indicator-spacer: 3px !default;
|
||||||
$carousel-indicator-active-bg: $white !default;
|
$carousel-indicator-active-bg: $white !default;
|
||||||
$carousel-indicator-transition: opacity .6s ease !default;
|
$carousel-indicator-transition: opacity 0.6s ease !default;
|
||||||
|
|
||||||
$carousel-caption-width: 70% !default;
|
$carousel-caption-width: 70% !default;
|
||||||
$carousel-caption-color: $white !default;
|
$carousel-caption-color: $white !default;
|
||||||
|
|
@ -1092,20 +1067,18 @@ $carousel-control-icon-width: 20px !default;
|
||||||
$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/></svg>") !default;
|
$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/></svg>") !default;
|
||||||
$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default;
|
$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default;
|
||||||
|
|
||||||
$carousel-transition-duration: .6s !default;
|
$carousel-transition-duration: 0.6s !default;
|
||||||
$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
|
$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
|
||||||
|
|
||||||
|
|
||||||
// Spinners
|
// Spinners
|
||||||
|
|
||||||
$spinner-width: 2rem !default;
|
$spinner-width: 2rem !default;
|
||||||
$spinner-height: $spinner-width !default;
|
$spinner-height: $spinner-width !default;
|
||||||
$spinner-border-width: .25em !default;
|
$spinner-border-width: 0.25em !default;
|
||||||
|
|
||||||
$spinner-width-sm: 1rem !default;
|
$spinner-width-sm: 1rem !default;
|
||||||
$spinner-height-sm: $spinner-width-sm !default;
|
$spinner-height-sm: $spinner-width-sm !default;
|
||||||
$spinner-border-width-sm: .2em !default;
|
$spinner-border-width-sm: 0.2em !default;
|
||||||
|
|
||||||
|
|
||||||
// Close
|
// Close
|
||||||
|
|
||||||
|
|
@ -1114,14 +1087,13 @@ $close-font-weight: $font-weight-bold !default;
|
||||||
$close-color: $black !default;
|
$close-color: $black !default;
|
||||||
$close-text-shadow: 0 1px 0 $white !default;
|
$close-text-shadow: 0 1px 0 $white !default;
|
||||||
|
|
||||||
|
|
||||||
// Code
|
// Code
|
||||||
|
|
||||||
$code-font-size: 87.5% !default;
|
$code-font-size: 87.5% !default;
|
||||||
$code-color: $pink !default;
|
$code-color: $pink !default;
|
||||||
|
|
||||||
$kbd-padding-y: .2rem !default;
|
$kbd-padding-y: 0.2rem !default;
|
||||||
$kbd-padding-x: .4rem !default;
|
$kbd-padding-x: 0.4rem !default;
|
||||||
$kbd-font-size: $code-font-size !default;
|
$kbd-font-size: $code-font-size !default;
|
||||||
$kbd-color: $white !default;
|
$kbd-color: $white !default;
|
||||||
$kbd-bg: $gray-900 !default;
|
$kbd-bg: $gray-900 !default;
|
||||||
|
|
@ -1129,15 +1101,13 @@ $kbd-bg: $gray-900 !default;
|
||||||
$pre-color: $gray-900 !default;
|
$pre-color: $gray-900 !default;
|
||||||
$pre-scrollable-max-height: 340px !default;
|
$pre-scrollable-max-height: 340px !default;
|
||||||
|
|
||||||
|
|
||||||
// Utilities
|
// Utilities
|
||||||
|
|
||||||
$displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default;
|
$displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default;
|
||||||
$overflows: auto, hidden !default;
|
$overflows: auto, hidden !default;
|
||||||
$positions: static, relative, absolute, fixed, sticky !default;
|
$positions: static, relative, absolute, fixed, sticky !default;
|
||||||
|
|
||||||
|
|
||||||
// Printing
|
// Printing
|
||||||
|
|
||||||
$print-page-size: a3 !default;
|
$print-page-size: a3 !default;
|
||||||
$print-body-min-width: map-get($grid-breakpoints, "lg") !default;
|
$print-body-min-width: map-get($grid-breakpoints, 'lg') !default;
|
||||||
|
|
|
||||||
|
|
@ -22,7 +22,7 @@ $rfs-two-dimensional: false !default;
|
||||||
// Factor of decrease
|
// Factor of decrease
|
||||||
$rfs-factor: 10 !default;
|
$rfs-factor: 10 !default;
|
||||||
|
|
||||||
@if type-of($rfs-factor) != "number" or $rfs-factor <= 1 {
|
@if type-of($rfs-factor) != 'number' or $rfs-factor <= 1 {
|
||||||
@error "`#{$rfs-factor}` is not a valid $rfs-factor, it must be greater than 1.";
|
@error "`#{$rfs-factor}` is not a valid $rfs-factor, it must be greater than 1.";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -42,10 +42,9 @@ $enable-responsive-font-sizes: true !default;
|
||||||
$rfs-base-font-size-unit: unit($rfs-base-font-size);
|
$rfs-base-font-size-unit: unit($rfs-base-font-size);
|
||||||
|
|
||||||
// Remove px-unit from $rfs-base-font-size for calculations
|
// Remove px-unit from $rfs-base-font-size for calculations
|
||||||
@if $rfs-base-font-size-unit == "px" {
|
@if $rfs-base-font-size-unit == 'px' {
|
||||||
$rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1);
|
$rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1);
|
||||||
}
|
} @else if $rfs-base-font-size-unit == 'rem' {
|
||||||
@else if $rfs-base-font-size-unit == "rem" {
|
|
||||||
$rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1 / $rfs-rem-value);
|
$rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1 / $rfs-rem-value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -53,46 +52,41 @@ $rfs-base-font-size-unit: unit($rfs-base-font-size);
|
||||||
$rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
|
$rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
|
||||||
|
|
||||||
// Remove unit from $rfs-breakpoint for calculations
|
// Remove unit from $rfs-breakpoint for calculations
|
||||||
@if $rfs-breakpoint-unit-cache == "px" {
|
@if $rfs-breakpoint-unit-cache == 'px' {
|
||||||
$rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1);
|
$rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1);
|
||||||
}
|
} @else if $rfs-breakpoint-unit-cache == 'rem' or $rfs-breakpoint-unit-cache == 'em' {
|
||||||
@else if $rfs-breakpoint-unit-cache == "rem" or $rfs-breakpoint-unit-cache == "em" {
|
|
||||||
$rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1 / $rfs-rem-value);
|
$rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1 / $rfs-rem-value);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Responsive font-size mixin
|
// Responsive font-size mixin
|
||||||
@mixin rfs($fs, $important: false) {
|
@mixin rfs($fs, $important: false) {
|
||||||
// Cache $fs unit
|
// Cache $fs unit
|
||||||
$fs-unit: if(type-of($fs) == "number", unit($fs), false);
|
$fs-unit: if(type-of($fs) == 'number', unit($fs), false);
|
||||||
|
|
||||||
// Add !important suffix if needed
|
// Add !important suffix if needed
|
||||||
$rfs-suffix: if($important, " !important", "");
|
$rfs-suffix: if($important, ' !important', '');
|
||||||
|
|
||||||
// If $fs isn't a number (like inherit) or $fs has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
|
// If $fs isn't a number (like inherit) or $fs has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
|
||||||
@if not $fs-unit or $fs-unit != "" and $fs-unit != "px" and $fs-unit != "rem" or $fs == 0 {
|
@if not $fs-unit or $fs-unit != '' and $fs-unit != 'px' and $fs-unit != 'rem' or $fs == 0 {
|
||||||
font-size: #{$fs}#{$rfs-suffix};
|
font-size: #{$fs}#{$rfs-suffix};
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
// Variables for storing static and fluid rescaling
|
// Variables for storing static and fluid rescaling
|
||||||
$rfs-static: null;
|
$rfs-static: null;
|
||||||
$rfs-fluid: null;
|
$rfs-fluid: null;
|
||||||
|
|
||||||
// Remove px-unit from $fs for calculations
|
// Remove px-unit from $fs for calculations
|
||||||
@if $fs-unit == "px" {
|
@if $fs-unit == 'px' {
|
||||||
$fs: $fs / ($fs * 0 + 1);
|
$fs: $fs / ($fs * 0 + 1);
|
||||||
}
|
} @else if $fs-unit == 'rem' {
|
||||||
@else if $fs-unit == "rem" {
|
|
||||||
$fs: $fs / ($fs * 0 + 1 / $rfs-rem-value);
|
$fs: $fs / ($fs * 0 + 1 / $rfs-rem-value);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Set default font-size
|
// Set default font-size
|
||||||
@if $rfs-font-size-unit == rem {
|
@if $rfs-font-size-unit == rem {
|
||||||
$rfs-static: #{$fs / $rfs-rem-value}rem#{$rfs-suffix};
|
$rfs-static: #{$fs / $rfs-rem-value}rem#{$rfs-suffix};
|
||||||
}
|
} @else if $rfs-font-size-unit == px {
|
||||||
@else if $rfs-font-size-unit == px {
|
|
||||||
$rfs-static: #{$fs}px#{$rfs-suffix};
|
$rfs-static: #{$fs}px#{$rfs-suffix};
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
@error "`#{$rfs-font-size-unit}` is not a valid unit for $rfs-font-size-unit. Use `px` or `rem`.";
|
@error "`#{$rfs-font-size-unit}` is not a valid unit for $rfs-font-size-unit. Use `px` or `rem`.";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -126,22 +120,19 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
|
||||||
@if $rfs-fluid == null {
|
@if $rfs-fluid == null {
|
||||||
// Only render static font-size if no fluid font-size is available
|
// Only render static font-size if no fluid font-size is available
|
||||||
font-size: $rfs-static;
|
font-size: $rfs-static;
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
$mq-value: null;
|
$mq-value: null;
|
||||||
|
|
||||||
// RFS breakpoint formatting
|
// RFS breakpoint formatting
|
||||||
@if $rfs-breakpoint-unit == em or $rfs-breakpoint-unit == rem {
|
@if $rfs-breakpoint-unit == em or $rfs-breakpoint-unit == rem {
|
||||||
$mq-value: #{$rfs-breakpoint / $rfs-rem-value}#{$rfs-breakpoint-unit};
|
$mq-value: #{$rfs-breakpoint / $rfs-rem-value}#{$rfs-breakpoint-unit};
|
||||||
}
|
} @else if $rfs-breakpoint-unit == px {
|
||||||
@else if $rfs-breakpoint-unit == px {
|
|
||||||
$mq-value: #{$rfs-breakpoint}px;
|
$mq-value: #{$rfs-breakpoint}px;
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
@error "`#{$rfs-breakpoint-unit}` is not a valid unit for $rfs-breakpoint-unit. Use `px`, `em` or `rem`.";
|
@error "`#{$rfs-breakpoint-unit}` is not a valid unit for $rfs-breakpoint-unit. Use `px`, `em` or `rem`.";
|
||||||
}
|
}
|
||||||
|
|
||||||
@if $rfs-class == "disable" {
|
@if $rfs-class == 'disable' {
|
||||||
// Adding an extra class increases specificity,
|
// Adding an extra class increases specificity,
|
||||||
// which prevents the media query to override the font size
|
// which prevents the media query to override the font size
|
||||||
&,
|
&,
|
||||||
|
|
@ -149,20 +140,18 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
|
||||||
&.disable-responsive-font-size {
|
&.disable-responsive-font-size {
|
||||||
font-size: $rfs-static;
|
font-size: $rfs-static;
|
||||||
}
|
}
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
font-size: $rfs-static;
|
font-size: $rfs-static;
|
||||||
}
|
}
|
||||||
|
|
||||||
@if $rfs-two-dimensional {
|
@if $rfs-two-dimensional {
|
||||||
@media (max-width: #{$mq-value}), (max-height: #{$mq-value}) {
|
@media (max-width: #{$mq-value}), (max-height: #{$mq-value}) {
|
||||||
@if $rfs-class == "enable" {
|
@if $rfs-class == 'enable' {
|
||||||
.enable-responsive-font-size &,
|
.enable-responsive-font-size &,
|
||||||
&.enable-responsive-font-size {
|
&.enable-responsive-font-size {
|
||||||
font-size: $rfs-fluid;
|
font-size: $rfs-fluid;
|
||||||
}
|
}
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
font-size: $rfs-fluid;
|
font-size: $rfs-fluid;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -171,16 +160,14 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
|
||||||
min-width: 0vw;
|
min-width: 0vw;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
@media (max-width: #{$mq-value}) {
|
@media (max-width: #{$mq-value}) {
|
||||||
@if $rfs-class == "enable" {
|
@if $rfs-class == 'enable' {
|
||||||
.enable-responsive-font-size &,
|
.enable-responsive-font-size &,
|
||||||
&.enable-responsive-font-size {
|
&.enable-responsive-font-size {
|
||||||
font-size: $rfs-fluid;
|
font-size: $rfs-fluid;
|
||||||
}
|
}
|
||||||
}
|
} @else {
|
||||||
@else {
|
|
||||||
font-size: $rfs-fluid;
|
font-size: $rfs-fluid;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -16,14 +16,14 @@ html {
|
||||||
box-sizing: inherit;
|
box-sizing: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
@import "functions";
|
@import 'functions';
|
||||||
@import "variables";
|
@import 'variables';
|
||||||
|
|
||||||
@import "mixins/breakpoints";
|
@import 'mixins/breakpoints';
|
||||||
@import "mixins/grid-framework";
|
@import 'mixins/grid-framework';
|
||||||
@import "mixins/grid";
|
@import 'mixins/grid';
|
||||||
|
|
||||||
@import "grid";
|
@import 'grid';
|
||||||
@import "utilities/display";
|
@import 'utilities/display';
|
||||||
@import "utilities/flex";
|
@import 'utilities/flex';
|
||||||
@import "utilities/spacing";
|
@import 'utilities/spacing';
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
@import "functions";
|
@import 'functions';
|
||||||
@import "variables";
|
@import 'variables';
|
||||||
@import "mixins";
|
@import 'mixins';
|
||||||
@import "reboot";
|
@import 'reboot';
|
||||||
|
|
|
||||||
|
|
@ -5,40 +5,40 @@
|
||||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
@import "functions";
|
@import 'functions';
|
||||||
@import "variables";
|
@import 'variables';
|
||||||
@import "mixins";
|
@import 'mixins';
|
||||||
@import "root";
|
@import 'root';
|
||||||
@import "reboot";
|
@import 'reboot';
|
||||||
@import "type";
|
@import 'type';
|
||||||
@import "images";
|
@import 'images';
|
||||||
@import "code";
|
@import 'code';
|
||||||
@import "grid";
|
@import 'grid';
|
||||||
@import "tables";
|
@import 'tables';
|
||||||
@import "forms";
|
@import 'forms';
|
||||||
@import "buttons";
|
@import 'buttons';
|
||||||
@import "transitions";
|
@import 'transitions';
|
||||||
@import "dropdown";
|
@import 'dropdown';
|
||||||
@import "button-group";
|
@import 'button-group';
|
||||||
@import "input-group";
|
@import 'input-group';
|
||||||
@import "custom-forms";
|
@import 'custom-forms';
|
||||||
@import "nav";
|
@import 'nav';
|
||||||
@import "navbar";
|
@import 'navbar';
|
||||||
@import "card";
|
@import 'card';
|
||||||
@import "breadcrumb";
|
@import 'breadcrumb';
|
||||||
@import "pagination";
|
@import 'pagination';
|
||||||
@import "badge";
|
@import 'badge';
|
||||||
@import "jumbotron";
|
@import 'jumbotron';
|
||||||
@import "alert";
|
@import 'alert';
|
||||||
@import "progress";
|
@import 'progress';
|
||||||
@import "media";
|
@import 'media';
|
||||||
@import "list-group";
|
@import 'list-group';
|
||||||
@import "close";
|
@import 'close';
|
||||||
@import "toasts";
|
@import 'toasts';
|
||||||
@import "modal";
|
@import 'modal';
|
||||||
@import "tooltip";
|
@import 'tooltip';
|
||||||
@import "popover";
|
@import 'popover';
|
||||||
@import "carousel";
|
@import 'carousel';
|
||||||
@import "spinners";
|
@import 'spinners';
|
||||||
@import "utilities";
|
@import 'utilities';
|
||||||
@import "print";
|
@import 'print';
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
background-color: darken($color, 10%) !important;
|
background-color: darken($color, 10%) !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include deprecate("The `bg-variant` mixin", "v4.4.0", "v5", $ignore-warning);
|
@include deprecate('The `bg-variant` mixin', 'v4.4.0', 'v5', $ignore-warning);
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin bg-gradient-variant($parent, $color) {
|
@mixin bg-gradient-variant($parent, $color) {
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@
|
||||||
&:focus,
|
&:focus,
|
||||||
&.focus {
|
&.focus {
|
||||||
outline: 0;
|
outline: 0;
|
||||||
box-shadow: 0 0 0 $badge-focus-width rgba($bg, .5);
|
box-shadow: 0 0 0 $badge-focus-width rgba($bg, 0.5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,8 +4,7 @@
|
||||||
@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
|
@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
|
||||||
@if $enable-rounded {
|
@if $enable-rounded {
|
||||||
border-radius: $radius;
|
border-radius: $radius;
|
||||||
}
|
} @else if $fallback-border-radius != false {
|
||||||
@else if $fallback-border-radius != false {
|
|
||||||
border-radius: $fallback-border-radius;
|
border-radius: $fallback-border-radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -8,8 +8,8 @@
|
||||||
} @else {
|
} @else {
|
||||||
// Filter to avoid invalid properties for example `box-shadow: none, 1px 1px black;`
|
// Filter to avoid invalid properties for example `box-shadow: none, 1px 1px black;`
|
||||||
@for $i from 1 through length($shadow) {
|
@for $i from 1 through length($shadow) {
|
||||||
@if nth($shadow, $i) != "none" {
|
@if nth($shadow, $i) != 'none' {
|
||||||
$result: append($result, nth($shadow, $i), "comma");
|
$result: append($result, nth($shadow, $i), 'comma');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@
|
||||||
// 767.98px
|
// 767.98px
|
||||||
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
|
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
|
||||||
$next: breakpoint-next($name, $breakpoints);
|
$next: breakpoint-next($name, $breakpoints);
|
||||||
@return if($next, breakpoint-min($next, $breakpoints) - .02, null);
|
@return if($next, breakpoint-min($next, $breakpoints) - 0.02, null);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.
|
// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.
|
||||||
|
|
@ -50,7 +50,7 @@
|
||||||
// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
|
// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
|
||||||
// "-sm"
|
// "-sm"
|
||||||
@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
|
@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
|
||||||
@return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
|
@return if(breakpoint-min($name, $breakpoints) == null, '', '-#{$name}');
|
||||||
}
|
}
|
||||||
|
|
||||||
// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
|
// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,14 @@
|
||||||
// Easily pump out default styles, as well as :hover, :focus, :active,
|
// Easily pump out default styles, as well as :hover, :focus, :active,
|
||||||
// and disabled options for all buttons
|
// and disabled options for all buttons
|
||||||
|
|
||||||
@mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) {
|
@mixin button-variant(
|
||||||
|
$background,
|
||||||
|
$border,
|
||||||
|
$hover-background: darken($background, 7.5%),
|
||||||
|
$hover-border: darken($border, 10%),
|
||||||
|
$active-background: darken($background, 10%),
|
||||||
|
$active-border: darken($border, 12.5%)
|
||||||
|
) {
|
||||||
color: color-yiq($background);
|
color: color-yiq($background);
|
||||||
@include gradient-bg($background);
|
@include gradient-bg($background);
|
||||||
border-color: $border;
|
border-color: $border;
|
||||||
|
|
@ -22,9 +29,9 @@
|
||||||
border-color: $hover-border;
|
border-color: $hover-border;
|
||||||
// Avoid using mixin so we can pass custom focus shadow properly
|
// Avoid using mixin so we can pass custom focus shadow properly
|
||||||
@if $enable-shadows {
|
@if $enable-shadows {
|
||||||
box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
|
box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), 0.5);
|
||||||
} @else {
|
} @else {
|
||||||
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
|
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), 0.5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -53,15 +60,20 @@
|
||||||
&:focus {
|
&:focus {
|
||||||
// Avoid using mixin so we can pass custom focus shadow properly
|
// Avoid using mixin so we can pass custom focus shadow properly
|
||||||
@if $enable-shadows and $btn-active-box-shadow != none {
|
@if $enable-shadows and $btn-active-box-shadow != none {
|
||||||
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
|
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), 0.5);
|
||||||
} @else {
|
} @else {
|
||||||
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
|
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), 0.5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) {
|
@mixin button-outline-variant(
|
||||||
|
$color,
|
||||||
|
$color-hover: color-yiq($color),
|
||||||
|
$active-background: $color,
|
||||||
|
$active-border: $color
|
||||||
|
) {
|
||||||
color: $color;
|
color: $color;
|
||||||
border-color: $color;
|
border-color: $color;
|
||||||
|
|
||||||
|
|
@ -73,7 +85,7 @@
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&.focus {
|
&.focus {
|
||||||
box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
|
box-shadow: 0 0 0 $btn-focus-width rgba($color, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.disabled,
|
&.disabled,
|
||||||
|
|
@ -92,9 +104,9 @@
|
||||||
&:focus {
|
&:focus {
|
||||||
// Avoid using mixin so we can pass custom focus shadow properly
|
// Avoid using mixin so we can pass custom focus shadow properly
|
||||||
@if $enable-shadows and $btn-active-box-shadow != none {
|
@if $enable-shadows and $btn-active-box-shadow != none {
|
||||||
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5);
|
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, 0.5);
|
||||||
} @else {
|
} @else {
|
||||||
box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
|
box-shadow: 0 0 0 $btn-focus-width rgba($color, 0.5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -31,7 +31,7 @@
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: $caret-spacing;
|
margin-left: $caret-spacing;
|
||||||
vertical-align: $caret-vertical-align;
|
vertical-align: $caret-vertical-align;
|
||||||
content: "";
|
content: '';
|
||||||
@if $direction == down {
|
@if $direction == down {
|
||||||
@include caret-down();
|
@include caret-down();
|
||||||
} @else if $direction == up {
|
} @else if $direction == up {
|
||||||
|
|
@ -50,7 +50,7 @@
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: $caret-spacing;
|
margin-right: $caret-spacing;
|
||||||
vertical-align: $caret-vertical-align;
|
vertical-align: $caret-vertical-align;
|
||||||
content: "";
|
content: '';
|
||||||
@include caret-left();
|
@include caret-left();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,6 +2,6 @@
|
||||||
&::after {
|
&::after {
|
||||||
display: block;
|
display: block;
|
||||||
clear: both;
|
clear: both;
|
||||||
content: "";
|
content: '';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,13 +2,13 @@
|
||||||
|
|
||||||
@mixin float-left() {
|
@mixin float-left() {
|
||||||
float: left !important;
|
float: left !important;
|
||||||
@include deprecate("The `float-left` mixin", "v4.3.0", "v5");
|
@include deprecate('The `float-left` mixin', 'v4.3.0', 'v5');
|
||||||
}
|
}
|
||||||
@mixin float-right() {
|
@mixin float-right() {
|
||||||
float: right !important;
|
float: right !important;
|
||||||
@include deprecate("The `float-right` mixin", "v4.3.0", "v5");
|
@include deprecate('The `float-right` mixin', 'v4.3.0', 'v5');
|
||||||
}
|
}
|
||||||
@mixin float-none() {
|
@mixin float-none() {
|
||||||
float: none !important;
|
float: none !important;
|
||||||
@include deprecate("The `float-none` mixin", "v4.3.0", "v5");
|
@include deprecate('The `float-none` mixin', 'v4.3.0', 'v5');
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -23,13 +23,13 @@
|
||||||
box-shadow: $input-focus-box-shadow;
|
box-shadow: $input-focus-box-shadow;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include deprecate("The `form-control-focus()` mixin", "v4.4.0", "v5", $ignore-warning);
|
@include deprecate('The `form-control-focus()` mixin', 'v4.4.0', 'v5', $ignore-warning);
|
||||||
}
|
}
|
||||||
|
|
||||||
// This mixin uses an `if()` technique to be compatible with Dart Sass
|
// This mixin uses an `if()` technique to be compatible with Dart Sass
|
||||||
// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details
|
// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details
|
||||||
@mixin form-validation-state-selector($state) {
|
@mixin form-validation-state-selector($state) {
|
||||||
@if ($state == "valid" or $state == "invalid") {
|
@if ($state == 'valid' or $state == 'invalid') {
|
||||||
.was-validated #{if(&, "&", "")}:#{$state},
|
.was-validated #{if(&, "&", "")}:#{$state},
|
||||||
#{if(&, "&", "")}.is-#{$state} {
|
#{if(&, "&", "")}.is-#{$state} {
|
||||||
@content;
|
@content;
|
||||||
|
|
@ -57,7 +57,7 @@
|
||||||
display: none;
|
display: none;
|
||||||
max-width: 100%; // Contain to parent when possible
|
max-width: 100%; // Contain to parent when possible
|
||||||
padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
|
padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
|
||||||
margin-top: .1rem;
|
margin-top: 0.1rem;
|
||||||
@include font-size($form-feedback-tooltip-font-size);
|
@include font-size($form-feedback-tooltip-font-size);
|
||||||
line-height: $form-feedback-tooltip-line-height;
|
line-height: $form-feedback-tooltip-line-height;
|
||||||
color: color-yiq($color);
|
color: color-yiq($color);
|
||||||
|
|
@ -86,7 +86,7 @@
|
||||||
|
|
||||||
&:focus {
|
&:focus {
|
||||||
border-color: $color;
|
border-color: $color;
|
||||||
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
|
box-shadow: 0 0 0 $input-focus-width rgba($color, 0.25);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -107,12 +107,17 @@
|
||||||
|
|
||||||
@if $enable-validation-icons {
|
@if $enable-validation-icons {
|
||||||
padding-right: $custom-select-feedback-icon-padding-right;
|
padding-right: $custom-select-feedback-icon-padding-right;
|
||||||
background: $custom-select-background, escape-svg($icon) $custom-select-bg no-repeat $custom-select-feedback-icon-position / $custom-select-feedback-icon-size;
|
background: $custom-select-background,
|
||||||
|
escape-svg($icon)
|
||||||
|
$custom-select-bg
|
||||||
|
no-repeat
|
||||||
|
$custom-select-feedback-icon-position /
|
||||||
|
$custom-select-feedback-icon-size;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus {
|
&:focus {
|
||||||
border-color: $color;
|
border-color: $color;
|
||||||
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
|
box-shadow: 0 0 0 $input-focus-width rgba($color, 0.25);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -149,7 +154,7 @@
|
||||||
|
|
||||||
&:focus {
|
&:focus {
|
||||||
~ .custom-control-label::before {
|
~ .custom-control-label::before {
|
||||||
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
|
box-shadow: 0 0 0 $input-focus-width rgba($color, 0.25);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not(:checked) ~ .custom-control-label::before {
|
&:not(:checked) ~ .custom-control-label::before {
|
||||||
|
|
@ -169,7 +174,7 @@
|
||||||
&:focus {
|
&:focus {
|
||||||
~ .custom-file-label {
|
~ .custom-file-label {
|
||||||
border-color: $color;
|
border-color: $color;
|
||||||
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
|
box-shadow: 0 0 0 $input-focus-width rgba($color, 0.25);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -40,6 +40,15 @@
|
||||||
background-image: radial-gradient(circle, $inner-color, $outer-color);
|
background-image: radial-gradient(circle, $inner-color, $outer-color);
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
@mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) {
|
@mixin gradient-striped($color: rgba($white, 0.15), $angle: 45deg) {
|
||||||
background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
|
background-image: linear-gradient(
|
||||||
|
$angle,
|
||||||
|
$color 25%,
|
||||||
|
transparent 25%,
|
||||||
|
transparent 50%,
|
||||||
|
$color 50%,
|
||||||
|
$color 75%,
|
||||||
|
transparent 75%,
|
||||||
|
transparent
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -50,17 +50,24 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.order#{$infix}-first { order: -1; }
|
.order#{$infix}-first {
|
||||||
|
order: -1;
|
||||||
|
}
|
||||||
|
|
||||||
.order#{$infix}-last { order: $columns + 1; }
|
.order#{$infix}-last {
|
||||||
|
order: $columns + 1;
|
||||||
|
}
|
||||||
|
|
||||||
@for $i from 0 through $columns {
|
@for $i from 0 through $columns {
|
||||||
.order#{$infix}-#{$i} { order: $i; }
|
.order#{$infix}-#{$i} {
|
||||||
|
order: $i;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// `$columns - 1` because offsetting by the width of an entire row isn't possible
|
// `$columns - 1` because offsetting by the width of an entire row isn't possible
|
||||||
@for $i from 0 through ($columns - 1) {
|
@for $i from 0 through ($columns - 1) {
|
||||||
@if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0
|
@if not($infix == '' and $i == 0) {
|
||||||
|
// Avoid emitting useless .offset-0
|
||||||
.offset#{$infix}-#{$i} {
|
.offset#{$infix}-#{$i} {
|
||||||
@include make-col-offset($i, $columns);
|
@include make-col-offset($i, $columns);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,6 @@
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// For each breakpoint, define the maximum width of the container in a media query
|
// For each breakpoint, define the maximum width of the container in a media query
|
||||||
@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
|
@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
|
||||||
@each $breakpoint, $container-max-width in $max-widths {
|
@each $breakpoint, $container-max-width in $max-widths {
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,9 @@
|
||||||
// Issue: https://github.com/twbs/bootstrap/issues/25195
|
// Issue: https://github.com/twbs/bootstrap/issues/25195
|
||||||
|
|
||||||
@mixin hover() {
|
@mixin hover() {
|
||||||
&:hover { @content; }
|
&:hover {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin hover-focus() {
|
@mixin hover-focus() {
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,6 @@
|
||||||
// - Responsive image
|
// - Responsive image
|
||||||
// - Retina image
|
// - Retina image
|
||||||
|
|
||||||
|
|
||||||
// Responsive image
|
// Responsive image
|
||||||
//
|
//
|
||||||
// Keep images from scaling beyond the width of their parents.
|
// Keep images from scaling beyond the width of their parents.
|
||||||
|
|
@ -15,7 +14,6 @@
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Retina image
|
// Retina image
|
||||||
//
|
//
|
||||||
// Short retina mixin for setting background-image and -size.
|
// Short retina mixin for setting background-image and -size.
|
||||||
|
|
@ -27,10 +25,11 @@
|
||||||
// but doesn't convert dppx=>dpi.
|
// but doesn't convert dppx=>dpi.
|
||||||
// There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
|
// There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
|
||||||
// Compatibility info: https://caniuse.com/#feat=css-media-resolution
|
// Compatibility info: https://caniuse.com/#feat=css-media-resolution
|
||||||
@media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
|
@media only screen and (min-resolution: 192dpi),
|
||||||
only screen and (min-resolution: 2dppx) { // Standardized
|
// IE9-11 don't support dppx only screen and (min-resolution: 2dppx) {
|
||||||
|
// Standardized
|
||||||
background-image: url($file-2x);
|
background-image: url($file-2x);
|
||||||
background-size: $width-1x $height-1x;
|
background-size: $width-1x $height-1x;
|
||||||
}
|
}
|
||||||
@include deprecate("`img-retina()`", "v4.3.0", "v5");
|
@include deprecate('`img-retina()`', 'v4.3.0', 'v5');
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -7,5 +7,5 @@
|
||||||
margin: $margin-y 0;
|
margin: $margin-y 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
border-top: 1px solid $color;
|
border-top: 1px solid $color;
|
||||||
@include deprecate("The `nav-divider()` mixin", "v4.4.0", "v5", $ignore-warning);
|
@include deprecate('The `nav-divider()` mixin', 'v4.4.0', 'v5', $ignore-warning);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -3,5 +3,5 @@
|
||||||
@mixin size($width, $height: $width) {
|
@mixin size($width, $height: $width) {
|
||||||
width: $width;
|
width: $width;
|
||||||
height: $height;
|
height: $height;
|
||||||
@include deprecate("`size()`", "v4.3.0", "v5");
|
@include deprecate('`size()`', 'v4.3.0', 'v5');
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -13,5 +13,5 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include deprecate("`text-emphasis-variant()`", "v4.4.0", "v5", $ignore-warning);
|
@include deprecate('`text-emphasis-variant()`', 'v4.4.0', 'v5', $ignore-warning);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -7,5 +7,5 @@
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border: 0;
|
border: 0;
|
||||||
|
|
||||||
@include deprecate("`text-hide()`", "v4.1.0", "v5", $ignore-warning);
|
@include deprecate('`text-hide()`', 'v4.1.0', 'v5', $ignore-warning);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,5 +4,5 @@
|
||||||
|
|
||||||
@mixin invisible($visibility) {
|
@mixin invisible($visibility) {
|
||||||
visibility: $visibility !important;
|
visibility: $visibility !important;
|
||||||
@include deprecate("`invisible()`", "v4.3.0", "v5");
|
@include deprecate('`invisible()`', 'v4.3.0', 'v5');
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,20 @@
|
||||||
// stylelint-disable declaration-no-important
|
// stylelint-disable declaration-no-important
|
||||||
|
|
||||||
.align-baseline { vertical-align: baseline !important; } // Browser default
|
.align-baseline {
|
||||||
.align-top { vertical-align: top !important; }
|
vertical-align: baseline !important;
|
||||||
.align-middle { vertical-align: middle !important; }
|
} // Browser default
|
||||||
.align-bottom { vertical-align: bottom !important; }
|
.align-top {
|
||||||
.align-text-bottom { vertical-align: text-bottom !important; }
|
vertical-align: top !important;
|
||||||
.align-text-top { vertical-align: text-top !important; }
|
}
|
||||||
|
.align-middle {
|
||||||
|
vertical-align: middle !important;
|
||||||
|
}
|
||||||
|
.align-bottom {
|
||||||
|
vertical-align: bottom !important;
|
||||||
|
}
|
||||||
|
.align-text-bottom {
|
||||||
|
vertical-align: text-bottom !important;
|
||||||
|
}
|
||||||
|
.align-text-top {
|
||||||
|
vertical-align: text-top !important;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,12 +1,12 @@
|
||||||
// stylelint-disable declaration-no-important
|
// stylelint-disable declaration-no-important
|
||||||
|
|
||||||
@each $color, $value in $theme-colors {
|
@each $color, $value in $theme-colors {
|
||||||
@include bg-variant(".bg-#{$color}", $value, true);
|
@include bg-variant('.bg-#{$color}', $value, true);
|
||||||
}
|
}
|
||||||
|
|
||||||
@if $enable-gradients {
|
@if $enable-gradients {
|
||||||
@each $color, $value in $theme-colors {
|
@each $color, $value in $theme-colors {
|
||||||
@include bg-gradient-variant(".bg-gradient-#{$color}", $value);
|
@include bg-gradient-variant('.bg-gradient-#{$color}', $value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -4,17 +4,37 @@
|
||||||
// Border
|
// Border
|
||||||
//
|
//
|
||||||
|
|
||||||
.border { border: $border-width solid $border-color !important; }
|
.border {
|
||||||
.border-top { border-top: $border-width solid $border-color !important; }
|
border: $border-width solid $border-color !important;
|
||||||
.border-right { border-right: $border-width solid $border-color !important; }
|
}
|
||||||
.border-bottom { border-bottom: $border-width solid $border-color !important; }
|
.border-top {
|
||||||
.border-left { border-left: $border-width solid $border-color !important; }
|
border-top: $border-width solid $border-color !important;
|
||||||
|
}
|
||||||
|
.border-right {
|
||||||
|
border-right: $border-width solid $border-color !important;
|
||||||
|
}
|
||||||
|
.border-bottom {
|
||||||
|
border-bottom: $border-width solid $border-color !important;
|
||||||
|
}
|
||||||
|
.border-left {
|
||||||
|
border-left: $border-width solid $border-color !important;
|
||||||
|
}
|
||||||
|
|
||||||
.border-0 { border: 0 !important; }
|
.border-0 {
|
||||||
.border-top-0 { border-top: 0 !important; }
|
border: 0 !important;
|
||||||
.border-right-0 { border-right: 0 !important; }
|
}
|
||||||
.border-bottom-0 { border-bottom: 0 !important; }
|
.border-top-0 {
|
||||||
.border-left-0 { border-left: 0 !important; }
|
border-top: 0 !important;
|
||||||
|
}
|
||||||
|
.border-right-0 {
|
||||||
|
border-right: 0 !important;
|
||||||
|
}
|
||||||
|
.border-bottom-0 {
|
||||||
|
border-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
.border-left-0 {
|
||||||
|
border-left: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
@each $color, $value in $theme-colors {
|
@each $color, $value in $theme-colors {
|
||||||
.border-#{$color} {
|
.border-#{$color} {
|
||||||
|
|
|
||||||
|
|
@ -9,18 +9,21 @@
|
||||||
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
||||||
|
|
||||||
@each $value in $displays {
|
@each $value in $displays {
|
||||||
.d#{$infix}-#{$value} { display: $value !important; }
|
.d#{$infix}-#{$value} {
|
||||||
|
display: $value !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Utilities for toggling `display` in print
|
// Utilities for toggling `display` in print
|
||||||
//
|
//
|
||||||
|
|
||||||
@media print {
|
@media print {
|
||||||
@each $value in $displays {
|
@each $value in $displays {
|
||||||
.d-print-#{$value} { display: $value !important; }
|
.d-print-#{$value} {
|
||||||
|
display: $value !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
display: block;
|
display: block;
|
||||||
content: "";
|
content: '';
|
||||||
}
|
}
|
||||||
|
|
||||||
.embed-responsive-item,
|
.embed-responsive-item,
|
||||||
|
|
|
||||||
|
|
@ -8,44 +8,112 @@
|
||||||
@include media-breakpoint-up($breakpoint) {
|
@include media-breakpoint-up($breakpoint) {
|
||||||
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
||||||
|
|
||||||
.flex#{$infix}-row { flex-direction: row !important; }
|
.flex#{$infix}-row {
|
||||||
.flex#{$infix}-column { flex-direction: column !important; }
|
flex-direction: row !important;
|
||||||
.flex#{$infix}-row-reverse { flex-direction: row-reverse !important; }
|
}
|
||||||
.flex#{$infix}-column-reverse { flex-direction: column-reverse !important; }
|
.flex#{$infix}-column {
|
||||||
|
flex-direction: column !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-row-reverse {
|
||||||
|
flex-direction: row-reverse !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-column-reverse {
|
||||||
|
flex-direction: column-reverse !important;
|
||||||
|
}
|
||||||
|
|
||||||
.flex#{$infix}-wrap { flex-wrap: wrap !important; }
|
.flex#{$infix}-wrap {
|
||||||
.flex#{$infix}-nowrap { flex-wrap: nowrap !important; }
|
flex-wrap: wrap !important;
|
||||||
.flex#{$infix}-wrap-reverse { flex-wrap: wrap-reverse !important; }
|
}
|
||||||
.flex#{$infix}-fill { flex: 1 1 auto !important; }
|
.flex#{$infix}-nowrap {
|
||||||
.flex#{$infix}-grow-0 { flex-grow: 0 !important; }
|
flex-wrap: nowrap !important;
|
||||||
.flex#{$infix}-grow-1 { flex-grow: 1 !important; }
|
}
|
||||||
.flex#{$infix}-shrink-0 { flex-shrink: 0 !important; }
|
.flex#{$infix}-wrap-reverse {
|
||||||
.flex#{$infix}-shrink-1 { flex-shrink: 1 !important; }
|
flex-wrap: wrap-reverse !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-fill {
|
||||||
|
flex: 1 1 auto !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-grow-0 {
|
||||||
|
flex-grow: 0 !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-grow-1 {
|
||||||
|
flex-grow: 1 !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-shrink-0 {
|
||||||
|
flex-shrink: 0 !important;
|
||||||
|
}
|
||||||
|
.flex#{$infix}-shrink-1 {
|
||||||
|
flex-shrink: 1 !important;
|
||||||
|
}
|
||||||
|
|
||||||
.justify-content#{$infix}-start { justify-content: flex-start !important; }
|
.justify-content#{$infix}-start {
|
||||||
.justify-content#{$infix}-end { justify-content: flex-end !important; }
|
justify-content: flex-start !important;
|
||||||
.justify-content#{$infix}-center { justify-content: center !important; }
|
}
|
||||||
.justify-content#{$infix}-between { justify-content: space-between !important; }
|
.justify-content#{$infix}-end {
|
||||||
.justify-content#{$infix}-around { justify-content: space-around !important; }
|
justify-content: flex-end !important;
|
||||||
|
}
|
||||||
|
.justify-content#{$infix}-center {
|
||||||
|
justify-content: center !important;
|
||||||
|
}
|
||||||
|
.justify-content#{$infix}-between {
|
||||||
|
justify-content: space-between !important;
|
||||||
|
}
|
||||||
|
.justify-content#{$infix}-around {
|
||||||
|
justify-content: space-around !important;
|
||||||
|
}
|
||||||
|
|
||||||
.align-items#{$infix}-start { align-items: flex-start !important; }
|
.align-items#{$infix}-start {
|
||||||
.align-items#{$infix}-end { align-items: flex-end !important; }
|
align-items: flex-start !important;
|
||||||
.align-items#{$infix}-center { align-items: center !important; }
|
}
|
||||||
.align-items#{$infix}-baseline { align-items: baseline !important; }
|
.align-items#{$infix}-end {
|
||||||
.align-items#{$infix}-stretch { align-items: stretch !important; }
|
align-items: flex-end !important;
|
||||||
|
}
|
||||||
|
.align-items#{$infix}-center {
|
||||||
|
align-items: center !important;
|
||||||
|
}
|
||||||
|
.align-items#{$infix}-baseline {
|
||||||
|
align-items: baseline !important;
|
||||||
|
}
|
||||||
|
.align-items#{$infix}-stretch {
|
||||||
|
align-items: stretch !important;
|
||||||
|
}
|
||||||
|
|
||||||
.align-content#{$infix}-start { align-content: flex-start !important; }
|
.align-content#{$infix}-start {
|
||||||
.align-content#{$infix}-end { align-content: flex-end !important; }
|
align-content: flex-start !important;
|
||||||
.align-content#{$infix}-center { align-content: center !important; }
|
}
|
||||||
.align-content#{$infix}-between { align-content: space-between !important; }
|
.align-content#{$infix}-end {
|
||||||
.align-content#{$infix}-around { align-content: space-around !important; }
|
align-content: flex-end !important;
|
||||||
.align-content#{$infix}-stretch { align-content: stretch !important; }
|
}
|
||||||
|
.align-content#{$infix}-center {
|
||||||
|
align-content: center !important;
|
||||||
|
}
|
||||||
|
.align-content#{$infix}-between {
|
||||||
|
align-content: space-between !important;
|
||||||
|
}
|
||||||
|
.align-content#{$infix}-around {
|
||||||
|
align-content: space-around !important;
|
||||||
|
}
|
||||||
|
.align-content#{$infix}-stretch {
|
||||||
|
align-content: stretch !important;
|
||||||
|
}
|
||||||
|
|
||||||
.align-self#{$infix}-auto { align-self: auto !important; }
|
.align-self#{$infix}-auto {
|
||||||
.align-self#{$infix}-start { align-self: flex-start !important; }
|
align-self: auto !important;
|
||||||
.align-self#{$infix}-end { align-self: flex-end !important; }
|
}
|
||||||
.align-self#{$infix}-center { align-self: center !important; }
|
.align-self#{$infix}-start {
|
||||||
.align-self#{$infix}-baseline { align-self: baseline !important; }
|
align-self: flex-start !important;
|
||||||
.align-self#{$infix}-stretch { align-self: stretch !important; }
|
}
|
||||||
|
.align-self#{$infix}-end {
|
||||||
|
align-self: flex-end !important;
|
||||||
|
}
|
||||||
|
.align-self#{$infix}-center {
|
||||||
|
align-self: center !important;
|
||||||
|
}
|
||||||
|
.align-self#{$infix}-baseline {
|
||||||
|
align-self: baseline !important;
|
||||||
|
}
|
||||||
|
.align-self#{$infix}-stretch {
|
||||||
|
align-self: stretch !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,8 +4,14 @@
|
||||||
@include media-breakpoint-up($breakpoint) {
|
@include media-breakpoint-up($breakpoint) {
|
||||||
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
||||||
|
|
||||||
.float#{$infix}-left { float: left !important; }
|
.float#{$infix}-left {
|
||||||
.float#{$infix}-right { float: right !important; }
|
float: left !important;
|
||||||
.float#{$infix}-none { float: none !important; }
|
}
|
||||||
|
.float#{$infix}-right {
|
||||||
|
float: right !important;
|
||||||
|
}
|
||||||
|
.float#{$infix}-none {
|
||||||
|
float: none !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,7 @@
|
||||||
// stylelint-disable declaration-no-important
|
// stylelint-disable declaration-no-important
|
||||||
|
|
||||||
@each $value in $overflows {
|
@each $value in $overflows {
|
||||||
.overflow-#{$value} { overflow: $value !important; }
|
.overflow-#{$value} {
|
||||||
|
overflow: $value !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,9 @@
|
||||||
|
|
||||||
// Common values
|
// Common values
|
||||||
@each $position in $positions {
|
@each $position in $positions {
|
||||||
.position-#{$position} { position: $position !important; }
|
.position-#{$position} {
|
||||||
|
position: $position !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Shorthand
|
// Shorthand
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,14 @@
|
||||||
// stylelint-disable declaration-no-important
|
// stylelint-disable declaration-no-important
|
||||||
|
|
||||||
.shadow-sm { box-shadow: $box-shadow-sm !important; }
|
.shadow-sm {
|
||||||
.shadow { box-shadow: $box-shadow !important; }
|
box-shadow: $box-shadow-sm !important;
|
||||||
.shadow-lg { box-shadow: $box-shadow-lg !important; }
|
}
|
||||||
.shadow-none { box-shadow: none !important; }
|
.shadow {
|
||||||
|
box-shadow: $box-shadow !important;
|
||||||
|
}
|
||||||
|
.shadow-lg {
|
||||||
|
box-shadow: $box-shadow-lg !important;
|
||||||
|
}
|
||||||
|
.shadow-none {
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,17 +4,31 @@
|
||||||
|
|
||||||
@each $prop, $abbrev in (width: w, height: h) {
|
@each $prop, $abbrev in (width: w, height: h) {
|
||||||
@each $size, $length in $sizes {
|
@each $size, $length in $sizes {
|
||||||
.#{$abbrev}-#{$size} { #{$prop}: $length !important; }
|
.#{$abbrev}-#{$size} {
|
||||||
|
#{$prop}: $length !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-100 { max-width: 100% !important; }
|
.mw-100 {
|
||||||
.mh-100 { max-height: 100% !important; }
|
max-width: 100% !important;
|
||||||
|
}
|
||||||
|
.mh-100 {
|
||||||
|
max-height: 100% !important;
|
||||||
|
}
|
||||||
|
|
||||||
// Viewport additional helpers
|
// Viewport additional helpers
|
||||||
|
|
||||||
.min-vw-100 { min-width: 100vw !important; }
|
.min-vw-100 {
|
||||||
.min-vh-100 { min-height: 100vh !important; }
|
min-width: 100vw !important;
|
||||||
|
}
|
||||||
|
.min-vh-100 {
|
||||||
|
min-height: 100vh !important;
|
||||||
|
}
|
||||||
|
|
||||||
.vw-100 { width: 100vw !important; }
|
.vw-100 {
|
||||||
.vh-100 { height: 100vh !important; }
|
width: 100vw !important;
|
||||||
|
}
|
||||||
|
.vh-100 {
|
||||||
|
height: 100vh !important;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,9 @@
|
||||||
|
|
||||||
@each $prop, $abbrev in (margin: m, padding: p) {
|
@each $prop, $abbrev in (margin: m, padding: p) {
|
||||||
@each $size, $length in $spacers {
|
@each $size, $length in $spacers {
|
||||||
.#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length !important; }
|
.#{$abbrev}#{$infix}-#{$size} {
|
||||||
|
#{$prop}: $length !important;
|
||||||
|
}
|
||||||
.#{$abbrev}t#{$infix}-#{$size},
|
.#{$abbrev}t#{$infix}-#{$size},
|
||||||
.#{$abbrev}y#{$infix}-#{$size} {
|
.#{$abbrev}y#{$infix}-#{$size} {
|
||||||
#{$prop}-top: $length !important;
|
#{$prop}-top: $length !important;
|
||||||
|
|
@ -31,7 +33,9 @@
|
||||||
// Negative margins (e.g., where `.mb-n1` is negative version of `.mb-1`)
|
// Negative margins (e.g., where `.mb-n1` is negative version of `.mb-1`)
|
||||||
@each $size, $length in $spacers {
|
@each $size, $length in $spacers {
|
||||||
@if $size != 0 {
|
@if $size != 0 {
|
||||||
.m#{$infix}-n#{$size} { margin: -$length !important; }
|
.m#{$infix}-n#{$size} {
|
||||||
|
margin: -$length !important;
|
||||||
|
}
|
||||||
.mt#{$infix}-n#{$size},
|
.mt#{$infix}-n#{$size},
|
||||||
.my#{$infix}-n#{$size} {
|
.my#{$infix}-n#{$size} {
|
||||||
margin-top: -$length !important;
|
margin-top: -$length !important;
|
||||||
|
|
@ -52,7 +56,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
// Some special margin utils
|
// Some special margin utils
|
||||||
.m#{$infix}-auto { margin: auto !important; }
|
.m#{$infix}-auto {
|
||||||
|
margin: auto !important;
|
||||||
|
}
|
||||||
.mt#{$infix}-auto,
|
.mt#{$infix}-auto,
|
||||||
.my#{$infix}-auto {
|
.my#{$infix}-auto {
|
||||||
margin-top: auto !important;
|
margin-top: auto !important;
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
// Just in case `pointer-events: none` is set on a parent
|
// Just in case `pointer-events: none` is set on a parent
|
||||||
pointer-events: auto;
|
pointer-events: auto;
|
||||||
content: "";
|
content: '';
|
||||||
// IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color
|
// IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color
|
||||||
background-color: rgba(0, 0, 0, 0);
|
background-color: rgba(0, 0, 0, 0);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -4,14 +4,24 @@
|
||||||
// Text
|
// Text
|
||||||
//
|
//
|
||||||
|
|
||||||
.text-monospace { font-family: $font-family-monospace !important; }
|
.text-monospace {
|
||||||
|
font-family: $font-family-monospace !important;
|
||||||
|
}
|
||||||
|
|
||||||
// Alignment
|
// Alignment
|
||||||
|
|
||||||
.text-justify { text-align: justify !important; }
|
.text-justify {
|
||||||
.text-wrap { white-space: normal !important; }
|
text-align: justify !important;
|
||||||
.text-nowrap { white-space: nowrap !important; }
|
}
|
||||||
.text-truncate { @include text-truncate(); }
|
.text-wrap {
|
||||||
|
white-space: normal !important;
|
||||||
|
}
|
||||||
|
.text-nowrap {
|
||||||
|
white-space: nowrap !important;
|
||||||
|
}
|
||||||
|
.text-truncate {
|
||||||
|
@include text-truncate();
|
||||||
|
}
|
||||||
|
|
||||||
// Responsive alignment
|
// Responsive alignment
|
||||||
|
|
||||||
|
|
@ -19,40 +29,74 @@
|
||||||
@include media-breakpoint-up($breakpoint) {
|
@include media-breakpoint-up($breakpoint) {
|
||||||
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
||||||
|
|
||||||
.text#{$infix}-left { text-align: left !important; }
|
.text#{$infix}-left {
|
||||||
.text#{$infix}-right { text-align: right !important; }
|
text-align: left !important;
|
||||||
.text#{$infix}-center { text-align: center !important; }
|
}
|
||||||
|
.text#{$infix}-right {
|
||||||
|
text-align: right !important;
|
||||||
|
}
|
||||||
|
.text#{$infix}-center {
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Transformation
|
// Transformation
|
||||||
|
|
||||||
.text-lowercase { text-transform: lowercase !important; }
|
.text-lowercase {
|
||||||
.text-uppercase { text-transform: uppercase !important; }
|
text-transform: lowercase !important;
|
||||||
.text-capitalize { text-transform: capitalize !important; }
|
}
|
||||||
|
.text-uppercase {
|
||||||
|
text-transform: uppercase !important;
|
||||||
|
}
|
||||||
|
.text-capitalize {
|
||||||
|
text-transform: capitalize !important;
|
||||||
|
}
|
||||||
|
|
||||||
// Weight and italics
|
// Weight and italics
|
||||||
|
|
||||||
.font-weight-light { font-weight: $font-weight-light !important; }
|
.font-weight-light {
|
||||||
.font-weight-lighter { font-weight: $font-weight-lighter !important; }
|
font-weight: $font-weight-light !important;
|
||||||
.font-weight-normal { font-weight: $font-weight-normal !important; }
|
}
|
||||||
.font-weight-bold { font-weight: $font-weight-bold !important; }
|
.font-weight-lighter {
|
||||||
.font-weight-bolder { font-weight: $font-weight-bolder !important; }
|
font-weight: $font-weight-lighter !important;
|
||||||
.font-italic { font-style: italic !important; }
|
}
|
||||||
|
.font-weight-normal {
|
||||||
|
font-weight: $font-weight-normal !important;
|
||||||
|
}
|
||||||
|
.font-weight-bold {
|
||||||
|
font-weight: $font-weight-bold !important;
|
||||||
|
}
|
||||||
|
.font-weight-bolder {
|
||||||
|
font-weight: $font-weight-bolder !important;
|
||||||
|
}
|
||||||
|
.font-italic {
|
||||||
|
font-style: italic !important;
|
||||||
|
}
|
||||||
|
|
||||||
// Contextual colors
|
// Contextual colors
|
||||||
|
|
||||||
.text-white { color: $white !important; }
|
.text-white {
|
||||||
|
color: $white !important;
|
||||||
@each $color, $value in $theme-colors {
|
|
||||||
@include text-emphasis-variant(".text-#{$color}", $value, true);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-body { color: $body-color !important; }
|
@each $color, $value in $theme-colors {
|
||||||
.text-muted { color: $text-muted !important; }
|
@include text-emphasis-variant('.text-#{$color}', $value, true);
|
||||||
|
}
|
||||||
|
|
||||||
.text-black-50 { color: rgba($black, .5) !important; }
|
.text-body {
|
||||||
.text-white-50 { color: rgba($white, .5) !important; }
|
color: $body-color !important;
|
||||||
|
}
|
||||||
|
.text-muted {
|
||||||
|
color: $text-muted !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-black-50 {
|
||||||
|
color: rgba($black, 0.5) !important;
|
||||||
|
}
|
||||||
|
.text-white-50 {
|
||||||
|
color: rgba($white, 0.5) !important;
|
||||||
|
}
|
||||||
|
|
||||||
// Misc
|
// Misc
|
||||||
|
|
||||||
|
|
@ -60,7 +104,9 @@
|
||||||
@include text-hide($ignore-warning: true);
|
@include text-hide($ignore-warning: true);
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-decoration-none { text-decoration: none !important; }
|
.text-decoration-none {
|
||||||
|
text-decoration: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
.text-break {
|
.text-break {
|
||||||
word-break: break-word !important; // IE & < Edge 18
|
word-break: break-word !important; // IE & < Edge 18
|
||||||
|
|
@ -69,4 +115,6 @@
|
||||||
|
|
||||||
// Reset
|
// Reset
|
||||||
|
|
||||||
.text-reset { color: inherit !important; }
|
.text-reset {
|
||||||
|
color: inherit !important;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -9,27 +9,25 @@
|
||||||
* 3. This window proceeds to send the current presentation state
|
* 3. This window proceeds to send the current presentation state
|
||||||
* to the notes window
|
* to the notes window
|
||||||
*/
|
*/
|
||||||
var RevealNotes = (function() {
|
var RevealNotes = (function () {
|
||||||
|
|
||||||
var notesPopup = null;
|
var notesPopup = null;
|
||||||
|
|
||||||
function openNotes( notesFilePath ) {
|
function openNotes(notesFilePath) {
|
||||||
|
|
||||||
if (notesPopup && !notesPopup.closed) {
|
if (notesPopup && !notesPopup.closed) {
|
||||||
notesPopup.focus();
|
notesPopup.focus();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if( !notesFilePath ) {
|
if (!notesFilePath) {
|
||||||
var jsFileLocation = document.querySelector('script[src$="notes.js"]').src; // this js file path
|
var jsFileLocation = document.querySelector('script[src$="notes.js"]').src; // this js file path
|
||||||
jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, ''); // the js folder path
|
jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, ''); // the js folder path
|
||||||
notesFilePath = jsFileLocation + 'notes.html';
|
notesFilePath = jsFileLocation + 'notes.html';
|
||||||
}
|
}
|
||||||
|
|
||||||
notesPopup = window.open( notesFilePath, 'reveal.js - Notes', 'width=1100,height=700' );
|
notesPopup = window.open(notesFilePath, 'reveal.js - Notes', 'width=1100,height=700');
|
||||||
|
|
||||||
if( !notesPopup ) {
|
if (!notesPopup) {
|
||||||
alert( 'Speaker view popup failed to open. Please make sure popups are allowed and reopen the speaker view.' );
|
alert('Speaker view popup failed to open. Please make sure popups are allowed and reopen the speaker view.');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -41,51 +39,59 @@ var RevealNotes = (function() {
|
||||||
*/
|
*/
|
||||||
function connect() {
|
function connect() {
|
||||||
// Keep trying to connect until we get a 'connected' message back
|
// Keep trying to connect until we get a 'connected' message back
|
||||||
var connectInterval = setInterval( function() {
|
var connectInterval = setInterval(function () {
|
||||||
notesPopup.postMessage( JSON.stringify( {
|
notesPopup.postMessage(
|
||||||
|
JSON.stringify({
|
||||||
namespace: 'reveal-notes',
|
namespace: 'reveal-notes',
|
||||||
type: 'connect',
|
type: 'connect',
|
||||||
url: window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search,
|
url:
|
||||||
state: Reveal.getState()
|
window.location.protocol +
|
||||||
} ), '*' );
|
'//' +
|
||||||
}, 500 );
|
window.location.host +
|
||||||
|
window.location.pathname +
|
||||||
|
window.location.search,
|
||||||
|
state: Reveal.getState(),
|
||||||
|
}),
|
||||||
|
'*',
|
||||||
|
);
|
||||||
|
}, 500);
|
||||||
|
|
||||||
window.addEventListener( 'message', function( event ) {
|
window.addEventListener('message', function (event) {
|
||||||
var data = JSON.parse( event.data );
|
var data = JSON.parse(event.data);
|
||||||
if( data && data.namespace === 'reveal-notes' && data.type === 'connected' ) {
|
if (data && data.namespace === 'reveal-notes' && data.type === 'connected') {
|
||||||
clearInterval( connectInterval );
|
clearInterval(connectInterval);
|
||||||
onConnected();
|
onConnected();
|
||||||
}
|
}
|
||||||
if( data && data.namespace === 'reveal-notes' && data.type === 'call' ) {
|
if (data && data.namespace === 'reveal-notes' && data.type === 'call') {
|
||||||
callRevealApi( data.methodName, data.arguments, data.callId );
|
callRevealApi(data.methodName, data.arguments, data.callId);
|
||||||
}
|
}
|
||||||
} );
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Calls the specified Reveal.js method with the provided argument
|
* Calls the specified Reveal.js method with the provided argument
|
||||||
* and then pushes the result to the notes frame.
|
* and then pushes the result to the notes frame.
|
||||||
*/
|
*/
|
||||||
function callRevealApi( methodName, methodArguments, callId ) {
|
function callRevealApi(methodName, methodArguments, callId) {
|
||||||
|
var result = Reveal[methodName].apply(Reveal, methodArguments);
|
||||||
var result = Reveal[methodName].apply( Reveal, methodArguments );
|
notesPopup.postMessage(
|
||||||
notesPopup.postMessage( JSON.stringify( {
|
JSON.stringify({
|
||||||
namespace: 'reveal-notes',
|
namespace: 'reveal-notes',
|
||||||
type: 'return',
|
type: 'return',
|
||||||
result: result,
|
result: result,
|
||||||
callId: callId
|
callId: callId,
|
||||||
} ), '*' );
|
}),
|
||||||
|
'*',
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Posts the current slide data to the notes window
|
* Posts the current slide data to the notes window
|
||||||
*/
|
*/
|
||||||
function post( event ) {
|
function post(event) {
|
||||||
|
|
||||||
var slideElement = Reveal.getCurrentSlide(),
|
var slideElement = Reveal.getCurrentSlide(),
|
||||||
notesElement = slideElement.querySelector( 'aside.notes' ),
|
notesElement = slideElement.querySelector('aside.notes'),
|
||||||
fragmentElement = slideElement.querySelector( '.current-fragment' );
|
fragmentElement = slideElement.querySelector('.current-fragment');
|
||||||
|
|
||||||
var messageData = {
|
var messageData = {
|
||||||
namespace: 'reveal-notes',
|
namespace: 'reveal-notes',
|
||||||
|
|
@ -93,23 +99,22 @@ var RevealNotes = (function() {
|
||||||
notes: '',
|
notes: '',
|
||||||
markdown: false,
|
markdown: false,
|
||||||
whitespace: 'normal',
|
whitespace: 'normal',
|
||||||
state: Reveal.getState()
|
state: Reveal.getState(),
|
||||||
};
|
};
|
||||||
|
|
||||||
// Look for notes defined in a slide attribute
|
// Look for notes defined in a slide attribute
|
||||||
if( slideElement.hasAttribute( 'data-notes' ) ) {
|
if (slideElement.hasAttribute('data-notes')) {
|
||||||
messageData.notes = slideElement.getAttribute( 'data-notes' );
|
messageData.notes = slideElement.getAttribute('data-notes');
|
||||||
messageData.whitespace = 'pre-wrap';
|
messageData.whitespace = 'pre-wrap';
|
||||||
}
|
}
|
||||||
|
|
||||||
// Look for notes defined in a fragment
|
// Look for notes defined in a fragment
|
||||||
if( fragmentElement ) {
|
if (fragmentElement) {
|
||||||
var fragmentNotes = fragmentElement.querySelector( 'aside.notes' );
|
var fragmentNotes = fragmentElement.querySelector('aside.notes');
|
||||||
if( fragmentNotes ) {
|
if (fragmentNotes) {
|
||||||
notesElement = fragmentNotes;
|
notesElement = fragmentNotes;
|
||||||
}
|
} else if (fragmentElement.hasAttribute('data-notes')) {
|
||||||
else if( fragmentElement.hasAttribute( 'data-notes' ) ) {
|
messageData.notes = fragmentElement.getAttribute('data-notes');
|
||||||
messageData.notes = fragmentElement.getAttribute( 'data-notes' );
|
|
||||||
messageData.whitespace = 'pre-wrap';
|
messageData.whitespace = 'pre-wrap';
|
||||||
|
|
||||||
// In case there are slide notes
|
// In case there are slide notes
|
||||||
|
|
@ -118,13 +123,12 @@ var RevealNotes = (function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Look for notes defined in an aside element
|
// Look for notes defined in an aside element
|
||||||
if( notesElement ) {
|
if (notesElement) {
|
||||||
messageData.notes = notesElement.innerHTML;
|
messageData.notes = notesElement.innerHTML;
|
||||||
messageData.markdown = typeof notesElement.getAttribute( 'data-markdown' ) === 'string';
|
messageData.markdown = typeof notesElement.getAttribute('data-markdown') === 'string';
|
||||||
}
|
}
|
||||||
|
|
||||||
notesPopup.postMessage( JSON.stringify( messageData ), '*' );
|
notesPopup.postMessage(JSON.stringify(messageData), '*');
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -132,47 +136,39 @@ var RevealNotes = (function() {
|
||||||
* window.
|
* window.
|
||||||
*/
|
*/
|
||||||
function onConnected() {
|
function onConnected() {
|
||||||
|
|
||||||
// Monitor events that trigger a change in state
|
// Monitor events that trigger a change in state
|
||||||
Reveal.addEventListener( 'slidechanged', post );
|
Reveal.addEventListener('slidechanged', post);
|
||||||
Reveal.addEventListener( 'fragmentshown', post );
|
Reveal.addEventListener('fragmentshown', post);
|
||||||
Reveal.addEventListener( 'fragmenthidden', post );
|
Reveal.addEventListener('fragmenthidden', post);
|
||||||
Reveal.addEventListener( 'overviewhidden', post );
|
Reveal.addEventListener('overviewhidden', post);
|
||||||
Reveal.addEventListener( 'overviewshown', post );
|
Reveal.addEventListener('overviewshown', post);
|
||||||
Reveal.addEventListener( 'paused', post );
|
Reveal.addEventListener('paused', post);
|
||||||
Reveal.addEventListener( 'resumed', post );
|
Reveal.addEventListener('resumed', post);
|
||||||
|
|
||||||
// Post the initial state
|
// Post the initial state
|
||||||
post();
|
post();
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
connect();
|
connect();
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
init: function() {
|
init: function () {
|
||||||
|
if (!/receiver/i.test(window.location.search)) {
|
||||||
if( !/receiver/i.test( window.location.search ) ) {
|
|
||||||
|
|
||||||
// If the there's a 'notes' query set, open directly
|
// If the there's a 'notes' query set, open directly
|
||||||
if( window.location.search.match( /(\?|\&)notes/gi ) !== null ) {
|
if (window.location.search.match(/(\?|\&)notes/gi) !== null) {
|
||||||
openNotes();
|
openNotes();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Open the notes when the 's' key is hit
|
// Open the notes when the 's' key is hit
|
||||||
Reveal.addKeyBinding({keyCode: 83, key: 'S', description: 'Speaker notes view'}, function() {
|
Reveal.addKeyBinding({keyCode: 83, key: 'S', description: 'Speaker notes view'}, function () {
|
||||||
openNotes();
|
openNotes();
|
||||||
} );
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
open: openNotes
|
open: openNotes,
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|
||||||
Reveal.registerPlugin( 'notes', RevealNotes );
|
Reveal.registerPlugin('notes', RevealNotes);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue