Global base styles

[llPekoll]

How can I add base styles globally? here step 3 there is the input.css And in this file you can add query selector like

.button {
    @apply bg-blue-500 text-white font-bold py-2 px-4 rounded;
}

and this will set the class in all the project, do there is a way to set a class globally in django-tailwind

Best.

[demsking]

Put your code on theme/static_src/src/style.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  .button {
      @apply bg-blue-500 text-white font-bold py-2 px-4 rounded;
  }
}

[kingraphaii]

I am currently facing a challenge using @apply. Here is my theme/static_src/src/style.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .button-primary {
    @apply w-full py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-medium rounded-lg border border-transparent bg-[#f23732] text-white hover:bg-[#ff1b15] focus:outline-none focus:bg-[#ff1b15] disabled:opacity-50 disabled:pointer-events-none;
  }
  .sc-checkbox-input {
    @apply shrink-0 mt-0.5 border-gray-200 rounded text-smart-red focus:ring-smart-red;
  }

  .sc-input {
    @apply py-3 px-4 block w-full border-gray-200 rounded-lg text-sm focus:border-smart-red focus:ring-smart-red disabled:opacity-50 disabled:pointer-events-none;
  }

  .my-input {
    @apply py-5;
  }
}

The classes I am only able to get working are .button-primary and .sc-checkbox-input everything else is being ignored