1 | @import "mixins/components.alerts";
|
2 |
|
3 | .c-alerts {
|
4 | display: block;
|
5 | position: absolute;
|
6 | width: $alerts-width;
|
7 | max-height: 100%;
|
8 | background-color: $alerts-background-color;
|
9 | z-index: $alerts-z-index;
|
10 | overflow-y: auto;
|
11 | }
|
12 |
|
13 | .c-alerts--topleft {
|
14 | top: $alerts-margin;
|
15 | left: $alerts-margin;
|
16 | }
|
17 |
|
18 | .c-alerts--topright {
|
19 | top: $alerts-margin;
|
20 | right: $alerts-margin;
|
21 | }
|
22 |
|
23 | .c-alerts--bottomleft {
|
24 | bottom: 0;
|
25 | left: $alerts-margin;
|
26 | }
|
27 |
|
28 | .c-alerts--bottomright {
|
29 | right: $alerts-margin;
|
30 | bottom: 0;
|
31 | }
|
32 |
|
33 | .c-alert {
|
34 | @include alert-color;
|
35 | position: relative;
|
36 | margin: $alert-margin;
|
37 | padding: $alert-padding;
|
38 | border-radius: $alert-border-radius;
|
39 | }
|
40 |
|
41 | .c-alert--brand {
|
42 | @include alert-color($alert-brand-background-color);
|
43 | }
|
44 |
|
45 | .c-alert--info {
|
46 | @include alert-color($alert-info-background-color);
|
47 | }
|
48 |
|
49 | .c-alert--warning {
|
50 | @include alert-color($alert-warning-background-color);
|
51 | }
|
52 |
|
53 | .c-alert--success {
|
54 | @include alert-color($alert-success-background-color);
|
55 | }
|
56 |
|
57 | .c-alert--error {
|
58 | @include alert-color($alert-error-background-color);
|
59 | }
|