#Tailwind not working in (Authorization) folder, but working in (main)

1 messages · Page 1 of 1 (latest)

cobalt baneBOT
#

Hi @hot elbow. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

Based on your Tailwind CSS configuration, it seems like you have not included the Authorization folder in the content array of your tailwind.config.js file. The content array should include paths to all files that will use Tailwind CSS class names.

Here's how you can modify your tailwind.config.js to include the Authorization folder:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./app/**/*.{js,ts,jsx,tsx}", // This line includes all subdirectories under 'app'
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        primary: "#FF7070",
        primaryLowOpacity: "#feeeef",
        secondary: "#171717",
      },
    },
  },
  plugins: [],
};

This configuration will apply Tailwind CSS to all files (regardless of their extension) in the app, pages, and components directories, as well as their subdirectories. This should include your Authorization folder.

For more information, you can refer to the Next.js documentation on configuring Tailwind CSS (https://nextjs.org/docs/app/building-your-application/styling/tailwind-css).

Remember to restart your development server after making changes to your Tailwind CSS configuration.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: