[6a3a178] | 1 | //
|
---|
| 2 | // Base styles
|
---|
| 3 | //
|
---|
| 4 |
|
---|
| 5 | .alert {
|
---|
| 6 | position: relative;
|
---|
| 7 | padding: $alert-padding-y $alert-padding-x;
|
---|
| 8 | margin-bottom: $alert-margin-bottom;
|
---|
| 9 | border: $alert-border-width solid transparent;
|
---|
| 10 | @include border-radius($alert-border-radius);
|
---|
| 11 | }
|
---|
| 12 |
|
---|
| 13 | // Headings for larger alerts
|
---|
| 14 | .alert-heading {
|
---|
| 15 | // Specified to prevent conflicts of changing $headings-color
|
---|
| 16 | color: inherit;
|
---|
| 17 | }
|
---|
| 18 |
|
---|
| 19 | // Provide class for links that match alerts
|
---|
| 20 | .alert-link {
|
---|
| 21 | font-weight: $alert-link-font-weight;
|
---|
| 22 | }
|
---|
| 23 |
|
---|
| 24 |
|
---|
| 25 | // Dismissible alerts
|
---|
| 26 | //
|
---|
| 27 | // Expand the right padding and account for the close button's positioning.
|
---|
| 28 |
|
---|
| 29 | .alert-dismissible {
|
---|
| 30 | padding-right: $alert-dismissible-padding-r;
|
---|
| 31 |
|
---|
| 32 | // Adjust close link position
|
---|
| 33 | .btn-close {
|
---|
| 34 | position: absolute;
|
---|
| 35 | top: 0;
|
---|
| 36 | right: 0;
|
---|
| 37 | z-index: $stretched-link-z-index + 1;
|
---|
| 38 | padding: $alert-padding-y * 1.25 $alert-padding-x;
|
---|
| 39 | }
|
---|
| 40 | }
|
---|
| 41 |
|
---|
| 42 |
|
---|
| 43 | // scss-docs-start alert-modifiers
|
---|
| 44 | // Generate contextual modifier classes for colorizing the alert.
|
---|
| 45 |
|
---|
| 46 | @each $state, $value in $theme-colors {
|
---|
| 47 | $alert-background: shift-color($value, $alert-bg-scale);
|
---|
| 48 | $alert-border: shift-color($value, $alert-border-scale);
|
---|
| 49 | $alert-color: shift-color($value, $alert-color-scale);
|
---|
| 50 | @if (contrast-ratio($alert-background, $alert-color) < $min-contrast-ratio) {
|
---|
| 51 | $alert-color: mix($value, color-contrast($alert-background), abs($alert-color-scale));
|
---|
| 52 | }
|
---|
| 53 | .alert-#{$state} {
|
---|
| 54 | @include alert-variant($alert-background, $alert-border, $alert-color);
|
---|
| 55 | }
|
---|
| 56 | }
|
---|
| 57 | // scss-docs-end alert-modifiers
|
---|