From af871d57c9eeb4ce1cdafd63c983bf706a89bec0 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 22 Sep 2012 22:16:12 -0700 Subject: [PATCH] fixes #5216: calculate heading sizes via math rather than fixed pixel amounts --- docs/assets/css/bootstrap.css | 28 ++++++++++++++-------------- less/type.less | 27 ++++++++++++++++----------- 2 files changed, 30 insertions(+), 25 deletions(-) diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 0973e4e323..fe577b8da1 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -655,7 +655,7 @@ h6 { margin: 10px 0; font-family: inherit; font-weight: bold; - line-height: 1; + line-height: 20px; color: inherit; text-rendering: optimizelegibility; } @@ -671,42 +671,42 @@ h6 small { color: #999999; } -h1 { - font-size: 36px; +h1, +h2, +h3 { line-height: 40px; } +h1 { + font-size: 38.5px; +} + h2 { - font-size: 30px; - line-height: 40px; + font-size: 31.5px; } h3 { - font-size: 24px; - line-height: 40px; + font-size: 24.5px; } h4 { - font-size: 18px; - line-height: 20px; + font-size: 17.5px; } h5 { font-size: 14px; - line-height: 20px; } h6 { - font-size: 12px; - line-height: 20px; + font-size: 11.9px; } h1 small { - font-size: 24px; + font-size: 24.5px; } h2 small { - font-size: 18px; + font-size: 17.5px; } h3 small { diff --git a/less/type.less b/less/type.less index 512ead99ee..3a05bcf0db 100644 --- a/less/type.less +++ b/less/type.less @@ -57,7 +57,7 @@ h1, h2, h3, h4, h5, h6 { margin: (@baseLineHeight / 2) 0; font-family: @headingsFontFamily; font-weight: @headingsFontWeight; - line-height: 1; + line-height: @baseLineHeight; color: @headingsColor; text-rendering: optimizelegibility; // Fix the character spacing for headings small { @@ -66,17 +66,22 @@ h1, h2, h3, h4, h5, h6 { color: @grayLight; } } -h1 { font-size: 36px; line-height: 40px; } -h2 { font-size: 30px; line-height: 40px; } -h3 { font-size: 24px; line-height: 40px; } -h4 { font-size: 18px; line-height: 20px; } -h5 { font-size: 14px; line-height: 20px; } -h6 { font-size: 12px; line-height: 20px; } -h1 small { font-size: 24px; } -h2 small { font-size: 18px; } -h3 small { font-size: 14px; } -h4 small { font-size: 14px; } +h1, +h2, +h3 { line-height: @baseLineHeight * 2; } + +h1 { font-size: @baseFontSize * 2.75; } // ~38px +h2 { font-size: @baseFontSize * 2.25; } // ~32px +h3 { font-size: @baseFontSize * 1.75; } // ~24px +h4 { font-size: @baseFontSize * 1.25; } // ~18px +h5 { font-size: @baseFontSize; } +h6 { font-size: @baseFontSize * .85; } // ~12px + +h1 small { font-size: @baseFontSize * 1.75; } // ~24px +h2 small { font-size: @baseFontSize * 1.25; } // ~18px +h3 small { font-size: @baseFontSize; } +h4 small { font-size: @baseFontSize; } // Page header