[Summary view] [Print] [Text view]

   1  //
   2  // Typography
   3  // --------------------------------------------------
   4  
   5  
   6  // Body text
   7  // -------------------------
   8  
   9  p {
  10    margin: 0 0 @baseLineHeight / 2;
  11  }
  12  .lead {
  13    margin-bottom: @baseLineHeight;
  14    font-size: @baseFontSize * 1.5;
  15    font-weight: 200;
  16    line-height: @baseLineHeight * 1.5;
  17  }
  18  
  19  
  20  // Emphasis & misc
  21  // -------------------------
  22  
  23  // Ex: 14px base font * 85% = about 12px
  24  small   { font-size: 85%; }
  25  
  26  strong  { font-weight: bold; }
  27  em      { font-style: italic; }
  28  cite    { font-style: normal; }
  29  
  30  // Utility classes
  31  .muted               { color: @grayLight; }
  32  a.muted:hover,
  33  a.muted:focus        { color: darken(@grayLight, 10%); }
  34  
  35  .text-warning        { color: @warningText; }
  36  a.text-warning:hover,
  37  a.text-warning:focus { color: darken(@warningText, 10%); }
  38  
  39  .text-error          { color: @errorText; }
  40  a.text-error:hover,
  41  a.text-error:focus   { color: darken(@errorText, 10%); }
  42  
  43  .text-info           { color: @infoText; }
  44  a.text-info:hover,
  45  a.text-info:focus    { color: darken(@infoText, 10%); }
  46  
  47  .text-success        { color: @successText; }
  48  a.text-success:hover,
  49  a.text-success:focus { color: darken(@successText, 10%); }
  50  
  51  .text-left           { text-align: left; }
  52  .text-right          { text-align: right; }
  53  .text-center         { text-align: center; }
  54  
  55  
  56  // Headings
  57  // -------------------------
  58  
  59  h1, h2, h3, h4, h5, h6 {
  60    margin: (@baseLineHeight / 2) 0;
  61    font-family: @headingsFontFamily;
  62    font-weight: @headingsFontWeight;
  63    line-height: @baseLineHeight;
  64    color: @headingsColor;
  65    text-rendering: optimizelegibility; // Fix the character spacing for headings
  66    small {
  67      font-weight: normal;
  68      line-height: 1;
  69      color: @grayLight;
  70    }
  71  }
  72  
  73  h1,
  74  h2,
  75  h3 { line-height: @baseLineHeight * 2; }
  76  
  77  h1 { font-size: @baseFontSize * 2.75; } // ~38px
  78  h2 { font-size: @baseFontSize * 2.25; } // ~32px
  79  h3 { font-size: @baseFontSize * 1.75; } // ~24px
  80  h4 { font-size: @baseFontSize * 1.25; } // ~18px
  81  h5 { font-size: @baseFontSize; }
  82  h6 { font-size: @baseFontSize * 0.85; } // ~12px
  83  
  84  h1 small { font-size: @baseFontSize * 1.75; } // ~24px
  85  h2 small { font-size: @baseFontSize * 1.25; } // ~18px
  86  h3 small { font-size: @baseFontSize; }
  87  h4 small { font-size: @baseFontSize; }
  88  
  89  
  90  // Page header
  91  // -------------------------
  92  
  93  .page-header {
  94    padding-bottom: (@baseLineHeight / 2) - 1;
  95    margin: @baseLineHeight 0 (@baseLineHeight * 1.5);
  96    border-bottom: 1px solid @grayLighter;
  97  }
  98  
  99  
 100  
 101  // Lists
 102  // --------------------------------------------------
 103  
 104  // Unordered and Ordered lists
 105  ul, ol {
 106    padding: 0;
 107    margin: 0 0 @baseLineHeight / 2 25px;
 108  }
 109  ul ul,
 110  ul ol,
 111  ol ol,
 112  ol ul {
 113    margin-bottom: 0;
 114  }
 115  li {
 116    line-height: @baseLineHeight;
 117  }
 118  
 119  // Remove default list styles
 120  ul.unstyled,
 121  ol.unstyled {
 122    margin-left: 0;
 123    list-style: none;
 124  }
 125  
 126  // Single-line list items
 127  ul.inline,
 128  ol.inline {
 129    margin-left: 0;
 130    list-style: none;
 131    > li {
 132      display: inline-block;
 133      .ie7-inline-block();
 134      padding-left: 5px;
 135      padding-right: 5px;
 136    }
 137  }
 138  
 139  // Description Lists
 140  dl {
 141    margin-bottom: @baseLineHeight;
 142  }
 143  dt,
 144  dd {
 145    line-height: @baseLineHeight;
 146  }
 147  dt {
 148    font-weight: bold;
 149  }
 150  dd {
 151    margin-left: @baseLineHeight / 2;
 152  }
 153  // Horizontal layout (like forms)
 154  .dl-horizontal {
 155    .clearfix(); // Ensure dl clears floats if empty dd elements present
 156    dt {
 157      float: left;
 158      width: @horizontalComponentOffset - 20;
 159      clear: left;
 160      text-align: right;
 161      .text-overflow();
 162    }
 163    dd {
 164      margin-left: @horizontalComponentOffset;
 165    }
 166  }
 167  
 168  // MISC
 169  // ----
 170  
 171  // Horizontal rules
 172  hr {
 173    margin: @baseLineHeight 0;
 174    border: 0;
 175    border-top: 1px solid @hrBorder;
 176    border-bottom: 1px solid @white;
 177  }
 178  
 179  // Abbreviations and acronyms
 180  abbr[title],
 181  // Added data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
 182  abbr[data-original-title] {
 183    cursor: help;
 184    border-bottom: 1px dotted @grayLight;
 185  }
 186  abbr.initialism {
 187    font-size: 90%;
 188    text-transform: uppercase;
 189  }
 190  
 191  // Blockquotes
 192  blockquote {
 193    padding: 0 0 0 15px;
 194    margin: 0 0 @baseLineHeight;
 195    border-left: 5px solid @grayLighter;
 196    p {
 197      margin-bottom: 0;
 198      font-size: @baseFontSize * 1.25;
 199      font-weight: 300;
 200      line-height: 1.25;
 201    }
 202    small {
 203      display: block;
 204      line-height: @baseLineHeight;
 205      color: @grayLight;
 206      &:before {
 207        content: '\2014 \00A0';
 208      }
 209    }
 210  
 211    // Float right with text-align: right
 212    &.pull-right {
 213      float: right;
 214      padding-right: 15px;
 215      padding-left: 0;
 216      border-right: 5px solid @grayLighter;
 217      border-left: 0;
 218      p,
 219      small {
 220        text-align: right;
 221      }
 222      small {
 223        &:before {
 224          content: '';
 225        }
 226        &:after {
 227          content: '\00A0 \2014';
 228        }
 229      }
 230    }
 231  }
 232  
 233  // Quotes
 234  q:before,
 235  q:after,
 236  blockquote:before,
 237  blockquote:after {
 238    content: "";
 239  }
 240  
 241  // Addresses
 242  address {
 243    display: block;
 244    margin-bottom: @baseLineHeight;
 245    font-style: normal;
 246    line-height: @baseLineHeight;
 247  }