Next.js Discord

Discord Forum

Tailwind + Font Awesome icons change after adding Client Component

Answered
Yacare Caiman posted this in #help-forum
Open in Discord
Yacare CaimanOP
As you can see, if i add a client component in my project, every imported icons stop respecting the size i gave it with tailwind
Answered by Yacare Caiman
i fixed it by using text-xl instead of width
View full answer

5 Replies

Yacare CaimanOP
example icon: 
      <FontAwesomeIcon
        icon={faArrowUp}
        className={twMerge("icon-white", "w-8")}
      />
.icon-white path {
  fill: #e5e7eb;
}
Koolie
you can use react-icons directly and use clsx..
maybe..
Yacare CaimanOP
i fixed it by using text-xl instead of width
Answer
@Koolie you can use react-icons directly and use clsx.. maybe..
Yacare CaimanOP
there are so many libraries that i forget react icons exists