Add Tailwind button for save+cancel

- remove custom styles
- add new button styles based on Tailwind classes using @apply
- extend config to allow hover:ring-blue-200 and such
- update the js-files to use new classes

- Only unsure about the `.review-form .save-non-active`, this might need additional Tailwind helper classes in this specific situation. Don't know where it shows up, so could not test.
This commit is contained in:
Tobias 2021-01-24 22:20:40 +01:00
parent 2342d369d0
commit 4068931bba
7 changed files with 29 additions and 39 deletions

View file

@ -11,6 +11,27 @@
.max-h-20vh {
max-height: 20vh;
}
.btn {
@apply inline-flex justify-center;
@apply py-2 px-4;
@apply border border-transparent shadow-sm;
@apply shadow-sm rounded-3xl;
@apply ring-2 ring-blue-200 hover:ring-blue-300;
@apply mt-1 mr-1;
@apply text-sm font-medium text-white;
@apply bg-blue-600 hover:bg-blue-700;
@apply focus:outline-none focus:ring-blue-700;
}
.btn-secondary {
@apply bg-gray-600 hover:bg-gray-700;
}
.btn-disabled {
@apply bg-gray-500 hover:bg-gray-500;
@apply text-gray-300;
@apply ring-gray-200 hover:ring-gray-200 focus:ring-gray-200;
@apply cursor-default;
}
}