natemoo-re / astro-icon

Inline and sprite-based SVGs in Astro made easy!
https://astroicon.dev
Other
992 stars 57 forks source link

Devicons do not load on webpage using astro-icons #146

Closed Clinton-Nmereole closed 8 months ago

Clinton-Nmereole commented 8 months ago

This issue is that icons from the pack devicons do not load using astro icons

---
import { Icon } from "astro-icon";
interface Props {
  text: string;
  logo: string;
}
const { text, logo } = Astro.props;
---

<div class="mx-16">
  <i class={`${logo} text-[120px] p-1 border-gray-100/10 border-2 bg-clip-text text-transparent bg-gradient-to-t from-orange-600 via-gray/70 to-gray/90 rounded-lg`}></i>
  <Icon name="logos:react" class="text-6xl p-2 border-gray-100/10 border-2 bg-clip-text text-transparent bg-gradient-to-t from-orange-600 via-gray/70 to-gray/90 rounded-lg"/>
  <Icon name="devicon-plain:c"/>

  <span class="text-2xl ml-6 font-bold bg-clip-text text-transparent bg-gradient-to-t from-orange-600 via-gray/70 to-gray/90 rounded-lg">{text}</span>
</div>

In the code above the icon with name "logos:react" loads properly, but "devicon-plain:c" does not load on the page. I tried this for various other icons in the devicon pack and none of them load using astro-icons. 2023-10-09_14-11

stramel commented 8 months ago

This is a duplicate of #29 if using v0.8.1.

You can also utilize the v1 branch or next tag.