egoist / tailwindcss-icons

Use any icon (100,000+) from Iconify, for TailwindCSS
MIT License
830 stars 17 forks source link

Black box around animated icons in Firefox v111 #13

Open escherlies opened 1 year ago

escherlies commented 1 year ago

Screenshot 2023-04-07 at 18 06 23

Using the Tailwind CSS Icon Plugin package, animated icons display with a black box around them in Firefox v111, while appearing correctly in other browsers like Chrome and Safari. This inconsistency affects the overall visual appeal of the project.

Steps to reproduce:

  1. Install this Tailwind CSS Icon Plugin package.
  2. Add an animated icon using provided classes (e.g., animate-spin).
  3. Open in Firefox v111 and notice the black box around the icon.
  4. Compare with other browsers to confirm the issue is Firefox-specific.

Expected: Animated icons display consistently without artifacts. Actual: Black box appears around animated icons in Firefox v111.

Additional info:

Firefox version: 111
OS: macOS Ventura (13.2)
Tailwind CSS version: ^3.3.1
Tailwind CSS Icon Plugin version: ^1.0.7

Please advise on any known workarounds or further information needed. Thanks!