tabs on admin dashboard

This commit is contained in:
2019-03-07 00:39:55 -06:00
parent 23529e4256
commit 835913972d
12216 changed files with 26929 additions and 204086 deletions

View File

@@ -2,11 +2,16 @@
color: color-yiq($bg);
background-color: $bg;
&[href] {
@at-root a#{&} {
@include hover-focus {
color: color-yiq($bg);
text-decoration: none;
background-color: darken($bg, 10%);
}
&:focus,
&.focus {
outline: 0;
box-shadow: 0 0 0 $badge-focus-width rgba($bg, .5);
}
}
}

View File

@@ -1,9 +1,13 @@
// stylelint-disable property-blacklist
// Single side border-radius
@mixin border-radius($radius: $border-radius) {
@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
@if $enable-rounded {
border-radius: $radius;
}
@else if $fallback-border-radius != false {
border-radius: $fallback-border-radius;
}
}
@mixin border-top-radius($radius) {
@@ -33,3 +37,27 @@
border-bottom-left-radius: $radius;
}
}
@mixin border-top-left-radius($radius) {
@if $enable-rounded {
border-top-left-radius: $radius;
}
}
@mixin border-top-right-radius($radius) {
@if $enable-rounded {
border-top-right-radius: $radius;
}
}
@mixin border-bottom-right-radius($radius) {
@if $enable-rounded {
border-bottom-right-radius: $radius;
}
}
@mixin border-bottom-left-radius($radius) {
@if $enable-rounded {
border-bottom-left-radius: $radius;
}
}

View File

@@ -1,5 +1,20 @@
@mixin box-shadow($shadow...) {
@if $enable-shadows {
box-shadow: $shadow;
$result: ();
@if (length($shadow) == 1) {
// We can pass `@include box-shadow(none);`
$result: $shadow;
} @else {
// Filter to avoid invalid properties for example `box-shadow: none, 1px 1px black;`
@for $i from 1 through length($shadow) {
@if nth($shadow, $i) != "none" {
$result: append($result, nth($shadow, $i), "comma");
}
}
}
@if (length($result) > 0) {
box-shadow: $result;
}
}
}

View File

@@ -16,7 +16,7 @@
// md
@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
$n: index($breakpoint-names, $name);
@return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
@return if($n != null and $n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
}
// Minimum breakpoint width. Null for the smallest (first) breakpoint.
@@ -39,7 +39,7 @@
// 767.98px
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
$next: breakpoint-next($name, $breakpoints);
@return if($next, breakpoint-min($next, $breakpoints) - .02px, null);
@return if($next, breakpoint-min($next, $breakpoints) - .02, null);
}
// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.

View File

