0

So I would like to implement the following into my jade template:

<div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%">
    <span class="sr-only">45% Complete</span>
</div>

It is one of the progress bar snippets. I wanted to translate this into jade and this is what i've come up with given the documentation:

div(class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%")
   span(class="sr-only")45% Complete

I also read that for classes you can do, for example:

div.progress-bar progress-bar striped active

but what about the other attributes? In any case, I need help to translate the above html into the correct jade format. Thank you very much for your help.

0

1 Answer 1

0

If I'm right, Jade was based on Haml and Slim. If that's the case, you should be able to string the classes together, like div.progress-bar.progress-bar.striped.active. Furthermore, you probably don't need that beginning div, making it .progress-bar.progress-bar.striped.active.

The other attributes have to be done in the manner you were already doing them. Therefore, the final code block would be

.progress-bar.progress-bar.striped.active(role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%")
   span.sr-only 45% Complete

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.