natemoo-re / astro-icon

Inline and sprite-based SVGs in Astro made easy!

Home Page:https://astroicon.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Devicons do not load on webpage using astro-icons

Clinton-Nmereole opened this issue · comments

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

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

You can also utilize the v1 branch or next tag.