Changeset 123030 in spip-zone


Ignore:
Timestamp:
Mar 22, 2020, 11:29:34 AM (3 weeks ago)
Author:
Cerdic
Message:

Correction pour BS 4.4.1 et application nouvelle doctrine : on ne met que les variables modifiees dans le _variables.scss (et celles necessaires pour les calculer)

File:
1 edited

Legend:

Unmodified
Added
Removed
  • _themes_/spipr/v2/patisson/css/_variables.scss

    r122516 r123030  
    2121$black:    #111 !default;
    2222
    23 $grays: () !default;
    24 // stylelint-disable-next-line scss/dollar-variable-default
    25 $grays: map-merge(
    26   (
    27     "100": $gray-100,
    28     "200": $gray-200,
    29     "300": $gray-300,
    30     "400": $gray-400,
    31     "500": $gray-500,
    32     "600": $gray-600,
    33     "700": $gray-700,
    34     "800": $gray-800,
    35     "900": $gray-900
    36   ),
    37   $grays
    38 );
    39 
    4023$blue:    #007bff !default;
    4124$indigo:  #6610f2 !default;
     
    4932$cyan:    #17a2b8 !default;
    5033
    51 $colors: () !default;
    52 // stylelint-disable-next-line scss/dollar-variable-default
    53 $colors: map-merge(
    54   (
    55     "blue":       $blue,
    56     "indigo":     $indigo,
    57     "purple":     $purple,
    58     "pink":       $pink,
    59     "red":        $red,
    60     "orange":     $orange,
    61     "yellow":     $yellow,
    62     "green":      $green,
    63     "teal":       $teal,
    64     "cyan":       $cyan,
    65     "white":      $white,
    66     "gray":       $gray-600,
    67     "gray-dark":  $gray-800
    68   ),
    69   $colors
    70 );
     34
    7135
    7236$primary:       $orange !default;
     
    7943$dark:          $gray-800 !default;
    8044
    81 $theme-colors: () !default;
    82 // stylelint-disable-next-line scss/dollar-variable-default
    83 $theme-colors: map-merge(
    84   (
    85     "primary":    $primary,
    86     "secondary":  $secondary,
    87     "success":    $success,
    88     "info":       $info,
    89     "warning":    $warning,
    90     "danger":     $danger,
    91     "light":      $light,
    92     "dark":       $dark
    93   ),
    94   $theme-colors
    95 );
    96 
    97 // Set a specific jump point for requesting color jumps
    98 $theme-color-interval:      8% !default;
    99 
    100 // The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255.
    101 $yiq-contrasted-threshold:  150 !default;
    102 
    103 // Customize the light and dark text colors for use in our YIQ color contrast function.
    104 $yiq-text-dark:             $gray-900 !default;
    105 $yiq-text-light:            $white !default;
    10645
    10746
     
    12766// Spacing
    12867//
    129 // Control the default styling of most Bootstrap elements by modifying these
    130 // variables. Mostly focused on spacing.
    131 // You can add more entries to the $spacers map, should you need more variation.
    13268
    13369$spacer: 1.65rem !default;
     
    14682);
    14783
    148 // This variable affects the `.h-*` and `.w-*` classes.
    149 $sizes: () !default;
    150 // stylelint-disable-next-line scss/dollar-variable-default
    151 $sizes: map-merge(
    152   (
    153     25: 25%,
    154     50: 50%,
    155     75: 75%,
    156     100: 100%,
    157     auto: auto
    158   ),
    159   $sizes
    160 );
    161 
    162 
    16384// Body
    16485//
     
    17596$link-color:                              $black !default;
    17697$link-decoration:                         none !default;
    177 $link-hover-color:                        theme-color("primary") !default;
     98$link-hover-color:                        $primary;
    17899$link-hover-decoration:                   none !default;
    179100// Darken percentage for links with `.text-*` class (e.g. `.text-success`)
     
    201122) !default;
    202123
    203 @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
    204 @include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints");
    205 
    206 
    207124// Grid containers
    208125//
     
    216133) !default;
    217134
    218 @include _assert-ascending($container-max-widths, "$container-max-widths");
    219 
    220135
    221136// Grid columns
     
    248163
    249164$component-active-color:      $white !default;
    250 $component-active-bg:         theme-color("primary") !default;
     165$component-active-bg:         $primary !default;
    251166
    252167$caret-width:                 .3em !default;
     
    257172$transition-fade:             opacity .15s linear !default;
    258173$transition-collapse:         height .35s ease !default;
    259 
    260 $embed-responsive-aspect-ratios: () !default;
    261 // stylelint-disable-next-line scss/dollar-variable-default
    262 $embed-responsive-aspect-ratios: join(
    263   (
    264     (21 9),
    265     (16 9),
    266     (4 3),
    267     (1 1),
    268   ),
    269   $embed-responsive-aspect-ratios
    270 );
    271174
    272175// Typography
     
    356259
    357260
    358 // Tables
    359 //
    360 // Customizes the `.table` component with basic values, each used across all table variations.
    361 
    362 $table-cell-padding:          .75rem !default;
    363 $table-cell-padding-sm:       .3rem !default;
    364 
    365 $table-color:                 $body-color !default;
    366 $table-bg:                    null !default;
    367 $table-accent-bg:             rgba($black, .05) !default;
    368 $table-hover-color:           $table-color !default;
    369 $table-hover-bg:              rgba($black, .075) !default;
    370 $table-active-bg:             $table-hover-bg !default;
    371 
    372 $table-border-width:          $border-width !default;
    373 $table-border-color:          $border-color !default;
    374 
    375 $table-head-bg:               $gray-200 !default;
    376 $table-head-color:            $gray-700 !default;
    377 
    378 $table-dark-color:            $white !default;
    379 $table-dark-bg:               $gray-800 !default;
    380 $table-dark-accent-bg:        rgba($white, .05) !default;
    381 $table-dark-hover-color:      $table-dark-color !default;
    382 $table-dark-hover-bg:         rgba($white, .075) !default;
    383 $table-dark-border-color:     lighten($table-dark-bg, 7.5%) !default;
    384 $table-dark-color:            $white !default;
    385 
    386 $table-striped-order:         odd !default;
    387 
    388 $table-caption-color:         $text-muted !default;
    389 
    390 $table-bg-level:              -9 !default;
    391 $table-border-level:          -6 !default;
    392 
    393 
    394 // Buttons + Forms
    395 //
    396 // Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
    397 
    398 $input-btn-padding-y:         .375rem !default;
    399 $input-btn-padding-x:         .75rem !default;
    400 $input-btn-font-family:       null !default;
    401 $input-btn-font-size:         $font-size-base !default;
    402 $input-btn-line-height:       $line-height-base !default;
    403 
    404 $input-btn-focus-width:       .2rem !default;
    405 $input-btn-focus-color:       rgba($component-active-bg, .25) !default;
    406 $input-btn-focus-box-shadow:  0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
    407 
    408 $input-btn-padding-y-sm:      .25rem !default;
    409 $input-btn-padding-x-sm:      .5rem !default;
    410 $input-btn-font-size-sm:      $font-size-sm !default;
    411 $input-btn-line-height-sm:    $line-height-sm !default;
    412 
    413 $input-btn-padding-y-lg:      .5rem !default;
    414 $input-btn-padding-x-lg:      1rem !default;
    415 $input-btn-font-size-lg:      $font-size-lg !default;
    416 $input-btn-line-height-lg:    $line-height-lg !default;
    417 
    418 $input-btn-border-width:      $border-width !default;
    419 
    420 
    421 // Buttons
    422 //
    423 // For each of Bootstrap's buttons, define text, background, and border color.
    424 
    425 $btn-padding-y:               $input-btn-padding-y !default;
    426 $btn-padding-x:               $input-btn-padding-x !default;
    427 $btn-font-family:             $input-btn-font-family !default;
    428 $btn-font-size:               $input-btn-font-size !default;
    429 $btn-line-height:             $input-btn-line-height !default;
    430 
    431 $btn-padding-y-sm:            $input-btn-padding-y-sm !default;
    432 $btn-padding-x-sm:            $input-btn-padding-x-sm !default;
    433 $btn-font-size-sm:            $input-btn-font-size-sm !default;
    434 $btn-line-height-sm:          $input-btn-line-height-sm !default;
    435 
    436 $btn-padding-y-lg:            $input-btn-padding-y-lg !default;
    437 $btn-padding-x-lg:            $input-btn-padding-x-lg !default;
    438 $btn-font-size-lg:            $input-btn-font-size-lg !default;
    439 $btn-line-height-lg:          $input-btn-line-height-lg !default;
    440 
    441 $btn-border-width:            $input-btn-border-width !default;
    442 
    443 $btn-font-weight:             $font-weight-normal !default;
    444 $btn-box-shadow:              inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;
    445 $btn-focus-width:             $input-btn-focus-width !default;
    446 $btn-focus-box-shadow:        $input-btn-focus-box-shadow !default;
    447 $btn-disabled-opacity:        .65 !default;
    448 $btn-active-box-shadow:       inset 0 3px 5px rgba($black, .125) !default;
    449 
    450 $btn-link-disabled-color:     $gray-600 !default;
    451 
    452 $btn-block-spacing-y:         .5rem !default;
    453 
    454 // Allows for customizing button radius independently from global border radius
    455 $btn-border-radius:           $border-radius !default;
    456 $btn-border-radius-lg:        $border-radius-lg !default;
    457 $btn-border-radius-sm:        $border-radius-sm !default;
    458 
    459 $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;
    460 
    461 
    462 // Forms
    463 
    464 $label-margin-bottom:                   .5rem !default;
    465 
    466 $input-padding-y:                       $input-btn-padding-y !default;
    467 $input-padding-x:                       $input-btn-padding-x !default;
    468 $input-font-family:                     $input-btn-font-family !default;
    469 $input-font-size:                       $input-btn-font-size !default;
    470 $input-font-weight:                     $font-weight-base !default;
    471 $input-line-height:                     $input-btn-line-height !default;
    472 
    473 $input-padding-y-sm:                    $input-btn-padding-y-sm !default;
    474 $input-padding-x-sm:                    $input-btn-padding-x-sm !default;
    475 $input-font-size-sm:                    $input-btn-font-size-sm !default;
    476 $input-line-height-sm:                  $input-btn-line-height-sm !default;
    477 
    478 $input-padding-y-lg:                    $input-btn-padding-y-lg !default;
    479 $input-padding-x-lg:                    $input-btn-padding-x-lg !default;
    480 $input-font-size-lg:                    $input-btn-font-size-lg !default;
    481 $input-line-height-lg:                  $input-btn-line-height-lg !default;
    482 
    483 $input-bg:                              $white !default;
    484 $input-disabled-bg:                     $gray-200 !default;
    485 
    486 $input-color:                           $gray-700 !default;
    487 $input-border-color:                    $gray-400 !default;
    488 $input-border-width:                    $input-btn-border-width !default;
    489 $input-box-shadow:                      inset 0 1px 1px rgba($black, .075) !default;
    490 
    491 $input-border-radius:                   $border-radius !default;
    492 $input-border-radius-lg:                $border-radius-lg !default;
    493 $input-border-radius-sm:                $border-radius-sm !default;
    494 
    495 $input-focus-bg:                        $input-bg !default;
    496 $input-focus-border-color:              lighten($component-active-bg, 25%) !default;
    497 $input-focus-color:                     $input-color !default;
    498 $input-focus-width:                     $input-btn-focus-width !default;
    499 $input-focus-box-shadow:                $input-btn-focus-box-shadow !default;
    500 
    501 $input-placeholder-color:               $gray-600 !default;
    502 $input-plaintext-color:                 $body-color !default;
    503 
    504 $input-height-border:                   $input-border-width * 2 !default;
    505 
    506 $input-height-inner:                    calc(#{$input-line-height * 1em} + #{$input-padding-y * 2}) !default;
    507 $input-height-inner-half:               calc(#{$input-line-height * .5em} + #{$input-padding-y}) !default;
    508 $input-height-inner-quarter:            calc(#{$input-line-height * .25em} + #{$input-padding-y / 2}) !default;
    509 
    510 $input-height:                          calc(#{$input-line-height * 1em} + #{$input-padding-y * 2} + #{$input-height-border}) !default;
    511 $input-height-sm:                       calc(#{$input-line-height-sm * 1em} + #{$input-btn-padding-y-sm * 2} + #{$input-height-border}) !default;
    512 $input-height-lg:                       calc(#{$input-line-height-lg * 1em} + #{$input-btn-padding-y-lg * 2} + #{$input-height-border}) !default;
    513 
    514 $input-transition:                      border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
    515 
    516 $form-text-margin-top:                  .1875rem !default;
    517 
    518 $form-check-input-gutter:               1.25rem !default;
    519 $form-check-input-margin-y:             .3rem !default;
    520 $form-check-input-margin-x:             .25rem !default;
    521 
    522 $form-check-inline-margin-x:            .75rem !default;
    523 $form-check-inline-input-margin-x:      .3125rem !default;
    524 
    525 $form-grid-gutter-width:                10px !default;
    526 $form-group-margin-bottom:              1.5rem !default;
    527 
    528 $input-group-addon-color:               $input-color !default;
    529 $input-group-addon-bg:                  $gray-200 !default;
    530 $input-group-addon-border-color:        $input-border-color !default;
    531 
    532 $custom-forms-transition:               background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
    533 
    534 $custom-control-gutter:                 .5rem !default;
    535 $custom-control-spacer-x:               1rem !default;
    536 
    537 $custom-control-indicator-size:         1rem !default;
    538 $custom-control-indicator-bg:           $input-bg !default;
    539 
    540 $custom-control-indicator-bg-size:      50% 50% !default;
    541 $custom-control-indicator-box-shadow:   $input-box-shadow !default;
    542 $custom-control-indicator-border-color: $gray-500 !default;
    543 $custom-control-indicator-border-width: $input-border-width !default;
    544 
    545 $custom-control-indicator-disabled-bg:          $input-disabled-bg !default;
    546 $custom-control-label-disabled-color:           $gray-600 !default;
    547 
    548 $custom-control-indicator-checked-color:        $component-active-color !default;
    549 $custom-control-indicator-checked-bg:           $component-active-bg !default;
    550 $custom-control-indicator-checked-disabled-bg:  rgba(theme-color("primary"), .5) !default;
    551 $custom-control-indicator-checked-box-shadow:   none !default;
    552 $custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
    553 
    554 $custom-control-indicator-focus-box-shadow:     $input-focus-box-shadow !default;
    555 $custom-control-indicator-focus-border-color:   $input-focus-border-color !default;
    556 
    557 $custom-control-indicator-active-color:         $component-active-color !default;
    558 $custom-control-indicator-active-bg:            lighten($component-active-bg, 35%) !default;
    559 $custom-control-indicator-active-box-shadow:    none !default;
    560 $custom-control-indicator-active-border-color:  $custom-control-indicator-active-bg !default;
    561 
    562 $custom-checkbox-indicator-border-radius:       $border-radius !default;
    563 $custom-checkbox-indicator-icon-checked:        str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e"), "#", "%23") !default;
    564 
    565 $custom-checkbox-indicator-indeterminate-bg:           $component-active-bg !default;
    566 $custom-checkbox-indicator-indeterminate-color:        $custom-control-indicator-checked-color !default;
    567 $custom-checkbox-indicator-icon-indeterminate:         str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3e%3c/svg%3e"), "#", "%23") !default;
    568 $custom-checkbox-indicator-indeterminate-box-shadow:   none !default;
    569 $custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default;
    570 
    571 $custom-radio-indicator-border-radius:          50% !default;
    572 $custom-radio-indicator-icon-checked:           str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3e%3c/svg%3e"), "#", "%23") !default;
    573 
    574 $custom-switch-width:                           $custom-control-indicator-size * 1.75 !default;
    575 $custom-switch-indicator-border-radius:         $custom-control-indicator-size / 2 !default;
    576 $custom-switch-indicator-size:                  calc(#{$custom-control-indicator-size} - #{$custom-control-indicator-border-width * 4}) !default;
    577 
    578 $custom-select-padding-y:           $input-padding-y !default;
    579 $custom-select-padding-x:           $input-padding-x !default;
    580 $custom-select-font-family:         $input-font-family !default;
    581 $custom-select-font-size:           $input-font-size !default;
    582 $custom-select-height:              $input-height !default;
    583 $custom-select-indicator-padding:   1rem !default; // Extra padding to account for the presence of the background-image based indicator
    584 $custom-select-font-weight:         $input-font-weight !default;
    585 $custom-select-line-height:         $input-line-height !default;
    586 $custom-select-color:               $input-color !default;
    587 $custom-select-disabled-color:      $gray-600 !default;
    588 $custom-select-bg:                  $input-bg !default;
    589 $custom-select-disabled-bg:         $gray-200 !default;
    590 $custom-select-bg-size:             8px 10px !default; // In pixels because image dimensions
    591 $custom-select-indicator-color:     $gray-800 !default;
    592 $custom-select-indicator:           str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e"), "#", "%23") !default;
    593 $custom-select-background:          $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)
    594 
    595 $custom-select-feedback-icon-padding-right: calc((1em + #{2 * $custom-select-padding-y}) * 3 / 4 + #{$custom-select-padding-x + $custom-select-indicator-padding}) !default;
    596 $custom-select-feedback-icon-position:      center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
    597 $custom-select-feedback-icon-size:          $input-height-inner-half $input-height-inner-half !default;
    598 
    599 $custom-select-border-width:        $input-border-width !default;
    600 $custom-select-border-color:        $input-border-color !default;
    601 $custom-select-border-radius:       $border-radius !default;
    602 $custom-select-box-shadow:          inset 0 1px 2px rgba($black, .075) !default;
    603 
    604 $custom-select-focus-border-color:  $input-focus-border-color !default;
    605 $custom-select-focus-width:         $input-focus-width !default;
    606 $custom-select-focus-box-shadow:    0 0 0 $custom-select-focus-width $input-btn-focus-color !default;
    607 
    608 $custom-select-padding-y-sm:        $input-padding-y-sm !default;
    609 $custom-select-padding-x-sm:        $input-padding-x-sm !default;
    610 $custom-select-font-size-sm:        $input-font-size-sm !default;
    611 $custom-select-height-sm:           $input-height-sm !default;
    612 
    613 $custom-select-padding-y-lg:        $input-padding-y-lg !default;
    614 $custom-select-padding-x-lg:        $input-padding-x-lg !default;
    615 $custom-select-font-size-lg:        $input-font-size-lg !default;
    616 $custom-select-height-lg:           $input-height-lg !default;
    617 
    618 $custom-range-track-width:          100% !default;
    619 $custom-range-track-height:         .5rem !default;
    620 $custom-range-track-cursor:         pointer !default;
    621 $custom-range-track-bg:             $gray-300 !default;
    622 $custom-range-track-border-radius:  1rem !default;
    623 $custom-range-track-box-shadow:     inset 0 .25rem .25rem rgba($black, .1) !default;
    624 
    625 $custom-range-thumb-width:                   1rem !default;
    626 $custom-range-thumb-height:                  $custom-range-thumb-width !default;
    627 $custom-range-thumb-bg:                      $component-active-bg !default;
    628 $custom-range-thumb-border:                  0 !default;
    629 $custom-range-thumb-border-radius:           1rem !default;
    630 $custom-range-thumb-box-shadow:              0 .1rem .25rem rgba($black, .1) !default;
    631 $custom-range-thumb-focus-box-shadow:        0 0 0 1px $body-bg, $input-focus-box-shadow !default;
    632 $custom-range-thumb-focus-box-shadow-width:  $input-focus-width !default; // For focus box shadow issue in IE/Edge
    633 $custom-range-thumb-active-bg:               lighten($component-active-bg, 35%) !default;
    634 $custom-range-thumb-disabled-bg:             $gray-500 !default;
    635 
    636 $custom-file-height:                $input-height !default;
    637 $custom-file-height-inner:          $input-height-inner !default;
    638 $custom-file-focus-border-color:    $input-focus-border-color !default;
    639 $custom-file-focus-box-shadow:      $input-focus-box-shadow !default;
    640 $custom-file-disabled-bg:           $input-disabled-bg !default;
    641 
    642 $custom-file-padding-y:             $input-padding-y !default;
    643 $custom-file-padding-x:             $input-padding-x !default;
    644 $custom-file-line-height:           $input-line-height !default;
    645 $custom-file-font-family:           $input-font-family !default;
    646 $custom-file-font-weight:           $input-font-weight !default;
    647 $custom-file-color:                 $input-color !default;
    648 $custom-file-bg:                    $input-bg !default;
    649 $custom-file-border-width:          $input-border-width !default;
    650 $custom-file-border-color:          $input-border-color !default;
    651 $custom-file-border-radius:         $input-border-radius !default;
    652 $custom-file-box-shadow:            $input-box-shadow !default;
    653 $custom-file-button-color:          $custom-file-color !default;
    654 $custom-file-button-bg:             $input-group-addon-bg !default;
    655 $custom-file-text: (
    656   en: "Browse"
    657 ) !default;
    658 
    659 
    660 // Form validation
    661 
    662 $form-feedback-margin-top:          $form-text-margin-top !default;
    663 $form-feedback-font-size:           $small-font-size !default;
    664 $form-feedback-valid-color:         theme-color("success") !default;
    665 $form-feedback-invalid-color:       theme-color("danger") !default;
    666 
    667 $form-feedback-icon-valid-color:    $form-feedback-valid-color !default;
    668 $form-feedback-icon-valid:          str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath 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'/%3e%3c/svg%3e"), "#", "%23") !default;
    669 $form-feedback-icon-invalid-color:  $form-feedback-invalid-color !default;
    670 $form-feedback-icon-invalid:        str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$form-feedback-icon-invalid-color}' viewBox='-2 -2 7 7'%3e%3cpath stroke='#{$form-feedback-icon-invalid-color}' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E"), "#", "%23") !default;
    671 
    672 $form-validation-states: () !default;
    673 // stylelint-disable-next-line scss/dollar-variable-default
    674 $form-validation-states: map-merge(
    675   (
    676     "valid": (
    677       "color": $form-feedback-valid-color,
    678       "icon": $form-feedback-icon-valid
    679     ),
    680     "invalid": (
    681       "color": $form-feedback-invalid-color,
    682       "icon": $form-feedback-icon-invalid
    683     ),
    684   ),
    685   $form-validation-states
    686 );
    687 
    688 // Z-index master list
    689 //
    690 // Warning: Avoid customizing these values. They're used for a bird's eye view
    691 // of components dependent on the z-axis and are designed to all work together.
    692 
    693 $zindex-dropdown:                   1000 !default;
    694 $zindex-sticky:                     1020 !default;
    695 $zindex-fixed:                      1030 !default;
    696 $zindex-modal-backdrop:             1040 !default;
    697 $zindex-modal:                      1050 !default;
    698 $zindex-popover:                    1060 !default;
    699 $zindex-tooltip:                    1070 !default;
    700 
    701 
    702 // Navs
    703 
    704 $nav-link-padding-y:                .5rem !default;
    705 $nav-link-padding-x:                1rem !default;
    706 $nav-link-disabled-color:           $gray-600 !default;
    707 
    708 $nav-tabs-border-color:             $gray-300 !default;
    709 $nav-tabs-border-width:             $border-width !default;
    710 $nav-tabs-border-radius:            $border-radius !default;
    711 $nav-tabs-link-hover-border-color:  $gray-200 $gray-200 $nav-tabs-border-color !default;
    712 $nav-tabs-link-active-color:        $gray-700 !default;
    713 $nav-tabs-link-active-bg:           $body-bg !default;
    714 $nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;
    715 
    716 $nav-pills-border-radius:           $border-radius !default;
    717 $nav-pills-link-active-color:       $component-active-color !default;
    718 $nav-pills-link-active-bg:          $component-active-bg !default;
    719 
    720 $nav-divider-color:                 $gray-200 !default;
    721 $nav-divider-margin-y:              $spacer / 2 !default;
    722 
    723 
    724 // Navbar
    725 
    726 $navbar-padding-y:                  0.75rem !default;
    727 $navbar-padding-x:                  0 !default;
    728 
    729 $navbar-nav-link-padding-x:         1rem !default;
    730 
    731 $navbar-brand-font-size:            $font-size-lg !default;
    732 // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
    733 $nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
    734 $navbar-brand-height:               $navbar-brand-font-size * $line-height-base !default;
    735 $navbar-brand-padding-y:            ($nav-link-height - $navbar-brand-height) / 2 !default;
    736 
    737 $navbar-toggler-padding-y:          .25rem !default;
    738 $navbar-toggler-padding-x:          .75rem !default;
    739 $navbar-toggler-font-size:          $font-size-lg !default;
    740 $navbar-toggler-border-radius:      $btn-border-radius !default;
    741 
    742 $navbar-dark-color:                 rgba($white, .5) !default;
    743 $navbar-dark-hover-color:           rgba($white, .75) !default;
    744 $navbar-dark-active-color:          $white !default;
    745 $navbar-dark-disabled-color:        rgba($white, .25) !default;
    746 $navbar-dark-toggler-icon-bg:       str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
    747 $navbar-dark-toggler-border-color:  rgba($white, .1) !default;
    748 
    749 $navbar-light-color:                rgba($black, .5) !default;
    750 $navbar-light-hover-color:          rgba($black, .7) !default;
    751 $navbar-light-active-color:         rgba($black, .9) !default;
    752 $navbar-light-disabled-color:       rgba($black, .3) !default;
    753 $navbar-light-toggler-icon-bg:      str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
    754 $navbar-light-toggler-border-color: rgba($black, .1) !default;
    755 
    756 $navbar-light-brand-color:                $navbar-light-active-color !default;
    757 $navbar-light-brand-hover-color:          $navbar-light-active-color !default;
    758 $navbar-dark-brand-color:                 $navbar-dark-active-color !default;
    759 $navbar-dark-brand-hover-color:           $navbar-dark-active-color !default;
    760 
    761 
    762 // Dropdowns
    763 //
    764 // Dropdown menu container and contents.
    765 
    766 $dropdown-min-width:                10rem !default;
    767 $dropdown-padding-y:                .5rem !default;
    768 $dropdown-spacer:                   .125rem !default;
    769 $dropdown-font-size:                $font-size-base !default;
    770 $dropdown-color:                    $body-color !default;
    771 $dropdown-bg:                       $white !default;
    772 $dropdown-border-color:             rgba($black, .15) !default;
    773 $dropdown-border-radius:            $border-radius !default;
    774 $dropdown-border-width:             $border-width !default;
    775 $dropdown-inner-border-radius:      calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default;
    776 $dropdown-divider-bg:               $gray-200 !default;
    777 $dropdown-divider-margin-y:         $nav-divider-margin-y !default;
    778 $dropdown-box-shadow:               0 .5rem 1rem rgba($black, .175) !default;
    779 
    780 $dropdown-link-color:               $gray-900 !default;
    781 $dropdown-link-hover-color:         darken($gray-900, 5%) !default;
    782 $dropdown-link-hover-bg:            $gray-100 !default;
    783 
    784 $dropdown-link-active-color:        $component-active-color !default;
    785 $dropdown-link-active-bg:           $component-active-bg !default;
    786 
    787 $dropdown-link-disabled-color:      $gray-600 !default;
    788 
    789 $dropdown-item-padding-y:           .25rem !default;
    790 $dropdown-item-padding-x:           1.5rem !default;
    791 
    792 $dropdown-header-color:             $gray-600 !default;
    793 
    794 
    795 // Pagination
    796 
    797 $pagination-padding-y:              .5rem !default;
    798 $pagination-padding-x:              .75rem !default;
    799 $pagination-padding-y-sm:           .25rem !default;
    800 $pagination-padding-x-sm:           .5rem !default;
    801 $pagination-padding-y-lg:           .75rem !default;
    802 $pagination-padding-x-lg:           1.5rem !default;
    803 $pagination-line-height:            1.25 !default;
    804 
    805 $pagination-color:                  $link-color !default;
    806 $pagination-bg:                     $white !default;
    807 $pagination-border-width:           $border-width !default;
    808 $pagination-border-color:           $gray-300 !default;
    809 
    810 $pagination-focus-box-shadow:       $input-btn-focus-box-shadow !default;
    811 $pagination-focus-outline:          0 !default;
    812 
    813 $pagination-hover-color:            $link-hover-color !default;
    814 $pagination-hover-bg:               $gray-200 !default;
    815 $pagination-hover-border-color:     $gray-300 !default;
    816 
    817 $pagination-active-color:           $component-active-color !default;
    818 $pagination-active-bg:              $component-active-bg !default;
    819 $pagination-active-border-color:    $pagination-active-bg !default;
    820 
    821 $pagination-disabled-color:         $gray-600 !default;
    822 $pagination-disabled-bg:            $white !default;
    823 $pagination-disabled-border-color:  $gray-300 !default;
    824 
    825 
    826 // Jumbotron
    827 
    828 $jumbotron-padding:                 2rem !default;
    829 $jumbotron-color:                   null !default;
    830 $jumbotron-bg:                      $gray-200 !default;
    831 
    832261
    833262// Cards
    834263
    835 $card-spacer-y:                     .75rem !default;
    836 $card-spacer-x:                     1.25rem !default;
    837 $card-border-width:                 $border-width !default;
    838 $card-border-radius:                $border-radius !default;
    839264$card-border-color:                 $border-color !default;
    840 $card-inner-border-radius:          calc(#{$card-border-radius} - #{$card-border-width}) !default;
    841 $card-cap-bg:                       rgba($black, .03) !default;
    842 $card-cap-color:                    null !default;
    843 $card-color:                        null !default;
    844 $card-bg:                           $white !default;
    845 
    846 $card-img-overlay-padding:          1.25rem !default;
    847 
    848 $card-group-margin:                 $grid-gutter-width / 2 !default;
    849 $card-deck-margin:                  $card-group-margin !default;
    850 
    851 $card-columns-count:                3 !default;
    852 $card-columns-gap:                  1.25rem !default;
    853 $card-columns-margin:               $card-spacer-y !default;
    854 
    855 
    856 // Tooltips
    857 
    858 $tooltip-font-size:                 $font-size-sm !default;
    859 $tooltip-max-width:                 200px !default;
    860 $tooltip-color:                     $white !default;
    861 $tooltip-bg:                        $black !default;
    862 $tooltip-border-radius:             $border-radius !default;
    863 $tooltip-opacity:                   .9 !default;
    864 $tooltip-padding-y:                 .25rem !default;
    865 $tooltip-padding-x:                 .5rem !default;
    866 $tooltip-margin:                    0 !default;
    867 
    868 $tooltip-arrow-width:               .8rem !default;
    869 $tooltip-arrow-height:              .4rem !default;
    870 $tooltip-arrow-color:               $tooltip-bg !default;
    871 
    872 // Form tooltips must come after regular tooltips
    873 $form-feedback-tooltip-padding-y:     $tooltip-padding-y !default;
    874 $form-feedback-tooltip-padding-x:     $tooltip-padding-x !default;
    875 $form-feedback-tooltip-font-size:     $tooltip-font-size !default;
    876 $form-feedback-tooltip-line-height:   $line-height-base !default;
    877 $form-feedback-tooltip-opacity:       $tooltip-opacity !default;
    878 $form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
    879 
    880 
    881 // Popovers
    882 
    883 $popover-font-size:                 $font-size-sm !default;
    884 $popover-bg:                        $white !default;
    885 $popover-max-width:                 276px !default;
    886 $popover-border-width:              $border-width !default;
    887 $popover-border-color:              rgba($black, .2) !default;
    888 $popover-border-radius:             $border-radius-lg !default;
    889 $popover-box-shadow:                0 .25rem .5rem rgba($black, .2) !default;
    890 
    891 $popover-header-bg:                 darken($popover-bg, 3%) !default;
    892 $popover-header-color:              $headings-color !default;
    893 $popover-header-padding-y:          .5rem !default;
    894 $popover-header-padding-x:          .75rem !default;
    895 
    896 $popover-body-color:                $body-color !default;
    897 $popover-body-padding-y:            $popover-header-padding-y !default;
    898 $popover-body-padding-x:            $popover-header-padding-x !default;
    899 
    900 $popover-arrow-width:               1rem !default;
    901 $popover-arrow-height:              .5rem !default;
    902 $popover-arrow-color:               $popover-bg !default;
    903 
    904 $popover-arrow-outer-color:         fade-in($popover-border-color, .05) !default;
    905 
    906 
    907 // Toasts
    908 
    909 $toast-max-width:                   350px !default;
    910 $toast-padding-x:                   .75rem !default;
    911 $toast-padding-y:                   .25rem !default;
    912 $toast-font-size:                   .875rem !default;
    913 $toast-color:                       null !default;
    914 $toast-background-color:            rgba($white, .85) !default;
    915 $toast-border-width:                1px !default;
    916 $toast-border-color:                rgba(0, 0, 0, .1) !default;
    917 $toast-border-radius:               .25rem !default;
    918 $toast-box-shadow:                  0 .25rem .75rem rgba($black, .1) !default;
    919 
    920 $toast-header-color:                $gray-600 !default;
    921 $toast-header-background-color:     rgba($white, .85) !default;
    922 $toast-header-border-color:         rgba(0, 0, 0, .05) !default;
    923 
    924 
    925 // Badges
    926 
    927 $badge-font-size:                   75% !default;
    928 $badge-font-weight:                 $font-weight-bold !default;
    929 $badge-padding-y:                   .25em !default;
    930 $badge-padding-x:                   .4em !default;
    931 $badge-border-radius:               $border-radius !default;
    932 
    933 $badge-transition:                  $btn-transition !default;
    934 $badge-focus-width:                 $input-btn-focus-width !default;
    935 
    936 $badge-pill-padding-x:              .6em !default;
    937 // Use a higher than normal value to ensure completely rounded edges when
    938 // customizing padding or font-size on labels.
    939 $badge-pill-border-radius:          10rem !default;
    940 
    941 
    942 // Modals
    943 
    944 // Padding applied to the modal body
    945 $modal-inner-padding:               1rem !default;
    946 
    947 $modal-dialog-margin:               .5rem !default;
    948 $modal-dialog-margin-y-sm-up:       1.75rem !default;
    949 
    950 $modal-title-line-height:           $line-height-base !default;
    951 
    952 $modal-content-color:               null !default;
    953 $modal-content-bg:                  $white !default;
    954 $modal-content-border-color:        rgba($black, .2) !default;
    955 $modal-content-border-width:        $border-width !default;
    956 $modal-content-border-radius:       $border-radius-lg !default;
    957 $modal-content-box-shadow-xs:       0 .25rem .5rem rgba($black, .5) !default;
    958 $modal-content-box-shadow-sm-up:    0 .5rem 1rem rgba($black, .5) !default;
    959 
    960 $modal-backdrop-bg:                 $black !default;
    961 $modal-backdrop-opacity:            .5 !default;
    962 $modal-header-border-color:         $border-color !default;
    963 $modal-footer-border-color:         $modal-header-border-color !default;
    964 $modal-header-border-width:         $modal-content-border-width !default;
    965 $modal-footer-border-width:         $modal-header-border-width !default;
    966 $modal-header-padding-y:            1rem !default;
    967 $modal-header-padding-x:            1rem !default;
    968 $modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
    969 
    970 $modal-xl:                          1140px !default;
    971 $modal-lg:                          800px !default;
    972 $modal-md:                          500px !default;
    973 $modal-sm:                          300px !default;
    974 
    975 $modal-fade-transform:              translate(0, -50px) !default;
    976 $modal-show-transform:              none !default;
    977 $modal-transition:                  transform .3s ease-out !default;
    978 
    979 
    980 // Alerts
    981 //
    982 // Define alert colors, border radius, and padding.
    983 
    984 $alert-padding-y:                   .75rem !default;
    985 $alert-padding-x:                   1.25rem !default;
    986 $alert-margin-bottom:               1rem !default;
    987 $alert-border-radius:               $border-radius !default;
    988 $alert-link-font-weight:            $font-weight-bold !default;
    989 $alert-border-width:                $border-width !default;
    990 
    991 $alert-bg-level:                    -10 !default;
    992 $alert-border-level:                -9 !default;
    993 $alert-color-level:                 6 !default;
    994 
    995 
    996 // Progress bars
    997 
    998 $progress-height:                   1rem !default;
    999 $progress-font-size:                $font-size-base * .75 !default;
    1000 $progress-bg:                       $gray-200 !default;
    1001 $progress-border-radius:            $border-radius !default;
    1002 $progress-box-shadow:               inset 0 .1rem .1rem rgba($black, .1) !default;
    1003 $progress-bar-color:                $white !default;
    1004 $progress-bar-bg:                   theme-color("primary") !default;
    1005 $progress-bar-animation-timing:     1s linear infinite !default;
    1006 $progress-bar-transition:           width .6s ease !default;
    1007 
    1008 
    1009 // List group
    1010 
    1011 $list-group-color:                  null !default;
    1012 $list-group-bg:                     $white !default;
    1013 $list-group-border-color:           rgba($black, .125) !default;
    1014 $list-group-border-width:           $border-width !default;
    1015 $list-group-border-radius:          $border-radius !default;
    1016 
    1017 $list-group-item-padding-y:         .75rem !default;
    1018 $list-group-item-padding-x:         1.25rem !default;
    1019 
    1020 $list-group-hover-bg:               $gray-100 !default;
    1021 $list-group-active-color:           $component-active-color !default;
    1022 $list-group-active-bg:              $component-active-bg !default;
    1023 $list-group-active-border-color:    $list-group-active-bg !default;
    1024 
    1025 $list-group-disabled-color:         $gray-600 !default;
    1026 $list-group-disabled-bg:            $list-group-bg !default;
    1027 
    1028 $list-group-action-color:           $gray-700 !default;
    1029 $list-group-action-hover-color:     $list-group-action-color !default;
    1030 
    1031 $list-group-action-active-color:    $body-color !default;
    1032 $list-group-action-active-bg:       $gray-200 !default;
    1033 
    1034 
    1035 // Image thumbnails
    1036 
    1037 $thumbnail-padding:                 .25rem !default;
    1038 $thumbnail-bg:                      $body-bg !default;
    1039 $thumbnail-border-width:            $border-width !default;
    1040 $thumbnail-border-color:            $gray-300 !default;
    1041 $thumbnail-border-radius:           $border-radius !default;
    1042 $thumbnail-box-shadow:              0 1px 2px rgba($black, .075) !default;
    1043 
    1044 
    1045 // Figures
    1046 
    1047 $figure-caption-font-size:          90% !default;
    1048 $figure-caption-color:              $gray-600 !default;
    1049265
    1050266
     
    1053269$breadcrumb-padding-y:              0 !default;
    1054270$breadcrumb-padding-x:              0 !default;
    1055 $breadcrumb-item-padding:           .5rem !default;
    1056271
    1057272$breadcrumb-margin-bottom:          $spacer !default;
    1058273
    1059274$breadcrumb-bg:                     transparent !default;
    1060 $breadcrumb-divider-color:          $gray-600 !default;
    1061 $breadcrumb-active-color:           $gray-600 !default;
    1062 $breadcrumb-divider:                quote("/") !default;
    1063 
    1064 $breadcrumb-border-radius:          $border-radius !default;
    1065 
    1066 
    1067 // Carousel
    1068 
    1069 $carousel-control-color:             $white !default;
    1070 $carousel-control-width:             15% !default;
    1071 $carousel-control-opacity:           .5 !default;
    1072 $carousel-control-hover-opacity:     .9 !default;
    1073 $carousel-control-transition:        opacity .15s ease !default;
    1074 
    1075 $carousel-indicator-width:           30px !default;
    1076 $carousel-indicator-height:          3px !default;
    1077 $carousel-indicator-hit-area-height: 10px !default;
    1078 $carousel-indicator-spacer:          3px !default;
    1079 $carousel-indicator-active-bg:       $white !default;
    1080 $carousel-indicator-transition:      opacity .6s ease !default;
    1081 
    1082 $carousel-caption-width:             70% !default;
    1083 $carousel-caption-color:             $white !default;
    1084 
    1085 $carousel-control-icon-width:        20px !default;
    1086 
    1087 $carousel-control-prev-icon-bg:      str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e"), "#", "%23") !default;
    1088 $carousel-control-next-icon-bg:      str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e"), "#", "%23") !default;
    1089 
    1090 $carousel-transition-duration:       .6s !default;
    1091 $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`)
    1092 
    1093 
    1094 // Spinners
    1095 
    1096 $spinner-width:         2rem !default;
    1097 $spinner-height:        $spinner-width !default;
    1098 $spinner-border-width:  .25em !default;
    1099 
    1100 $spinner-width-sm:        1rem !default;
    1101 $spinner-height-sm:       $spinner-width-sm !default;
    1102 $spinner-border-width-sm: .2em !default;
    1103 
    1104 
    1105 // Close
    1106 
    1107 $close-font-size:                   $font-size-base * 1.5 !default;
    1108 $close-font-weight:                 $font-weight-bold !default;
    1109 $close-color:                       $black !default;
    1110 $close-text-shadow:                 0 1px 0 $white !default;
    1111 
    1112275
    1113276// Code
     
    1116279$code-color:                        $gray-500 !default;
    1117280
    1118 $kbd-padding-y:                     .2rem !default;
    1119 $kbd-padding-x:                     .4rem !default;
    1120 $kbd-font-size:                     $code-font-size !default;
    1121 $kbd-color:                         $white !default;
    1122 $kbd-bg:                            $gray-900 !default;
    1123 
    1124 $pre-color:                         $gray-900 !default;
    1125 $pre-scrollable-max-height:         340px !default;
    1126 
    1127 
    1128 // Utilities
    1129 
    1130 $displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default;
    1131 $overflows: auto, hidden !default;
    1132 $positions: static, relative, absolute, fixed, sticky !default;
    1133 
    1134 
    1135 // Printing
    1136 
    1137 $print-page-size:                   a3 !default;
    1138 $print-body-min-width:              map-get($grid-breakpoints, "lg") !default;
     281
     282@import "bootstrap/css/variables";
Note: See TracChangeset for help on using the changeset viewer.