$ gnpm install postcss-discard-overridden
PostCSS plugin to discard overridden @keyframes
or @counter-style
.
@keyframes
or @counter-style
will be overridden by those who share the same identifiers and appear later in stylesheets. So we can discard all of them except the last one. When defined inside a @media
or @supports
rule, @keyframes
and @counter-style
rules only override global rules in some of the client browsers so they need handled separately. This plugin has taken care of this and transforms the PostCss AST safely.
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.8;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.8;
}
}
@media (max-width: 500px) {
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.8;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.8;
}
}
@supports (display: flex) {
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
}
}
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@media (max-width: 500px) {
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.8;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.8;
}
}
@supports (display: flex) {
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
}
}
@-webkit-keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
See the PostCSS documentation for examples for your environment.
See CONTRIBUTORS.md.
Copyright 2013 - present © cnpmjs.org | Home |