Next.js Discord

Discord Forum

Some of the tailwind classes wont apply

Answered
muadpn posted this in #help-forum
Open in Discord
Avatar
muadpnOP
Getting annoyed about tailwind css next-themes -_-.
i just created a project and installed next-themes and added the toggle button which all works great. and also added darkMode: "class" to the config. now if i add "dark:bg-gray-700/20" it wont work but "dark:bg-gray-700/10" works similary many of tge bg colors wont work like green blah blah
Tailwind Config
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
    "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
    "./src/app/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      backgroundImage: {
        "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
        "gradient-conic":
          "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
      },
    },
  },
  plugins: [],
  darkMode: "class",
};
Answered by muadpn
Found the fix:
npm cache clean --force
npm cache verify

if above doesnt work
rd /s /q node_modules && npm install

if above doesnt work
//add this to tailwind config
module.exports = { 
    // Include all relevant paths 
      purge: ['./src/**/*.{js,ts,jsx,tsx}'], 
    // Rest of the configuration 
}
View full answer

3 Replies

Avatar
muadpnOP
started a new project and same stuff keep happening
Avatar
muadpnOP
Found the fix:
npm cache clean --force
npm cache verify

if above doesnt work
rd /s /q node_modules && npm install

if above doesnt work
//add this to tailwind config
module.exports = { 
    // Include all relevant paths 
      purge: ['./src/**/*.{js,ts,jsx,tsx}'], 
    // Rest of the configuration 
}
Answer
Avatar
muadpnOP
content: ['./src/*/.{js,ts,jsx,tsx}'],