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