Looping in bs-emotion

posted on 26 January 2020

If you like to do a loop in bs-emotion for list of classes and do something, for example different background colors for class of name 1 – 10.

here’s how:

First you create a loop function with list of colors that you want to loop over and each class_index_number, since bs-emotion uese ocaml syntax, I am using Belt library in my case, you might want to use stdlib List.mapi

Next you create a variable that has list of child classes which contains different background colors.

Since bs-emotion only allow emotion inside emotion css even with ppx, you want to use extend method provided by bs-emotion to extend to classList that we created.

This will translate into:

You might not need this usually, but if you really need hopefully this method will be useful for you.