Open tuckergordon opened 1 year ago
As far as I know this CSS var is not even used on Docusaurus,
But is only found in Infima search: https://infima.dev/demo/
I'll keep this issue open because we should probably delete it from Infima, it's confusing for Docusaurus users and useless
The only official Docusaurus search icon is from the Algolia search widget lib and using a SVG, not a CSS var.
And it adapts to the current theme using a CSS var that we provide:
.DocSearch-Button .DocSearch-Search-Icon {
--docsearch-text-color: cyan;
color: var(--docsearch-text-color);
}
I'll keep this issue open because we should probably delete it from Infima, it's confusing for Docusaurus users and useless
Agreed - would be good to remove it entirely and replace the demos with an SVG-based solution.
I ran into this while using the easyops-cn/docusaurus-search-local library, so I will make a issue ticket in that repo and reference this one.
The search icon as defined in
--ifm-navbar-search-input-icon
is usescurrentColor
:However, this does not have the intended effect because
currentColor
does not get applied on images rendered usingurl()
. This results in the search icon not changing color when switching between light/dark theme (and makes it hard to customize the color more generally).Perhaps a more flexible approach would be to use an actual SVG in the element, similar to how Docusarus has implemented it on their website: