コンパスの垂直リズム モジュールを適用すると、見出しが長すぎて 1 行に収まらない場合、$base-line-height 変数の値に従うため、行の高さが大きすぎるように見えるという問題がありました。一般的には、経験則に従うべきだと思います。見出しが大きいほど、行の高さが小さくなります。
特定の見出しのフォント サイズよりも $base-line-height を使用することを提案している記事を見つけました。Adjust-font-size-to および Adjust-leading-to mixin に基づいて、修正版を作成しました。
@mixin adjust-headline-size-to($to-size, $lines: lines-for-font-size($to-size), $from-size: $base-font-size) {
@if not $relative-font-sizing and $from-size != $base-font-size {
@warn "$relative-font-sizing is false but a relative font size was passed to adjust-font-size-to";
}
font-size: $font-unit * $to-size / $from-size;
@include adjust-headline-leading-to(if($relative-font-sizing, $to-size, $base-line-height));
}
@mixin adjust-headline-leading-to($to-size) {
line-height: $base-line-height / $to-size;
}
それはきれいな修正ですか?以下に基づいて、adjust-headline-leading-to の (if($relative-font-sizing, $to-size, $base-line-height)) ステートメントに問題があります。
@mixin adjust-leading-to($lines, $font-size: $base-font-size) {
line-height: rhythm($lines, $font-size);
}
小さなテストケースからの出力はしっかりしているように見えますが、注意して、Adjust-headline-size-to と Adjust-headline-leading-to に目に見える重大な間違いがないかどうかを確認したいと思いましたか? よろしくラルフ