Semantic-UI doesn't have a good method for colouring text.
Maybe we can use this code here: https://github.com/Semantic-Org/Semantic-UI/issues/1885#issuecomment-226047499:
@text-colors: blue, green, orange, pink, purple, red, teal, yellow, black, grey, white;
.text {
.-(@i: length(@text-colors)) when (@i > 0) {
@c: extract(@text-colors, @i);
&.@{c} { color: @@c }
.-((@i - 1));
}.-;
}
I really did not even understand it until today because we can not have the text colors.
This code generates this:
.text.white {
color: #FFFFFF;
}
.text.grey {
color: #CCCCCC;
}
.text.black {
color: #1B1C1D;
}
.text.yellow {
color: #F2C61F;
}
...
Is this a good method?
What if we make something like this:
<span class="red"></span>
just red
without text
?
with this code instead:
@text-colors: blue, green, orange, pink, purple, red, teal, yellow, black, grey, white;
.-(@i: length(@text-colors)) when (@i > 0) {
@c: extract(@text-colors, @i);
&.@{c} { color: @@c }
.-((@i - 1));
}.-;
The question is for Semantic-UI experts!