.alert{ border-radius: $radius; padding: .75rem 0; padding-#{$dlab-pos-left}: 1.2rem; padding-#{$dlab-pos-right}: 2.5rem; p{ line-height:1.5; } } .alert-square{ border-radius:0!important; } .alert-rounded{ border-radius: 1.875rem; } // Basic Alert .alert-primary{ background: var(--rgba-primary-1); border-color: var(--rgba-primary-1); color: var(--primary); } .alert-secondary{ background: $secondary-opacity; border-color: $secondary-opacity; color: $secondary; @at-root [data-theme-version="dark"] & { color:$white; } } .alert-success{ background: $success-opacity; border-color: $success-opacity; color: darken($success,25%); @at-root [data-theme-version="dark"] & { color: $success; } } .alert-warning{ background: $warning-opacity; border-color: $warning-opacity; color: darken($warning,25%); } .alert-danger{ background: $danger-opacity; border-color: $danger-opacity; color: $danger; } .alert-info{ background: $info-opacity; border-color: $info-opacity; color: $info; } .alert-dark{ background: $dark-opacity; border-color: $dark-opacity; color: $dark; @at-root [data-theme-version="dark"] & { color:$white; } } .alert-light{ background: $light; border-color: $light; color: $dark; @at-root [data-theme-version="dark"] & { background: rgba($light, 0.3); border-color: rgba($light, 0.3); color: $white; } } // Alert alt .alert-alt.alert-primary{ border-#{$dlab-pos-left}: 0.25rem solid var(--primary); } .alert-alt.alert-secondary{ border-#{$dlab-pos-left}: 0.25rem solid $secondary; } .alert-alt.alert-success{ border-#{$dlab-pos-left}: 0.25rem solid $success } .alert-alt.alert-warning{ border-#{$dlab-pos-left}: 0.25rem solid $warning; } .alert-alt.alert-danger{ border-#{$dlab-pos-left}: 0.25rem solid $danger; } .alert-alt.alert-info{ border-#{$dlab-pos-left}: 0.25rem solid $info; } .alert-alt.alert-dark{ border-#{$dlab-pos-left}: 0.25rem solid $dark; } .alert-alt.alert-light{ border-#{$dlab-pos-left}: 0.25rem solid darken($light,15%); } // Alert alt with solid color .alert-alt.alert-primary.solid{ border-#{$dlab-pos-left}: 0.25rem solid var(--primary-dark)!important; } .alert-alt.alert-secondary.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($secondary,25%)!important; } .alert-alt.alert-success.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($success, 25%)!important; } .alert-alt.alert-warning.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($warning,25%)!important; } .alert-alt.alert-danger.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($danger,25%)!important; } .alert-alt.alert-info.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($info,25%)!important; } .alert-alt.alert-dark.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($dark,25%)!important; } .alert-alt.alert-light.solid{ border-#{$dlab-pos-left}: 0.25rem solid darken($light,25%)!important; } //Alert dismissable with solid color .alert-dismissible.solid:not(.alert-light), .alert-social{ .btn-close{ color: $white; opacity: 1; // &:hover{ // color: $white; // } } } .alert-dismissible .btn-close{ padding: .85rem 1rem; } .alert-icon{ height: 1.25rem; width: 1.25rem; margin-#{$dlab-pos-right}: .25rem; } // Alert Solid .alert.alert-primary.solid{ background: var(--primary); color: $white; border-color: var(--primary); } .alert.alert-secondary.solid{ background: $secondary; color: $white; border-color: $secondary; } .alert.alert-success.solid{ background: $success; color: $white; border-color: $success; } .alert.alert-warning.solid{ background: $warning; color: $white; border-color: $warning; } .alert.alert-danger.solid{ background: $danger; color: $white; border-color: $danger; } .alert.alert-info.solid{ background: $info; color: $white; border-color: $info; } .alert.alert-dark.solid{ background: $dark; color: $white; border-color: $dark; } .alert.alert-light.solid{ background: $light; color: $dark; border-color: $light; } // Alert right icon .alert-right-icon{ &>span i{ font-size: 1.125rem; margin-#{$dlab-pos-right}: 0.3125rem; } .close{ i{ font-size: 1rem; } } } // Alert Outline .alert.alert-outline-primary{ background: transparent; color: var(--primary); border-color: var(--primary); } .alert.alert-outline-secondary{ background: transparent; color: $body-color; border-color: $secondary; } .alert.alert-outline-success{ background: transparent; color: $success; border-color: $success; } .alert.alert-outline-info{ background: transparent; color: $info; border-color: $info; } .alert.alert-outline-warning{ background: transparent; color: $warning; border-color: $warning; } .alert.alert-outline-danger{ background: transparent; color: $danger; border-color: $danger; } .alert.alert-outline-dark{ background: transparent; color: $body-color; border-color: $dark; } .alert.alert-outline-light{ background: transparent; color: $dark; border-color: $light; } // Alert Social .alert-social{ color: $white; .alert-social-icon{ align-self: center; margin-#{$dlab-pos-right}: 0.9375rem; i{ font-size: 2.625rem; } } &.facebook{ background-color: $facebook; } &.twitter{ background-color: $twitter; } &.linkedin{ background-color: $linkedin; } &.google-plus{ background-color: $google-plus; } .close{ &:hover{ opacity: 1!important; color: $white!important; } } } // Alert left icon .left-icon-big{ .alert-left-icon-big{ align-self: center; margin-#{$dlab-pos-right}: 0.9375rem; i{ font-size: 2.1875rem; line-height: 1; } } } div:where(.swal2-container) div:where(.swal2-popup){ background: var(--card)!important; color: var(--text-dark)!important; } .alert-dismissible .btn-close{ top: 0; #{$dlab-pos-right}: 0; #{$dlab-pos-left}: auto; }