git.roojs.org Git - bootswatch/blob - bower_components/bootstrap/less/alerts.less

   1 //
   2 // Alerts
   3 // --------------------------------------------------
   4
   5
   6 // Base styles
   7 // -------------------------
   8
   9 .alert {
  10   padding: 10px 35px 10px 15px;
  11   margin-bottom: @line-height-computed;
  12   color: @alert-text;
  13   background-color: @alert-bg;
  14   border: 1px solid @alert-border;
  15   border-radius: @alert-border-radius;
  16
  17   // Headings for larger alerts
  18   h4 {
  19     margin-top: 0;
  20     // Specified for the h4 to prevent conflicts of changing @headingsColor
  21     color: inherit;
  22   }
  23   // Match the hr to the border of the alert
  24   hr {
  25     border-top-color: darken(@alert-border, 5%);
  26   }
  27   // Provide class for links that match alerts
  28   .alert-link {
  29     font-weight: 500;
  30     color: darken(@alert-text, 10%);
  31   }
  32
  33   // Adjust close link position
  34   .close {
  35     position: relative;
  36     top: -2px;
  37     right: -21px;
  38     color: inherit;
  39   }
  40 }
  41
  42 // Alternate styles
  43 // -------------------------
  44
  45 .alert-success {
  46   .alert-variant(@alert-success-bg, @alert-success-border, @alert-success-text);
  47 }
  48 .alert-danger {
  49   .alert-variant(@alert-danger-bg, @alert-danger-border, @alert-danger-text);
  50 }
  51 .alert-info {
  52   .alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text);
  53 }
  54
  55 // Block alerts
  56 // -------------------------
  57
  58 .alert-block {
  59   padding-top: 15px;
  60   padding-bottom: 15px;
  61
  62   > p,
  63   > ul {
  64     margin-bottom: 0;
  65   }
  66   p + p {
  67     margin-top: 5px;
  68   }
  69 }