Jak skompresować pionowe rytmy Compass Rems zamiast Ems z fallback?

Question

Chcę to zrobić: http://www.youtube.com/watch?v=ls3Clk-kz3s, ale wynikowe rems (z zastępczym piksem) zamiast ems.

Wygląda na to, że ta jest dodana do kompasu i powinna jakoś działać, ale nie do końca dostaję to, czego potrzebuję, od http://compass-style.org/reference/compass/typography/vertical_rhythm/ do mojego pliku .scss-aby go utworzyć.

Gdybym tylko wziąć kod z https://gist.github.com/ry5n/2026666 jako wstawek (nawet bez Kompas w ogóle) i zastosowanie:

@include set-font-size() 

zamiast:

@include adjust-font-size-to() 

Działa pięknie z wartościami rem i cofnięcie px.

Ale jeśli tylko spróbuje użyć kompasu i iść z

$font-unit: 1rem; 
$relative-font-sizing: false; 

to działa, ale bez px awaryjnej.

Jeśli ktoś mógłby umieścić pełny kod .scss potrzebny do pionowego rytmu do pracy z Remsem, byłbym bardzo wdzięczny.

I dlaczego potrzebuję $ względnego rozmiaru czcionki: false, jeśli używam Rems? Co więcej, czy istnieją inne konkurencyjne filozofie w pionowym rytmie, niż uzyskiwanie tekstu w taki sposób? Który z nich wolisz i jaki jest twój przepływ pracy?

Dziękuję bardzo z góry.

Answer 1

Na razie te aktualizacje Kompasu pozostają w klejnocie przed wydaniem, a pasująca dokumentacja nie jest jeszcze dostępna na compass-style.org (nawet beta.compass-style.org). Aby korzystać z nowych funkcji, należy zainstalować najnowszy klejnot (0.13.alpha.4):

gem install compass --pre 

z nowym gem, pionowy rytm API jest nieco inna, głównie w jego konfigurowalnych zmiennych, jak na https://github.com/chriseppstein/compass/pull/896. W skrócie, ustawić rozmiar i linii czcionki bazowej wysokość i ustawić nową zmienną rytm jednostkową dolarów rem:

zmienny rytm jednostka

$base-font-size: 16px; 
$base-line-height: 24px; 
$rhythm-unit: 'rem'; 

$ zastępuje $ font-jednostki i $ względnego font-zaklejanie jest teraz prywatną, wewnętrzną rzeczą, o którą nie musisz się martwić.

Po tym wszystkim normalne pionowe miksy rytmiczne będą wyprowadzać remy z awariami (chyba że wyraźnie ustawisz $ rem-with-px-fallback na false). Zauważ, że reszta API pozostaje prawie identyczna, z wyjątkiem mixinu rhythm, który ma teraz bardziej sensowne domyślne argumenty. Jest kilka dodatków, które są szczegółowo opisane w original pull request.

Należy pamiętać, że funkcje rytmiczne nie są w stanie zapewnić fallbacków w pikselach, ponieważ po prostu zwracają wartość.