css - Zurb 基础中的按钮自定义

Question

框架：Ruby on Rails。

我将此代码插入：foundation_and_overrides.scss

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

它给了我这个错误：

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

如何在 ZURB 的 Foundation 中自定义 $bg 变量？

Answer 1

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