Mercurial > wikked
comparison static/bootstrap/less/alerts.less @ 149:d29e2f337b00
Updated to Bootstrap 3.0.
author | Ludovic Chabant <ludovic@chabant.com> |
---|---|
date | Thu, 12 Dec 2013 21:54:04 -0800 |
parents | 130eccd396d8 |
children |
comparison
equal
deleted
inserted
replaced
148:f02e049d6546 | 149:d29e2f337b00 |
---|---|
5 | 5 |
6 // Base styles | 6 // Base styles |
7 // ------------------------- | 7 // ------------------------- |
8 | 8 |
9 .alert { | 9 .alert { |
10 padding: 8px 35px 8px 14px; | 10 padding: @alert-padding; |
11 margin-bottom: @baseLineHeight; | 11 margin-bottom: @line-height-computed; |
12 text-shadow: 0 1px 0 rgba(255,255,255,.5); | 12 border: 1px solid transparent; |
13 background-color: @warningBackground; | 13 border-radius: @alert-border-radius; |
14 border: 1px solid @warningBorder; | 14 |
15 .border-radius(@baseBorderRadius); | 15 // Headings for larger alerts |
16 } | 16 h4 { |
17 .alert, | 17 margin-top: 0; |
18 .alert h4 { | 18 // Specified for the h4 to prevent conflicts of changing @headings-color |
19 // Specified for the h4 to prevent conflicts of changing @headingsColor | 19 color: inherit; |
20 color: @warningText; | 20 } |
21 } | 21 // Provide class for links that match alerts |
22 .alert h4 { | 22 .alert-link { |
23 margin: 0; | 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 > p + p { | |
32 margin-top: 5px; | |
33 } | |
24 } | 34 } |
25 | 35 |
26 // Adjust close link position | 36 // Dismissable alerts |
27 .alert .close { | 37 // |
28 position: relative; | 38 // Expand the right padding and account for the close button's positioning. |
29 top: -2px; | 39 |
30 right: -21px; | 40 .alert-dismissable { |
31 line-height: @baseLineHeight; | 41 padding-right: (@alert-padding + 20); |
42 | |
43 // Adjust close link position | |
44 .close { | |
45 position: relative; | |
46 top: -2px; | |
47 right: -21px; | |
48 color: inherit; | |
49 } | |
32 } | 50 } |
33 | 51 |
34 | |
35 // Alternate styles | 52 // Alternate styles |
36 // ------------------------- | 53 // |
54 // Generate contextual modifier classes for colorizing the alert. | |
37 | 55 |
38 .alert-success { | 56 .alert-success { |
39 background-color: @successBackground; | 57 .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text); |
40 border-color: @successBorder; | |
41 color: @successText; | |
42 } | |
43 .alert-success h4 { | |
44 color: @successText; | |
45 } | |
46 .alert-danger, | |
47 .alert-error { | |
48 background-color: @errorBackground; | |
49 border-color: @errorBorder; | |
50 color: @errorText; | |
51 } | |
52 .alert-danger h4, | |
53 .alert-error h4 { | |
54 color: @errorText; | |
55 } | 58 } |
56 .alert-info { | 59 .alert-info { |
57 background-color: @infoBackground; | 60 .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text); |
58 border-color: @infoBorder; | |
59 color: @infoText; | |
60 } | 61 } |
61 .alert-info h4 { | 62 .alert-warning { |
62 color: @infoText; | 63 .alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text); |
63 } | 64 } |
64 | 65 .alert-danger { |
65 | 66 .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text); |
66 // Block alerts | |
67 // ------------------------- | |
68 | |
69 .alert-block { | |
70 padding-top: 14px; | |
71 padding-bottom: 14px; | |
72 } | 67 } |
73 .alert-block > p, | |
74 .alert-block > ul { | |
75 margin-bottom: 0; | |
76 } | |
77 .alert-block p + p { | |
78 margin-top: 5px; | |
79 } |