less/bootstrap/alerts.less

   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 }