0

I want to use Tailwind CSS flowbite library with nextjs 13, but I want to use html elements, i.e. jsx, not ready-made components in this library, so how is that done?

As

JSX components (I want this)

export default function MyPage() {
  return (<div class="p-4 mb-4 text-sm text-blue-800 rounded-lg bg-blue-50 dark:bg-gray-800 dark:text-blue-400" role="alert">
  <span class="font-medium">Info alert!</span> Change a few things up and try submitting again.
</div>)
}

Ready-made ingredients (I don't want this)

import { Alert } from "flowbite-react";

export default function MyPage() {
  return <Alert color="info">Alert!</Alert>;
}

I also used the tw-elements library that works fine LTR, but in RTL mode the components appear incorrectly

For example, an error occurs in the form of an input border

In flowbite documentation there is how to use Tailwind CSS components with html and not with nextjs

Mohammed
  • 1

0 Answers0