KNACSS/sass/components/_alerts.scss

54 lines
948 B
SCSS
Raw Permalink Normal View History

2017-07-31 13:24:04 +02:00
/* ----------------------------- */
/* ==Alerts */
/* ----------------------------- */
2017-07-31 16:01:20 +02:00
/* use .alert-- classes for variants */
.alert {
padding: $spacer-small $spacer-small;
2017-07-31 16:01:20 +02:00
margin-top: 0.75em;
margin-bottom: 0;
color: $color-base;
border-radius: $border-radius;
background-color: $color-muted;
& a {
color: inherit;
text-decoration: underline;
}
}
.alert {
@each $name, $background-color, $color, $border in $variants-list {
&--#{$name} {
@extend .alert;
background-color: $background-color;
color: $color;
box-shadow: $border;
}
}
}
2017-07-31 16:02:22 +02:00
// alert state variants
.alert {
2017-07-31 16:01:20 +02:00
&--small {
font-size: $font-size-base - 0.4rem;
2017-07-31 16:01:20 +02:00
}
&--big {
font-size: $font-size-base + 0.4rem;
2017-07-31 16:01:20 +02:00
}
&--block {
width: 100% !important;
display: block;
}
&.disabled,
&--disabled {
opacity: 0.5;
cursor: not-allowed;
}
&:empty {
display: none;
}
}