Tailwind button fix

application.tailwind.css

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "./components/buttons.css";
@import "tailwindcss/utilities";

buttons.css

.btn {
  @apply font-semibold text-lg py-3 px-6 rounded cursor-pointer no-underline;
}

.btn-small {
  @apply font-bold rounded text-sm py-2 px-4;
}

.btn-indigo {
  @apply bg-indigo-600 text-white hover:bg-indigo-700;
}

.btn-green {
  @apply bg-emerald-600 text-white hover:bg-emerald-700;
}

.btn-outline {
  @apply border border-gray-400 text-gray-800 bg-white hover:bg-gray-100;
}

.btn-white {
  @apply bg-white text-gray-800 py-2 px-4 rounded border-gray-400 shadow-sm shadow-gray-50;
}

Couple of notes:

• For the application.tailwind.css file, it's recommended that you include any additional component-driven styles after the components are included from Tailwind directly.
• There were a couple of typos in the buttons.css file. I fixed those above. In your views, I saw there are .btn-small and .btn-sm variants, so you'll need to choose one strategy.