Have you read the Contributing Guidelines on issues?
Prerequisites
Description
Button style css :where selector is experimental feature and broken in many browsers. Can reproduce by visit https://docusaurus.io/ in some old version browser, the "Get Started" and "Try a Demo" button style is broken.

And I checked the css file, seems no needs to use :where selector, change them to simple css selector can fix the issue.
:where(.button--primary) {
--ifm-button-background-color: var(--ifm-color-primary);
--ifm-button-border-color: var(--ifm-color-primary);
}
:where(.button--primary):not(.button--outline):hover {
--ifm-button-background-color: var(--ifm-color-primary-dark);
--ifm-button-border-color: var(--ifm-color-primary-dark)
}
:where(.button--secondary) {
--ifm-button-background-color: var(--ifm-color-secondary);
--ifm-button-border-color: var(--ifm-color-secondary)
}
:where(.button--secondary):not(.button--outline):hover {
--ifm-button-background-color: var(--ifm-color-secondary-dark);
--ifm-button-border-color: var(--ifm-color-secondary-dark)
}
See also: https://caniuse.com/?search=where
Reproducible demo
https://docusaurus.io/
Steps to reproduce
- Visit https://docusaurus.io/ in chrome older than version 87, or other old version browsers
- Check the button style
Expected behavior
Expect the Button style is same as the style show in latest browser.
Actual behavior
The Button style not work, no background color.
Your environment
- Public source code: N/A
- Public site URL: https://docusaurus.io/
- Docusaurus version used: 2.0.0-beta.21
- Environment name and version: the browser in Wechat, it seems based on an old version chrome.
- Operating system and version (e.g. Ubuntu 20.04.2 LTS): Android
Self-service
Have you read the Contributing Guidelines on issues?
Prerequisites
npm run clearoryarn clearcommand.rm -rf node_modules yarn.lock package-lock.jsonand re-installing packages.Description
Button style css
:whereselector is experimental feature and broken in many browsers. Can reproduce by visit https://docusaurus.io/ in some old version browser, the "Get Started" and "Try a Demo" button style is broken.And I checked the css file, seems no needs to use
:whereselector, change them to simple css selector can fix the issue.See also: https://caniuse.com/?search=where
Reproducible demo
https://docusaurus.io/
Steps to reproduce
Expected behavior
Expect the Button style is same as the style show in latest browser.
Actual behavior
The Button style not work, no background color.
Your environment
Self-service