Search code examples
htmlcssnode.jspug

Inline style via attribute mixin jade


Is there any way of declaring a CSS width inline via a mixin attribute in Jade? An example of what I have tried is below...

mixin button(buttonLink, buttonText, buttonWidth)
 +link(buttonLink)(style='width:"buttonWidth"')
  font(style='color: #ffffff; text-decoration: none;') 
   =buttonText

Thanks.


Solution

  • Yeah, it's possible ;)

       mixin button(buttonLink, buttonText, buttonWidth)
         +link(buttonLink)(style="width:#{buttonWidth}")
           font(style='color: #ffffff; text-decoration: none;') 
             =buttonText
    
        mixin link(buttonLink)
          a(src=buttonLink, style=attributes.style)
            block
    
        +button("http://github.com", "github", 10)
    

    BTW: don't use <font>
    https://developer.mozilla.org/de/docs/Web/HTML/Element/font