@@ -19,9 +19,9 @@
&.focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows {
box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba($border, .5);
box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
} @else {
box-shadow: 0 0 0 $btn-focus-width rgba($border, .5);
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
}
}
@@ -31,6 +31,10 @@
color: color-yiq($background);
background-color: $background;
border-color: $border;
// Remove CSS gradients if they're enabled
@if $enable-gradients {
background-image: none;
}
}
&:not(:disabled):not(.disabled):active,
@@ -45,10 +49,10 @@
&:focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows {
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($border, .5);
@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);
} @else {
box-shadow: 0 0 0 $btn-focus-width rgba($border, .5);
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
}
}
}
@@ -56,11 +60,9 @@
@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) {
color: $color;
background-color: transparent;
background-image: none;
border-color: $color;
&:hover {
@include hover {
color: $color-hover;
background-color: $active-background;
border-color: $active-border;
@@ -98,12 +100,8 @@
// Button sizes
@mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
padding: $padding-y $padding-x;
font-size: $font-size;
@include font-size($font-size);
line-height: $line-height;
// Manually declare to provide an override to the browser default
@if $enable-rounded {
border-radius: $border-radius;
} @else {
border-radius: 0;
}
@include border-radius($border-radius, 0);
}

View File

@@ -29,10 +29,8 @@
@if $enable-caret {
&::after {
display: inline-block;
width: 0;
height: 0;
margin-left: $caret-width * .85;
vertical-align: $caret-width * .85;
margin-left: $caret-spacing;
vertical-align: $caret-vertical-align;
content: "";
@if $direction == down {
@include caret-down;
@@ -50,10 +48,8 @@
&::before {
display: inline-block;
width: 0;
height: 0;
margin-right: $caret-width * .85;
vertical-align: $caret-width * .85;
margin-right: $caret-spacing;
vertical-align: $caret-vertical-align;
content: "";
@include caret-left;
}

View File

@@ -2,10 +2,13 @@
@mixin float-left {
float: left !important;
@include deprecate("The `float-left` mixin", "v4.3.0", "v5");
}
@mixin float-right {
float: right !important;
@include deprecate("The `float-right` mixin", "v4.3.0", "v5");
}
@mixin float-none {
float: none !important;
@include deprecate("The `float-none` mixin", "v4.3.0", "v5");
}

View File

@@ -26,12 +26,12 @@
}
@mixin form-validation-state($state, $color) {
@mixin form-validation-state($state, $color, $icon) {
.#{$state}-feedback {
display: none;
width: 100%;
margin-top: $form-feedback-margin-top;
font-size: $form-feedback-font-size;
@include font-size($form-feedback-font-size);
color: $color;
}
@@ -41,21 +41,28 @@
z-index: 5;
display: none;
max-width: 100%; // Contain to parent when possible
padding: $tooltip-padding-y $tooltip-padding-x;
padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
margin-top: .1rem;
font-size: $tooltip-font-size;
line-height: $line-height-base;
@include font-size($form-feedback-tooltip-font-size);
line-height: $form-feedback-tooltip-line-height;
color: color-yiq($color);
background-color: rgba($color, $tooltip-opacity);
@include border-radius($tooltip-border-radius);
background-color: rgba($color, $form-feedback-tooltip-opacity);
@include border-radius($form-feedback-tooltip-border-radius);
}
.form-control,
.custom-select {
.form-control {
.was-validated &:#{$state},
&.is-#{$state} {
border-color: $color;
@if $enable-validation-icons {
padding-right: $input-height-inner;
background-image: $icon;
background-repeat: no-repeat;
background-position: center right $input-height-inner-quarter;
background-size: $input-height-inner-half $input-height-inner-half;
}
&:focus {
border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
@@ -68,6 +75,40 @@
}
}
// stylelint-disable-next-line selector-no-qualifying-type
textarea.form-control {
.was-validated &:#{$state},
&.is-#{$state} {
@if $enable-validation-icons {
padding-right: $input-height-inner;
background-position: top $input-height-inner-quarter right $input-height-inner-quarter;
}
}
}
.custom-select {
.was-validated &:#{$state},
&.is-#{$state} {
border-color: $color;
@if $enable-validation-icons {
padding-right: $custom-select-feedback-icon-padding-right;
background: $custom-select-background, $icon $custom-select-bg no-repeat $custom-select-feedback-icon-position / $custom-select-feedback-icon-size;
}
&:focus {
border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
}
~ .#{$state}-feedback,
~ .#{$state}-tooltip {
display: block;
}
}
}
.form-control-file {
.was-validated &:#{$state},
&.is-#{$state} {
@@ -99,7 +140,7 @@
color: $color;
&::before {
background-color: lighten($color, 25%);
border-color: $color;
}
}
@@ -110,13 +151,18 @@
&:checked {
~ .custom-control-label::before {
border-color: lighten($color, 10%);
@include gradient-bg(lighten($color, 10%));
}
}
&:focus {
~ .custom-control-label::before {
box-shadow: 0 0 0 1px $body-bg, 0 0 0 $input-focus-width rgba($color, .25);
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
}
&:not(:checked) ~ .custom-control-label::before {
border-color: $color;
}
}
}
@@ -128,8 +174,6 @@
&.is-#{$state} {
~ .custom-file-label {
border-color: $color;
&::after { border-color: inherit; }
}
~ .#{$state}-feedback,
@@ -139,6 +183,7 @@
&:focus {
~ .custom-file-label {
border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
}
}

View File

@@ -8,9 +8,8 @@
%grid-column {
position: relative;
width: 100%;
min-height: 1px; // Prevent columns from collapsing when empty
padding-right: ($gutter / 2);
padding-left: ($gutter / 2);
padding-right: $gutter / 2;
padding-left: $gutter / 2;
}
@each $breakpoint in map-keys($breakpoints) {
@@ -37,7 +36,7 @@
.col#{$infix}-auto {
flex: 0 0 auto;
width: auto;
max-width: none; // Reset earlier grid tiers
max-width: 100%; // Reset earlier grid tiers
}
@for $i from 1 through $columns {

View File

@@ -2,10 +2,10 @@
//
// Generate semantic grid columns with these mixins.
@mixin make-container() {
@mixin make-container($gutter: $grid-gutter-width) {
width: 100%;
padding-right: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
padding-right: $gutter / 2;
padding-left: $gutter / 2;
margin-right: auto;
margin-left: auto;
}
@@ -20,22 +20,21 @@
}
}
@mixin make-row() {
@mixin make-row($gutter: $grid-gutter-width) {
display: flex;
flex-wrap: wrap;
margin-right: ($grid-gutter-width / -2);
margin-left: ($grid-gutter-width / -2);
margin-right: -$gutter / 2;
margin-left: -$gutter / 2;
}
@mixin make-col-ready() {
@mixin make-col-ready($gutter: $grid-gutter-width) {
position: relative;
// Prevent columns from becoming too narrow when at smaller grid tiers by
// always setting `width: 100%;`. This works because we use `flex` values
// later on to override this initial width.
width: 100%;
min-height: 1px; // Prevent collapsing
padding-right: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
padding-right: $gutter / 2;
padding-left: $gutter / 2;
}
@mixin make-col($size, $columns: $grid-columns) {

View File

@@ -20,7 +20,6 @@
//
// Short retina mixin for setting background-image and -size.
// stylelint-disable indentation, media-query-list-comma-newline-after
@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
background-image: url($file-1x);
@@ -29,8 +28,9 @@
// There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
// Compatibility info: https://caniuse.com/#feat=css-media-resolution
@media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
only screen and (min-resolution: 2dppx) { // Standardized
only screen and (min-resolution: 2dppx) { // Standardized
background-image: url($file-2x);
background-size: $width-1x $height-1x;
}
@include deprecate("`img-retina()`", "v4.3.0", "v5");
}

View File

@@ -3,7 +3,7 @@
@mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
.page-link {
padding: $padding-y $padding-x;
font-size: $font-size;
@include font-size($font-size);
line-height: $line-height;
}

View File

@@ -5,7 +5,7 @@
font-weight: $font-weight-normal;
line-height: $line-height-base;
text-align: left; // Fallback for where `start` is not supported
text-align: start; // stylelint-disable-line declaration-block-no-duplicate-properties
text-align: start;
text-decoration: none;
text-shadow: none;
text-transform: none;

View File

@@ -3,4 +3,5 @@
@mixin size($width, $height: $width) {
width: $width;
height: $height;
@include deprecate("`size()`", "v4.3.0", "v5");
}

View File

@@ -1,6 +1,6 @@
// Tables
@mixin table-row-variant($state, $background) {
@mixin table-row-variant($state, $background, $border: null) {
// Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables.
.table-#{$state} {
@@ -9,6 +9,15 @@
> td {
background-color: $background;
}
@if $border != null {
th,
td,
thead th,
tbody + tbody {
border-color: $border;
}
}
}
// Hover states for `.table-hover`

View File

@@ -6,9 +6,11 @@
#{$parent} {
color: $color !important;
}
a#{$parent} {
@include hover-focus {
color: darken($color, 10%) !important;
@if $emphasized-link-hover-darken-percentage != 0 {
a#{$parent} {
@include hover-focus {
color: darken($color, $emphasized-link-hover-darken-percentage) !important;
}
}
}
}

View File

@@ -7,7 +7,5 @@
background-color: transparent;
border: 0;
@if ($ignore-warning != true) {
@warn "The `text-hide()` mixin has been deprecated as of v4.1.0. It will be removed entirely in v5.";
}
@include deprecate("`text-hide()`", "v4.1.0", "v5", $ignore-warning);
}

View File

@@ -1,3 +1,4 @@
// stylelint-disable property-blacklist
@mixin transition($transition...) {
@if $enable-transitions {
@if length($transition) == 0 {
@@ -7,7 +8,9 @@
}
}
@media screen and (prefers-reduced-motion: reduce) {
transition: none;
@if $enable-prefers-reduced-motion-media-query {
@media (prefers-reduced-motion: reduce) {
transition: none;
}
}
}

View File

@@ -4,4 +4,5 @@
@mixin invisible($visibility) {
visibility: $visibility !important;
@include deprecate("`invisible()`", "v4.3.0", "v5");
}