0

I'm trying to create a list of variables that I can use in a Less project. To be consistent with the information the designer gives me, I would like to create variables to automate the reduction of opacity.

I used the "fade" function to reduce the color opacity since if I used the "opacity" property of CSS I would remove the opacity of an entire element, for example also in the background.

@secondary95: fade(@secondary, 95);
@secondary90: fade(@secondary, 90);
@secondary85: fade(@secondary, 85);
@secondary80: fade(@secondary, 80);
@secondary75: fade(@secondary, 75);
@secondary70: fade(@secondary, 70);
@secondary65: fade(@secondary, 65);
@secondary60: fade(@secondary, 60);
@secondary55: fade(@secondary, 55);
@secondary50: fade(@secondary, 50);
@secondary45: fade(@secondary, 45);
@secondary40: fade(@secondary, 40);
@secondary35: fade(@secondary, 35);
@secondary30: fade(@secondary, 30);
@secondary25: fade(@secondary, 25);
@secondary20: fade(@secondary, 20);
@secondary15: fade(@secondary, 15);
@secondary10: fade(@secondary, 10);
@secondary5: fade(@secondary, 5);

The code I would like to obtain is formed by this pseudo-code:

repeat a loop starting from 5, add 5 units each loop till you reach 100 {
@name "contatenation" @number-of-iteration: fade(@name, @number-of-iteration)
}
seven-phases-max
  • 11,765
  • 1
  • 45
  • 57
Alessandro Nicola
  • 61
  • 1
  • 2
  • 1
    Possible duplicate of [How to generate CSS with loop in less](https://stackoverflow.com/questions/15239785/how-to-generate-css-with-loop-in-less) –  Oct 29 '19 at 14:08
  • Does this answer your question? [Dynamically define a variable in LESS CSS](https://stackoverflow.com/questions/18039082/dynamically-define-a-variable-in-less-css) – Arkellys Oct 29 '19 at 14:47
  • In Less you *can't* generate a (arbitrary named) variable programmatically (it's actually intentional since almost always when you need that it is an XY-problem. Like in your particular case above: you seem to want to either emulate array or a function. I.e. instead of `@name-value` variable what you really need is a `name(value)` function (or an `array[value]` thing even if the latter is a bit verbose to use)). – seven-phases-max Oct 29 '19 at 18:39

0 Answers0