Incompatible units when used with foundation-rails (6.2.3.0)

[sdhull]

How can we reproduce this bug?
New Rails 5 project with inky-rb and foundation-rails (foundation-rails (6.2.3.0))
Run the generators. Add @import "settings"; to your foundation_emails.scss file.
Create a mailer (just follow along with Rails Guides if you like). Add a previewer so you can view the email in your browser.
Initial issue is Incompatible units: 'px' and 'rem'. from _global.scss:91, which can be fixed by defining $global-gutter: rem-calc(16);.
Next issue is $map: (0.85em 1em) is not a map formap-get'from_button.scss:79`. This is apparently due to a naming collision between foundation button padding and email button padding.

Fixing these issues is relatively easy but it makes me a bit nervous -- is the foundation emails project incompatible with the regular foundation settings file?

What did you expect to happen?
... not breaking

What happened instead?
... it broke

What email clients does this happen in?
N/A

[gustafr]

Just wanted to point out that i have the same issue as described above. Someone found a solution for this problem?

[sdhull]

@gustafr you can fix it by changing the variables in your email stylesheet. This is what I have:

$global-gutter: rem-calc(16);
$button-padding: (
  tiny: 4px 8px 4px 8px,
  small: 5px 10px 5px 10px,
  default: 8px 16px 8px 16px,
  large: 10px 20px 10px 20px,
);

[memoht]

+1 for running into this issue. I am using Foundation 6.2.4 via Bower in my Rails app and just tried to get up and running with inky-rb and premailer-rails. Getting the exact error Incompatible units: 'px' and 'rem' when I try to fire up my Rails app. Is this going to be fixed for 6.3.0?

[gustafr]

Just like Foundation for sites, foundation-emails (which is a dependency to Inky) is using a _settings.scss file. However this file is not being installed when bundled, could be because it's using the same name as the "normal" foundation _setting.scss file. I ended up copying the foundation-emails _settings.scss file from the gem manually, renaming it to _settings-email.scss and put it in my ordinary Stylesheets folder. Then from my foundation_emails.scss i imported this file
@import 'settings_email';

[memoht]

Interesting that running rails g inky:install --haml didn't prompt me that about a conflict with the_settings.scss from Foundation.

To be specific, I tried the following:

• Copied _settings.scss from the gem and renamed _settings_email.scss
• Added @import "foundation_emails"; toapplication.scss
• Added @import "settings_email; to foundation_emails.scss

When I started up the server I got the same error as above, so I commented out @import "foundation-emails"; from the first line of foundation_emails.scss, at which point it seems easier to just add @import "settings_email"; directly to application.scss and delete this other file.

The server starts, but of course I haven't had a chance to see if the other parts work. It also makes me wonder how the Global variables in the settings_email.scss aren't going to conflict with the same ones from Foundation.

[memoht]

Yeah, this isn't working. Trying to generate an email is leading to multiple errors.

• Was prompted to add: Rails.application.config.assets.precompile += %w( foundation_emails.css )

Now, getting: File with URL "/stylesheets/foundation_emails.css" could not be loaded by any strategy.

I am starting to get the feeling this is going to be complicated.

[gustafr]

Try these steps:
Remove @import "foundation_emails" from application.css, otherwise you will load the mail css-styles site-wide.
In your foundation_emails.css:

@import 'settings_email';
@import "foundation-emails";

In
views/layouts/mailer.html.erb(or haml)
make sure you have the:
<%= stylesheet_link_tag "foundation_emails" %>
to require the css.
Let me know if it works.

[kball]

We changed the name of the stylesheets to prevent this collapse, it looks like settings needs it as well. @abdullahsalem I think you did the first change, do you want to take a pass on this one?

[memoht]

@gustafr That worked for my development environment after Rails prompted me to enter Rails.application.config.assets.precompile += %w( foundation_emails.css ) but what will happen when I try to go to production? If _settings_email.scss isn't specified in the precompile list?

Is it going to be properly precompile because it is referenced in foundation_emails.scss?

[abdullahsalem]

@kball Yes, please.