| .toast { |
| // Prevents from shrinking in IE11, when in a flex container |
| // See https://github.com/twbs/bootstrap/issues/28341 |
| flex-basis: $toast-max-width; |
| max-width: $toast-max-width; |
| @include font-size($toast-font-size); |
| color: $toast-color; |
| background-color: $toast-background-color; |
| background-clip: padding-box; |
| border: $toast-border-width solid $toast-border-color; |
| box-shadow: $toast-box-shadow; |
| opacity: 0; |
| @include border-radius($toast-border-radius); |
| |
| &:not(:last-child) { |
| margin-bottom: $toast-padding-x; |
| } |
| |
| &.showing { |
| opacity: 1; |
| } |
| |
| &.show { |
| display: block; |
| opacity: 1; |
| } |
| |
| &.hide { |
| display: none; |
| } |
| } |
| |
| .toast-header { |
| display: flex; |
| align-items: center; |
| padding: $toast-padding-y $toast-padding-x; |
| color: $toast-header-color; |
| background-color: $toast-header-background-color; |
| background-clip: padding-box; |
| border-bottom: $toast-border-width solid $toast-header-border-color; |
| @include border-top-radius(subtract($toast-border-radius, $toast-border-width)); |
| } |
| |
| .toast-body { |
| padding: $toast-padding-x; // apply to both vertical and horizontal |
| } |