Closed thomasritz closed 11 years ago
Something is wrong. Foundation 4 doesn't use compass at all. :)
edit Oh, I see what you mean: you are using the typography module from Compass, and Foundation conflicts with it. /edit
I'm using compass for convenience to use some mixins defined there. My issue report is by no means an accusation. Sometimes such problems as reported are just a mistake, sometimes incompatibilities are by design. I want to know what would be the correct way of handle this issue. Maybe this knowledge is also of some use to others.
I am planning on doing the same thing. So it's going to be useful to me. :) Sass could need some namespace functionality.
:+1: This worked for me by adding it before @import
ing compass.
Considering that Compass used to be a Foundation dependency, this should probably be fixed in Foundation by defining $base-line-height: 100%;
in the Frameworks built-in default settings.
The easiest solution for now is to simply add $base-line-height: 100%;
to your _settings.scss and set up your app.scss like so:
// Global Foundation Settings
@import "settings";
// Comment out this import if you are customizing you imports below
@import "foundation";
// Get compass mixins
@import "compass";
// Load our custom site styles
@import "mystuff";
So long as $base-line-height
is defined as a percentage BEFORE compass is loaded, there are no problems.
Guys...I'm just kind of tagging on the end of this discussion.
With Foundation 3 I was using many compass mixins (but don't remember explicitly importing Compass), was Compass built in with Foundation 3 by default?
I see there are some issues with Compass mixins with Foundation 4. Is Foundation 4 designed to be used with out Compass or can we just import Compass as shown in the code below to access Compass mixins? I don't understand why Zurb didn't test compatibility with Compass?
@richlove1 According to the docs, Foundation 4 is designed to have fewer dependancies... which means Compass is no longer required for the SCSS version of the framework. It also means that there might be a few conflicts since F3 was explicitly built for use with Compass.
Great, thanks for the feedback, I think it would be better if it were made a bit clearer in the docs for people coming from Foundation 3 (unless I missed that bit)
I assume this means that you can still use Compass and Compass mixins with Foundation 4 if you'd like to?
@richlove1 Yeah, you can still use it. The issue in this thread is the only one I've come across... as far as Compass is concerned, anyway (although not Compass related: the Top Bar component is Trouble with a capital T).
:) OK.... I did import Compass successfully after applying the fix suggested in this thread..Thanks for the feedback
Any word on whether or not this as been addressed by Foundation yet? This is killing me.
upgraded from 4.0.5 to 4.0.8.
The compass code in question seems to be https://github.com/chriseppstein/compass/blob/stable/frameworks/compass/stylesheets/compass/typography/_vertical_rhythm.scss#L36
It seems that _foundation-global.scss introduced
$base-font-size: 100% !default;
which overrides compass' value of16px
.It helps to either set the
$base-line-height
to anything with a % value or to defineprior to importing
foundation/foundation-global
or to import compass modules individually (and avoid the typography module).What would you recommend for a working setup?