12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182 |
- .alert {
- font-weight: 500;
- border: none;
- padding: 0.85rem 1.2rem;
- border-radius: .25rem;
- // close
- h4 {
- color: inherit;
- }
- .close:focus{
- outline: 0;
- }
- // For Alert Content
- p {
- font-weight: 500;
- padding: 2px 0;
- margin-bottom: 0;
- vertical-align: middle;
- }
- span{
- vertical-align: middle;
- }
- // For alert heading
- .alert-heading {
- font-weight: 700;
- font-size: 0.9rem;
- padding: 0;
- padding-bottom: 8px;
- }
- &.alert-dark {
- .alert-heading {
- box-shadow: rgba($dark, 0.4) 0px 6px 15px -7px;
- }
- }
- }
- .alert-danger {
- background-color: #f5e0e8;
- color: #ef5228;
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16);
- }
- .alert-success {
- background: rgba($success,.2);
- color: darken($success, 2%);
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12);
- }
- .alert-info {
- background: rgba($info,.2);
- color: $info;
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.17);
- }
- .alert-primary {
- background: rgba($primary,.2);
- color: $primary-darker;
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.17);
- }
- .alert-warning {
- background-color: #f6f6eb;
- color: darken($warning, 8%);
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.09);
- }
- .callout {
- border-radius: .1rem;
- border: 0;
- border-left: 3.5px solid lighten(#8e9aac, 5%);
- background-color: #fff;
- margin-bottom: 1rem;
- box-shadow: $shadow;
- }
- .callout.callout-primary {
- border-left: 3.5px solid lighten($primary, 2%);
- }
- .callout.callout-light {
- background-color: #f7f7f9;
- box-shadow: none;
- }
|