// --------------------------------------------------
+// Headings
+// -------------------------
+
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6 {
+ font-family: @headings-font-family;
+ font-weight: @headings-font-weight;
+ line-height: @headings-line-height;
+ color: @headings-color;
+
+ small,
+ .small {
+ font-weight: normal;
+ line-height: 1;
+ color: @headings-small-color;
+ }
+}
+
+h1,
+h2,
+h3 {
+ margin-top: @line-height-computed;
+ margin-bottom: (@line-height-computed / 2);
+
+ small,
+ .small {
+ font-size: 65%;
+ }
+}
+h4,
+h5,
+h6 {
+ margin-top: (@line-height-computed / 2);
+ margin-bottom: (@line-height-computed / 2);
+
+ small,
+ .small {
+ font-size: 75%;
+ }
+}
+
+h1, .h1 { font-size: @font-size-h1; }
+h2, .h2 { font-size: @font-size-h2; }
+h3, .h3 { font-size: @font-size-h3; }
+h4, .h4 { font-size: @font-size-h4; }
+h5, .h5 { font-size: @font-size-h5; }
+h6, .h6 { font-size: @font-size-h6; }
+
+
// Body text
// -------------------------
p {
margin: 0 0 (@line-height-computed / 2);
}
+
.lead {
margin-bottom: @line-height-computed;
- font-size: (@font-size-base * 1.15);
+ font-size: floor(@font-size-base * 1.15);
font-weight: 200;
line-height: 1.4;
- @media (min-width: 768px) {
+ @media (min-width: @screen-sm-min) {
font-size: (@font-size-base * 1.5);
}
}
// -------------------------
// Ex: 14px base font * 85% = about 12px
-small { font-size: 85%; }
+small,
+.small { font-size: 85%; }
// Undo browser default styling
cite { font-style: normal; }
// Contextual emphasis
-.text-muted { color: @text-muted; }
-.text-primary { color: @brand-primary; }
-.text-warning { color: @state-warning-text; }
-.text-danger { color: @state-danger-text; }
-.text-success { color: @state-success-text; }
-.text-info { color: @state-info-text; }
-
-// Alignment
-.text-left { text-align: left; }
-.text-right { text-align: right; }
-.text-center { text-align: center; }
-
-
-// Headings
-// -------------------------
-
-h1, h2, h3, h4, h5, h6,
-.h1, .h2, .h3, .h4, .h5, .h6 {
- font-family: @headings-font-family;
- font-weight: @headings-font-weight;
- line-height: @headings-line-height;
- small {
- font-weight: normal;
- line-height: 1;
- color: @headings-small-color;
+.text-muted {
+ color: @text-muted;
+}
+.text-primary {
+ color: @brand-primary;
+ &:hover {
+ color: darken(@brand-primary, 10%);
}
}
-
-h1,
-h2,
-h3 {
- margin-top: @line-height-computed;
- margin-bottom: (@line-height-computed / 2);
+.text-warning {
+ color: @state-warning-text;
+ &:hover {
+ color: darken(@state-warning-text, 10%);
+ }
}
-h4,
-h5,
-h6 {
- margin-top: (@line-height-computed / 2);
- margin-bottom: (@line-height-computed / 2);
+.text-danger {
+ color: @state-danger-text;
+ &:hover {
+ color: darken(@state-danger-text, 10%);
+ }
+}
+.text-success {
+ color: @state-success-text;
+ &:hover {
+ color: darken(@state-success-text, 10%);
+ }
+}
+.text-info {
+ color: @state-info-text;
+ &:hover {
+ color: darken(@state-info-text, 10%);
+ }
}
-h1, .h1 { font-size: floor(@font-size-base * 2.60); } // ~36px
-h2, .h2 { font-size: floor(@font-size-base * 2.15); } // ~30px
-h3, .h3 { font-size: ceil(@font-size-base * 1.70); } // ~24px
-h4, .h4 { font-size: ceil(@font-size-base * 1.25); } // ~18px
-h5, .h5 { font-size: @font-size-base; }
-h6, .h6 { font-size: ceil(@font-size-base * 0.85); } // ~12px
-
-h1 small, .h1 small { font-size: ceil(@font-size-base * 1.70); } // ~24px
-h2 small, .h2 small { font-size: ceil(@font-size-base * 1.25); } // ~18px
-h3 small, .h3 small,
-h4 small, .h4 small { font-size: @font-size-base; }
+// Alignment
+.text-left { text-align: left; }
+.text-right { text-align: right; }
+.text-center { text-align: center; }
// Page header
}
-
// Lists
// --------------------------------------------------
margin-top: 0;
margin-bottom: (@line-height-computed / 2);
ul,
- ol{
+ ol {
margin-bottom: 0;
}
}
padding-left: 0;
list-style: none;
}
+
// Inline turns list items into inline-block
.list-inline {
.list-unstyled();
+
> li {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
+
+ &:first-child {
+ padding-left: 0;
+ }
}
}
// Description Lists
dl {
+ margin-top: 0; // Remove browser default
margin-bottom: @line-height-computed;
}
dt,
// Abbreviations and acronyms
abbr[title],
-// Added data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
+// Add data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
abbr[data-original-title] {
cursor: help;
border-bottom: 1px dotted @abbr-border-color;
}
-abbr.initialism {
+.initialism {
font-size: 90%;
text-transform: uppercase;
}
p:last-child {
margin-bottom: 0;
}
- small {
+ small,
+ .small {
display: block;
line-height: @line-height-base;
color: @blockquote-small-color;
&:before {
- content: '\2014 \00A0';// EM DASH, NBSP
+ content: '\2014 \00A0'; // EM DASH, NBSP
}
}
border-right: 5px solid @blockquote-border-color;
border-left: 0;
p,
- small {
+ small,
+ .small {
text-align: right;
}
- small {
+ small,
+ .small {
&:before {
content: '';
}
&:after {
- content: '\00A0 \2014';// NBSP, EM DASH
+ content: '\00A0 \2014'; // NBSP, EM DASH
}
}
}
}
// Quotes
-q:before,
-q:after,
blockquote:before,
blockquote:after {
content: "";
// Addresses
address {
- display: block;
margin-bottom: @line-height-computed;
font-style: normal;
line-height: @line-height-base;