/* Start with a LESS list. */
@griditems: 5, 10, 20, 25, 30, 33.33, 40, 50, 60, 66.66, 70, 75, 80, 90, 95, 100;

/* Start Declaration - optional - Loop can be inside or outside. */
.grid-flex
{
	display: flex;
	flex-wrap: wrap;

	.grid-item
	{
		flex-grow: 1;
	}

  /*
    length - Gets the length of the LESS List.
    extract - Gets a value from the LESS List.
    floor - MAth Floor function.
    percentage - LESS Percentage function
  */

	.griditems(@i: length(@griditems)) when (@i > 0)
	{
		.griditems(@i - 1);

		@griditem: extract(@griditems, @i);

		@classname: floor(@griditem);

		.grid-item-@{classname}
		{
			min-width: percentage(@griditem  * 0.01);
		}

		.grid-flex-@{classname}
		{
			.grid-item
			{
				min-width: percentage(@griditem  * 0.01);
			}
		}
	}

	.griditems();
}