You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
# 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**.
[PostCSS]: https://github.com/postcss/postcss
```css @-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; } } ```
```css @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; } } ```
## Usage
See the [PostCSS documentation](https://github.com/postcss/postcss#usage) for examples for your environment.
## Contributors
See [CONTRIBUTORS.md](https://github.com/cssnano/cssnano/blob/master/CONTRIBUTORS.md).
|