MyCrypto/common/sass/styles/overrides/alerts.scss

59 lines
1.1 KiB
SCSS
Raw Normal View History

// Extends Bootstrap's `.alert`
@import "common/sass/variables";
@import "common/sass/mixins";
@import "~bootstrap-sass/assets/stylesheets/bootstrap/alerts";
.alert {
margin-bottom: 1rem;
a {
color: #FFF;
font-weight: normal;
text-decoration: underline;
&:hover {
color: #FFF;
opacity: 0.8;
}
}
}
// Alert icons
.alert:after {
content: '';
background-position: 50%;
background-repeat: no-repeat;
background-size: contain;
display: block;
color: #fff;
position: absolute;
top: 0;
bottom: 0;
left: 1%;
width: $space * 2;
@media screen and (max-width: $screen-sm) {
left: 3%;
}
@media screen and (max-width: $screen-xs) {
left: 1%;
}
}
.alert,
.alert-info {
@include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text);
}
.alert-success {
@include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text);
}
.alert-warning {
@include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text);
}
.alert-danger {
@include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text);
}