Allow the vertical rhythm to adjust to half lines when -to-nearest-half-line is set to true in order to avoid awkwardly large gaps between lines. This setting is false by default.

This commit is contained in:
Chris Eppstein 2011-12-17 17:32:13 -08:00
parent 57dcbad3ae
commit fdfca46d28
2 changed files with 17 additions and 2 deletions

View File

@ -14,6 +14,14 @@ The Documentation for the [latest stable release](http://compass-style.org/docs/
The Documentation for the [latest preview release](http://beta.compass-style.org/) The Documentation for the [latest preview release](http://beta.compass-style.org/)
0.12.alpha.3 (UNRELEASED)
-------------------------
* The `$round-to-nearest-half-line` config variable was added. When
true, the vertical rhythm module will round line heights to the
nearest half-line to avoid awkwardly large gaps between lines of text.
Defaults to false.
0.12.alpha.2 (11/28/2011) 0.12.alpha.2 (11/28/2011)
------------------------- -------------------------

View File

@ -15,6 +15,11 @@ $ie-font-ratio: 16px / 100%;
// Set to false if you want to use absolute pixes in sizing your typography. // Set to false if you want to use absolute pixes in sizing your typography.
$relative-font-sizing: true !default; $relative-font-sizing: true !default;
// Allows the `adjust-font-size-to` mixin and the `lines-for-font-size` function
// to round the line height to the nearest half line height instead of the
// nearest integral line height to avoid large spacing between lines.
$round-to-nearest-half-line: false !default;
// Ensure there is at least this many pixels // Ensure there is at least this many pixels
// of vertical padding above and below the text. // of vertical padding above and below the text.
$min-line-padding: 2px; $min-line-padding: 2px;
@ -103,9 +108,11 @@ $base-half-leader: $base-leader / 2;
} }
@function lines-for-font-size($font-size) { @function lines-for-font-size($font-size) {
$lines: ceil($font-size / $base-line-height); $lines: if($round-to-nearest-half-line,
ceil(2 * $font-size / $base-line-height) / 2,
ceil($font-size / $base-line-height));
@if $lines * $base-line-height - $font-size < $min-line-padding * 2 { @if $lines * $base-line-height - $font-size < $min-line-padding * 2 {
$lines: $lines + 1; $lines: $lines + if($round-to-nearest-half-line, 0.5, 1);
} }
@return $lines; @return $lines;
} }