1. Still in the
editor, please search the line code :
.checkoutsteps svg
{
width: 30px;
vertical-align: middle;
position: relative;
color: #5A5A5A;
fill: currentColor;
}
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;
}
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;
}
You
also need to add width for this CSS e.g :
.checkoutsteps .step.active svg
{
width: 30px;
color: #0bbbef;
}
And
click Save button.
Preview :
