angular tab change smooth transition
.mat-tab-body {
animation: fade-out 0.5s;
opacity: 0;
}
.mat-tab-body.mat-tab-body-active {
animation: fade-in 0.5s;
opacity: 1;
}
@keyframes fade-in {
0% {
opacity: 0;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-out {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 0;
}
}