I have two plunkers of material design wizard selector.One is having minified version of css and the other expanded. Both are acting differently upon stepper clicks. I wonder the minified file is not taking the transition effects of .step-wizard .progressbar
class.
Please suggest what could be the reason for this change even though the code is similar.One minified and the other expanded.
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
Minified CSS plunker:
Expanded CSS plunker
the stepper clicks work fine on both versions, only difference I see the border under .progressbar are different.
expanded has:
border: 1px solid e5e6e6;
minified has:
border:1px solid;
I found your typo. Your color code is wrong.
Your color code is
.progressbar {
position: absolute;
background-color: #0aa89e;
opacity: 0.4;
height: 12px;
border: 1px solid e5e6e6; // have a look here. color code has no #
}
You need to change like this
.progressbar {
position: absolute;
background-color: #0aa89e;
opacity: 0.4;
height: 12px;
border: 1px solid #e5e6e6; // you need to change color code
}
Fixed it by removing border: 1px solid e5e6e6;
from .step-wizard .progressbar-stepper
class
Link here
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.