Input does not work well with @tailwindcss/forms

[don-esteban]

Hi all,

@tailwindcss/forms together with Material Tailwind has issues. I observed them with the <Input> component if it is focused. I'm on the latest macOS testing with FF, Chrome, Safari and Edge.

With @tailwindcss/forms

Without @tailwindcss/forms

tailwind.config.ts

Commenting out require('@tailwindcss/forms') resolves the issue.

import type { Config } from 'tailwindcss'
import withMT from '@material-tailwind/react/utils/withMT'

const config: Config = {
  content: [
    './pages/**/*.{js,ts,jsx,tsx,mdx}',
    './components/**/*.{js,ts,jsx,tsx,mdx}',
    './app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    extend: {
      fontFamily: {
        sans: ['var(--font-inter)']
      },
    },
  },
  plugins: [
//    require('@tailwindcss/forms'),
  ],
}

export default withMT(config)