blob: 206ec3226a696c8594679f002804e033fd1ad1eb [file] [log] [blame]
Michael Landoefa037d2017-02-19 12:57:33 +02001//
2// Alerts
3// --------------------------------------------------
4
5// Base styles
6// -------------------------
7
8.alert {
9 padding: $alert-padding;
10 margin-bottom: $line-height-computed;
11 border: 1px solid transparent;
12 border-radius: $alert-border-radius;
13
14 // Headings for larger alerts
15 h4 {
16 margin-top: 0;
17 // Specified for the h4 to prevent conflicts of changing $headings-color
18 color: inherit;
19 }
20
21 // Provide class for links that match alerts
22 .alert-link {
23 font-weight: $alert-link-font-weight;
24 }
25
26 // Improve alignment and spacing of inner content
27 > p,
28 > ul {
29 margin-bottom: 0;
30 }
31
32 > p + p {
33 margin-top: 5px;
34 }
35}
36
37// Dismissible alerts
38//
39// Expand the right padding and account for the close button's positioning.
40
41.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0.
42.alert-dismissible {
43 padding-right: ($alert-padding + 20);
44
45 // Adjust close link position
46 .close {
47 position: relative;
48 top: -2px;
49 right: -21px;
50 color: inherit;
51 }
52}
53
54// Alternate styles
55//
56// Generate contextual modifier classes for colorizing the alert.
57
58.alert-success {
59 @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text);
60}
61
62.alert-info {
63 @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text);
64}
65
66.alert-warning {
67 @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text);
68}
69
70.alert-danger {
71 @include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text);
72}