Fabien72

Hi, I have a css file where I define all my svg icons :

...
.icon-bell {
	background-image: url('/img/icons/bell.svg');
}
.icon-bars {
	background-image: url('/img/icons/bars.svg');
}
.icon-check {
	background-image: url('/img/icons/check.svg');
}
...

 And after that I call them on my buttons like this :

<button type="button" class="bt-icon icon-bell" onclick="window.location.href='historic'"></button>

I have 25+ icons on css file, so I were wondering if there is a way to simplify my redondant css file, with maybe a variable to do somthing like that :

.icon-$name {
	background-image: url('/img/icons/$name.svg');
}

Or maybe an other technic to do somthing similar ?

Thanks.