Describe the bug
I'm quite perplexed by this. The following input:
:root,
:root .dark-theme .light-theme {
--col: #fff;
}
:root .dark-theme {
--col: #333;
}
.arrow {
border-style: solid;
border-width: 50px;
border-color: #fff transparent;
border-color: var(--col) transparent;
border-top: none;
height: 0;
width: 0;
}
is minified to this (prettified version):
:root,
:root .dark-theme .light-theme {
--col: #fff;
}
:root .dark-theme {
--col: #333;
}
.arrow {
border: 50px solid transparent;
border-bottom: 50px solid #fff;
border-top: none;
height: 0;
width: 0;
}
Notice that the var(--col) fallback has been removed and therefore the switching to dark theme doesn't work.
If I put border-style and/or border-width below border-color it correctly preserves it:
:root,
:root .dark-theme .light-theme {
--col: #fff;
}
:root .dark-theme {
--col: #333;
}
.arrow {
border-color: #fff transparent;
border-color: var(--col) transparent;
border-style: solid;
border-width: 50px;
border-top: none;
height: 0;
width: 0;
}
Gets minified to (prettified version):
:root,
:root .dark-theme .light-theme {
--col: #fff;
}
:root .dark-theme {
--col: #333;
}
.arrow {
border-color: #fff transparent;
border-color: var(--col) transparent;
border-style: solid;
border-width: 50px;
border-top: none;
height: 0;
width: 0;
}
Am I correct to think it's a bug? Why would the order of border-style or border-width cause it to remove fallback properties?
Expected behaviour
I expect the fallback property to be kept either way.
Steps to reproduce
Example here: https://github.com/[aayla-secura/cssnano-issue](https://github.com/aayla-secura/cssnano-issue)
If you look at index.html which includes .arrow inside .dark-theme the arrow should be dark, and is dark when using all css versions except not-working-after-min-post.css
Version
7.0.6
Preset
(no preset)
Environment
Ubuntu on WLS2 on Windows 11
Package details
├── cssnano@7.0.6
├── postcss-cli@11.0.0
├── postcss-preset-env@10.1.2
└── postcss@8.4.49
Additional context
No response
Describe the bug
I'm quite perplexed by this. The following input:
is minified to this (prettified version):
Notice that the
var(--col)fallback has been removed and therefore the switching to dark theme doesn't work.If I put
border-styleand/orborder-widthbelowborder-colorit correctly preserves it:Gets minified to (prettified version):
Am I correct to think it's a bug? Why would the order of
border-styleorborder-widthcause it to remove fallback properties?Expected behaviour
I expect the fallback property to be kept either way.
Steps to reproduce
Example here: https://github.com/[aayla-secura/cssnano-issue](https://github.com/aayla-secura/cssnano-issue)
If you look at index.html which includes
.arrowinside.dark-themethe arrow should be dark, and is dark when using all css versions exceptnot-working-after-min-post.cssVersion
7.0.6
Preset
(no preset)
Environment
Package details
Additional context
No response