1. Still in the
editor, please search the line code :
.checkoutsteps svg
{
width: 30px;
vertical-align: middle;
position: relative;
color: #5A5A5A;
fill: currentColor;
/*2016.11.28 : fixed checkout graphics height for IE*/
max-height: 35px;
}
2. To change
color for inactive icons, kindly change the value #5A5A5A with your
desired color.
Example, let’s say we want to change inactive icons to red,
the css would be :
.checkoutsteps svg {
width: 30px;
vertical-align: middle;
position: relative;
color: #FF0000;
fill: currentColor;
/*2016.11.28 : fixed checkout graphics height for IE*/
max-height: 35px;
}
And
click Save button.
Preview :
3. To change
size of inactive icons, kindly change the value of width with your desired size.
Let’s say we want to make them smaller but keep the active icon with default
size :
.checkoutsteps svg {
width: 15px;
vertical-align: middle;
position: relative;
color: #FF0000;
fill: currentColor;
/*2016.11.28 : fixed checkout graphics height for IE*/
max-height: 35px;
}
You
also need to add width for this CSS e.g :
.checkoutsteps .step.active svg {
width: 30px;
color: #0bbbef;
}
And
click Save button.
Preview :
