Stylus create mixins via loop

扶醉桌前 提交于 2021-01-29 04:50:44

问题


My goal is create a group of mixins via array. My idea is apply code as follows:

f_colors = (f1 f2 f3 f4 f5)
for $i in 0..length(f_colors)
    v = f_colors[$i]
    num = $i+1

   f{num}cl()
      color v

   f{num}bg()
      background-color: v

// and use to generate css
body
   h1
       color: white
       f5bg ''

where in f_colors i've stored a colors list. With thi example, i would obtain an output as

body h1 {
   background-color: #00f; // f5 color
   color: white;
}

is it possible, or my best could be use mixins as follows:

fbg(num)
    background-color: f_colors[num-1]

fcl(num)
    color: f_colors[num-1]

Thanks for reading.


回答1:


You have to resort to using the define BIF:

$colors = (f1 f2 f3 f4 f5)
for $c, $i in $colors
  define("f"+($i + 1)+"bg", @() {
    background-color: $c
  })

// and use to generate css
body
  h1
    color: white
    f5bg ''


来源:https://stackoverflow.com/questions/34905698/stylus-create-mixins-via-loop

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!