bootstrap
bootstrap copied to clipboard
icon-link-hover expects the svg to have the bootstrap icons class "bi"
Prerequisites
- [X] I have searched for duplicate or closed issues
- [X] I have validated any HTML to avoid common problems
- [X] I have read the contributing guidelines
Describe the issue
I would like to be able to use the effect provided by "icon-link-hover" also with custom svg without having to add a class of another icon set. Furthermore, it is not stated in the documentation that it only works with bootstrap icons so I would at least fix that
Reduced test cases
Doesn't work
<a class="icon-link icon-link-hover" href="#">
Text
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
<path d="M10.7817 8.0786L7.20566 4.5026L8.14833 3.55994L13.3337 8.74527L8.14833 13.9306L7.20566 12.9879L10.7817 9.41194H2.66699V8.0786H10.7817Z" fill="#F7CD2C"/>
</svg>
</a>
Work
<a class="icon-link icon-link-hover" href="#">
Text
<svg class="bi" xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17" fill="none">
<path d="M10.7817 8.0786L7.20566 4.5026L8.14833 3.55994L13.3337 8.74527L8.14833 13.9306L7.20566 12.9879L10.7817 9.41194H2.66699V8.0786H10.7817Z" fill="#F7CD2C"/>
</svg>
</a>
What operating system(s) are you seeing the problem on?
Windows
What browser(s) are you seeing the problem on?
No response
What version of Bootstrap are you using?
5.3.2
### Tasks
We could add a general svg
selector in there for now and then fix this properly in v6.