css - 手写笔:预期 "indent"，得到 "outdent"

Question

我是手写笔的新手。尝试制作规则列表，例如 .mt--20、.mt--30、.mt--35 等

我遇到了这个错误

我的触控笔代码:

margin(postfix, side, numbers)
  .m{postfix}
    for n in numbers
      &--{n}
        margin-{side} {n}px
    for n in numbers
      &--{n}-xs
        @media $media-max-1366
          margin-{side} {n}px
    for n in numbers
      &--{n}-lg
        @media $media-min-1366
          margin-{side} {n}px

list = 5 10 15 20 25 30 35 40 45 50 55 60

margin(b, bottom, list)
margin(t, top, list)
margin(l, left, list)
margin(r, right, list)

我做错了什么？

Answer 1

错误与您对 n 的插值有关。在 margin-{side} 之后你不需要插值。

解决方案:

margin(postfix, side, numbers)
  .m{postfix}
    for n in numbers
      &--{n}
        margin-{side} n px
      &--{n}-xs
        @media $media-max-1366
          margin-{side} n px
      &--{n}-lg
        @media $media-min-1366
          margin-{side} n px

list = 5 10 15 20 25 30 35 40 45 50 55 60

margin(b, bottom, list)
margin(t, top, list)
margin(l, left, list)
margin(r, right, list)

这是一个CodePen您可以在其中查看编译后的源代码(没有错误)。