info@54: // info@54: // Typography info@54: // -------------------------------------------------- info@54: info@54: info@54: // Headings info@54: // ------------------------- info@54: info@54: h1, h2, h3, h4, h5, h6, info@54: .h1, .h2, .h3, .h4, .h5, .h6 { info@54: font-family: @headings-font-family; info@54: font-weight: @headings-font-weight; info@54: line-height: @headings-line-height; info@54: color: @headings-color; info@54: info@54: small, info@54: .small { info@54: font-weight: normal; info@54: line-height: 1; info@54: color: @headings-small-color; info@54: } info@54: } info@54: info@54: h1, info@54: h2, info@54: h3 { info@54: margin-top: @line-height-computed; info@54: margin-bottom: (@line-height-computed / 2); info@54: info@54: small, info@54: .small { info@54: font-size: 65%; info@54: } info@54: } info@54: h4, info@54: h5, info@54: h6 { info@54: margin-top: (@line-height-computed / 2); info@54: margin-bottom: (@line-height-computed / 2); info@54: info@54: small, info@54: .small { info@54: font-size: 75%; info@54: } info@54: } info@54: info@54: h1, .h1 { font-size: @font-size-h1; } info@54: h2, .h2 { font-size: @font-size-h2; } info@54: h3, .h3 { font-size: @font-size-h3; } info@54: h4, .h4 { font-size: @font-size-h4; } info@54: h5, .h5 { font-size: @font-size-h5; } info@54: h6, .h6 { font-size: @font-size-h6; } info@54: info@54: info@54: // Body text info@54: // ------------------------- info@54: info@54: p { info@54: margin: 0 0 (@line-height-computed / 2); info@54: } info@54: info@54: .lead { info@54: margin-bottom: @line-height-computed; info@54: font-size: floor(@font-size-base * 1.15); info@54: font-weight: 200; info@54: line-height: 1.4; info@54: info@54: @media (min-width: @screen-sm-min) { info@54: font-size: (@font-size-base * 1.5); info@54: } info@54: } info@54: info@54: info@54: // Emphasis & misc info@54: // ------------------------- info@54: info@54: // Ex: 14px base font * 85% = about 12px info@54: small, info@54: .small { font-size: 85%; } info@54: info@54: // Undo browser default styling info@54: cite { font-style: normal; } info@54: info@54: // Contextual emphasis info@54: .text-muted { info@54: color: @text-muted; info@54: } info@54: .text-primary { info@54: color: @brand-primary; info@54: &:hover { info@54: color: darken(@brand-primary, 10%); info@54: } info@54: } info@54: .text-warning { info@54: color: @state-warning-text; info@54: &:hover { info@54: color: darken(@state-warning-text, 10%); info@54: } info@54: } info@54: .text-danger { info@54: color: @state-danger-text; info@54: &:hover { info@54: color: darken(@state-danger-text, 10%); info@54: } info@54: } info@54: .text-success { info@54: color: @state-success-text; info@54: &:hover { info@54: color: darken(@state-success-text, 10%); info@54: } info@54: } info@54: .text-info { info@54: color: @state-info-text; info@54: &:hover { info@54: color: darken(@state-info-text, 10%); info@54: } info@54: } info@54: info@54: // Alignment info@54: .text-left { text-align: left; } info@54: .text-right { text-align: right; } info@54: .text-center { text-align: center; } info@54: info@54: info@54: // Page header info@54: // ------------------------- info@54: info@54: .page-header { info@54: padding-bottom: ((@line-height-computed / 2) - 1); info@54: margin: (@line-height-computed * 2) 0 @line-height-computed; info@54: border-bottom: 1px solid @page-header-border-color; info@54: } info@54: info@54: info@54: // Lists info@54: // -------------------------------------------------- info@54: info@54: // Unordered and Ordered lists info@54: ul, info@54: ol { info@54: margin-top: 0; info@54: margin-bottom: (@line-height-computed / 2); info@54: ul, info@54: ol { info@54: margin-bottom: 0; info@54: } info@54: } info@54: info@54: // List options info@54: info@54: // Unstyled keeps list items block level, just removes default browser padding and list-style info@54: .list-unstyled { info@54: padding-left: 0; info@54: list-style: none; info@54: } info@54: info@54: // Inline turns list items into inline-block info@54: .list-inline { info@54: .list-unstyled(); info@54: info@54: > li { info@54: display: inline-block; info@54: padding-left: 5px; info@54: padding-right: 5px; info@54: info@54: &:first-child { info@54: padding-left: 0; info@54: } info@54: } info@54: } info@54: info@54: // Description Lists info@54: dl { info@54: margin-top: 0; // Remove browser default info@54: margin-bottom: @line-height-computed; info@54: } info@54: dt, info@54: dd { info@54: line-height: @line-height-base; info@54: } info@54: dt { info@54: font-weight: bold; info@54: } info@54: dd { info@54: margin-left: 0; // Undo browser default info@54: } info@54: info@54: // Horizontal description lists info@54: // info@54: // Defaults to being stacked without any of the below styles applied, until the info@54: // grid breakpoint is reached (default of ~768px). info@54: info@54: @media (min-width: @grid-float-breakpoint) { info@54: .dl-horizontal { info@54: dt { info@54: float: left; info@54: width: (@component-offset-horizontal - 20); info@54: clear: left; info@54: text-align: right; info@54: .text-overflow(); info@54: } info@54: dd { info@54: margin-left: @component-offset-horizontal; info@54: .clearfix(); // Clear the floated `dt` if an empty `dd` is present info@54: } info@54: } info@54: } info@54: info@54: // MISC info@54: // ---- info@54: info@54: // Abbreviations and acronyms info@54: abbr[title], info@54: // Add data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257 info@54: abbr[data-original-title] { info@54: cursor: help; info@54: border-bottom: 1px dotted @abbr-border-color; info@54: } info@54: .initialism { info@54: font-size: 90%; info@54: text-transform: uppercase; info@54: } info@54: info@54: // Blockquotes info@54: blockquote { info@54: padding: (@line-height-computed / 2) @line-height-computed; info@54: margin: 0 0 @line-height-computed; info@54: border-left: 5px solid @blockquote-border-color; info@54: p { info@54: font-size: (@font-size-base * 1.25); info@54: font-weight: 300; info@54: line-height: 1.25; info@54: } info@54: p:last-child { info@54: margin-bottom: 0; info@54: } info@54: small, info@54: .small { info@54: display: block; info@54: line-height: @line-height-base; info@54: color: @blockquote-small-color; info@54: &:before { info@54: content: '\2014 \00A0'; // EM DASH, NBSP info@54: } info@54: } info@54: info@54: // Float right with text-align: right info@54: &.pull-right { info@54: padding-right: 15px; info@54: padding-left: 0; info@54: border-right: 5px solid @blockquote-border-color; info@54: border-left: 0; info@54: p, info@54: small, info@54: .small { info@54: text-align: right; info@54: } info@54: small, info@54: .small { info@54: &:before { info@54: content: ''; info@54: } info@54: &:after { info@54: content: '\00A0 \2014'; // NBSP, EM DASH info@54: } info@54: } info@54: } info@54: } info@54: info@54: // Quotes info@54: blockquote:before, info@54: blockquote:after { info@54: content: ""; info@54: } info@54: info@54: // Addresses info@54: address { info@54: margin-bottom: @line-height-computed; info@54: font-style: normal; info@54: line-height: @line-height-base; info@54: }