将 SCSS 中的所有数字减半 Sheet

Question

我有一张 SCSS 绘图，我正在使用它在一个元素上使用大量框阴影。然而，一旦我完成了这幅画，我意识到我需要画得小得多。有没有办法使用 Sass 函数或 mixin 将所有数值减半？这是我的 codepen 的 link。这是我的代码：

HTML

<div class="bowser"></div>

SCSS

.bowser {
  height: 0.98em;
  width: 0.98em;
  box-shadow:
    /* row 1 */
    12em 0 $w,
    13em 0 $w,
    14em 0 $w,
    /* row 2 */
    8em 1em $g,
    9em 1em $g,
    10em 1em $w,
    11em 1em $w,
    12em 1em $w,
    13em 1em $t,
    /* etc. etc. */
}

如果使用 Sass 无法做到这一点，是否可以使用类似编译器的服务来实现？感谢您的帮助！

Answer 1

是的。这是您更新后的 CodePen http://codepen.io/anon/pen/xdEQXV?editors=1100

@mixin box-shadow-mixin($divide) {
    box-shadow: 12em/$divide 0 $w,
    13em/$divide 0 $w,
    14em/$divide 0 $w,
    8em/$divide 1em/$divide $g,
    etc...
}

然后以这种方式包含：

.bowser {
  height: 0.95em;
  width: 0.95em;
  @include box-shadow-mixin(4);
}

将 SCSS 中的所有数字减半 Sheet

Halving All Numbers in SCSS Sheet

css

function

sass

mixins