diff options
Diffstat (limited to 'css/bootstrap/alerts.less')
-rw-r--r-- | css/bootstrap/alerts.less | 90 |
1 files changed, 46 insertions, 44 deletions
diff --git a/css/bootstrap/alerts.less b/css/bootstrap/alerts.less index 6df5fd7..3eab066 100644 --- a/css/bootstrap/alerts.less +++ b/css/bootstrap/alerts.less @@ -7,59 +7,61 @@ // ------------------------- .alert { - padding: 8px 35px 8px 14px; - margin-bottom: @baseLineHeight; - text-shadow: 0 1px 0 rgba(255,255,255,.5); - background-color: @warningBackground; - border: 1px solid @warningBorder; - .border-radius(4px); - color: @warningText; -} -.alert h4 { - margin: 0; -} + padding: @alert-padding; + margin-bottom: @line-height-computed; + border: 1px solid transparent; + border-radius: @alert-border-radius; -// Adjust close link position -.alert .close { - position: relative; - top: -2px; - right: -21px; - line-height: @baseLineHeight; + // Headings for larger alerts + h4 { + margin-top: 0; + // Specified for the h4 to prevent conflicts of changing @headings-color + color: inherit; + } + // Provide class for links that match alerts + .alert-link { + font-weight: @alert-link-font-weight; + } + + // Improve alignment and spacing of inner content + > p, + > ul { + margin-bottom: 0; + } + > p + p { + margin-top: 5px; + } } +// Dismissable alerts +// +// Expand the right padding and account for the close button's positioning. + +.alert-dismissable { + padding-right: (@alert-padding + 20); + + // Adjust close link position + .close { + position: relative; + top: -2px; + right: -21px; + color: inherit; + } +} // Alternate styles -// ------------------------- +// +// Generate contextual modifier classes for colorizing the alert. .alert-success { - background-color: @successBackground; - border-color: @successBorder; - color: @successText; -} -.alert-danger, -.alert-error { - background-color: @errorBackground; - border-color: @errorBorder; - color: @errorText; + .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text); } .alert-info { - background-color: @infoBackground; - border-color: @infoBorder; - color: @infoText; -} - - -// Block alerts -// ------------------------- - -.alert-block { - padding-top: 14px; - padding-bottom: 14px; + .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text); } -.alert-block > p, -.alert-block > ul { - margin-bottom: 0; +.alert-warning { + .alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text); } -.alert-block p + p { - margin-top: 5px; +.alert-danger { + .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text); } |