4 ms·

It's actually nothing to do with the pipe operator in Elixir. In any programming language, the order in which you compose functions is important. In CSS — and

It's actually nothing to do with the pipe operator in Elixir. In any programming language, the order in which you compose functions is important. In CSS — and in keeping with your analogy — the order in which "functions" are defined is important.

keb_ 8y ago
I never said it has anything to do with the pipe operator, and I did not mean to imply that it is a direct equivalent to the pipe operator. But just as the pipe operator allows you to compose multiple pure functions, the idea with atomic CSS classes is that you are able to compose "pure" classes. The quotes are important here. Obviously, they are not 100% comparable. CSS is not a programming language.
- yakshaving_jgt 8y ago
  It's a weak analogy. In programming, `f . g . h` is not the same as `h . f . g`. In CSS, `<i class="a b c"></i>` is the same as `<i class="b c a"></i>`. In programming, the order in which you define functions is not important — it's the order in which you use them which is important. In CSS, it is the exact opposite. To further drive the point home: assuming the names of these classes aren't lying, what colour is the text of this element? <div class="text-red text-blue">foo</div> It depends on the order in which the classes were defined. This also demonstrates why "pure" is a poor choice of word when describing anything to do with CSS. Nothing here is "pure".
  - keb_ 8y ago
    I understood what you meant. Whether or not I'm supportive of the terminology used for "Functional CSS" is a different story.
walterstucco 8y ago
> In any programming language, the order in which you compose functions is important. Not really [3,2,1] |> map(x => x * 2) |> sort is the same of [3,2,1] |> sort |> map(x => x * 2)
strken 8y ago
This is a really interesting discussion because it makes me wonder what CSS could have been like if it had cascaded per-element according to the order of classes.

keb_ 8y ago

I never said it has anything to do with the pipe operator, and I did not mean to imply that it is a direct equivalent to the pipe operator. But just as the pipe operator allows you to compose multiple pure functions, the idea with atomic CSS classes is that you are able to compose "pure" classes. The quotes are important here. Obviously, they are not 100% comparable. CSS is not a programming language.

yakshaving_jgt 8y ago
It's a weak analogy. In programming, `f . g . h` is not the same as `h . f . g`. In CSS, `<i class="a b c"></i>` is the same as `<i class="b c a"></i>`. In programming, the order in which you define functions is not important — it's the order in which you use them which is important. In CSS, it is the exact opposite. To further drive the point home: assuming the names of these classes aren't lying, what colour is the text of this element? <div class="text-red text-blue">foo</div> It depends on the order in which the classes were defined. This also demonstrates why "pure" is a poor choice of word when describing anything to do with CSS. Nothing here is "pure".
- keb_ 8y ago
  I understood what you meant. Whether or not I'm supportive of the terminology used for "Functional CSS" is a different story.

walterstucco 8y ago

> In any programming language, the order in which you compose functions is important. Not really [3,2,1] |> map(x => x * 2) |> sort is the same of [3,2,1] |> sort |> map(x => x * 2)

strken 8y ago

This is a really interesting discussion because it makes me wonder what CSS could have been like if it had cascaded per-element according to the order of classes.