The Vertical Rhythm module sticks only to the last established baseline

[rpkoller]

I initially hoped things would work out of the box, since it was possible to establish different baselines for different viewports, but then it seems the adjust-font-size-to mixin and related stick to the last set baseline in their calculation:

http://sassmeister.com/gist/7992795

• e.g. $mod0 is 20px and $mood0 26px
• then the font-size of p is in the wrong context. i would have expected 1em referring to the 20px base size but 0.76923em refers to 26px instead. the values within the breakpoint are correct besides.

In case this is expected behaviour i would suggest that the adjust-font-size-to mixin and the other related mixins orient themselves to the baseline set to the present breakpoint or fall back to the matching "base" baseline. Would be neat. Best regards r.

[mirisuzanne]

Breakpoints don't exist as a scope in Sass or Compass, and I don't think they really could - since it is easy to write media-queries that may or may not overlap in various ways, depending on the client/device/browser.

@include breakpoint(min-width 750px) { $base-size: 10px; }
@include breakpoint((max-height 200px) (orientation landscape)) { $base-size: 20px; }

@include breakpoint(orientation landscape) { /* What context am I in? What's the value of $base-size? */ }

Also, "Breakpoint" is a 3rd-party plugin, so not directly integrated with all Compass features.

[rpkoller]

Well that's a more than reasonable point - my breakpoints consisted mainly of min-width conditions only, there it might be applicable, but in your described scenario it is not. That would go far beyond the scope. A pity... :(

Eric so the only viable way of changing font sizes in different viewports would be. Create a modular scale and establish one baseline with vertical rhythm and then adjust the font sizes over viewports with the adjust-font-size-to mixin individually? Since the intended trick that you establish a few baselines and just change the body fontsize percentage and keep the rest as is wouldn't work as i've experienced in my gist.

[mirisuzanne]

Well, I think you could get a bit trickier if you wanted to, and there's already a pull request to add some functionality you might find useful. You could use a wrapping mixin like use-baseline in conjunction with breakpoint to get the effect you want. For now, you would just have to write your own use-baseline mixin, until that lands in Compass. Then:

@include breakpoint(750px) {
  @include use-baseline($new-baseline) {
    // use your new baseline!
  }
}

If that approach is working, you could even write a shortcut for it. Something like this:

@include breakpoint-basline(750px, $new-baseline) {
  // use your new baseline!
}

All that shortcut mixin has to do is pass on the arguments to the existing breakpoint and use-baseline wrappers.

[rpkoller]

wow looks that is exactly what i was looking for as far as i can judge from the pull request. I guess it won't make it into 1.0 since it nears its completion. But i was a bit impatient, just played around a bit and inserted the plain mixin into my previous gist from above and adjusted the necessary parts: http://sassmeister.com/gist/7992795 Well i am unsure if i would really need anything else from the pull requests changes but as far as i can tell from the output everything behaves well as i expected. Two different scales applied to two different viewports providing some initial type scaling. ;) Sweet! I hope it makes its way into the Compass trunk soon after 1.0 :) Thanks for the tip!