Barna Kovacs
Barna Kovacs

Reputation: 1276

Button customization in Zurb's foundation

Framework: Ruby on Rails.

I inserted this code into: foundation_and_overrides.scss

.button-facebook {
  $bg: #000;
  @include button($bg);
}

It gives me this error:

Sass::SyntaxError at / Cannot add a number with units (0.0625em) to a color (#f1f1f1).

How to customize the $bg variable in ZURB's Foundation?

Upvotes: 0

Views: 2446

Answers (1)

ymonad
ymonad

Reputation: 12090

I'm assuming that this question is about Zurb Foundation 4.

According to Zurb Foundation 4 document, button() mixin takes six arguments, and button color is the second argument. Therefore you can specify button color as follows:

@import "foundation/components/buttons";
.button-facebook{
  $bg: #000;
  @include button($button-sml, $bg, false, false, false, false);
}

The first argment is padding of the button, you can use $button-tny, $button-sml, $button-med, $button-lrg, emCalc(NNNpx), or whatever.

see Zurb Foundation 4 document for more detail:

http://foundation.zurb.com/docs/components/buttons.html

Upvotes: 1

Related Questions