@tailwind base;
@tailwind components;
@tailwind utilities;
body {
@apply bg-blue-100 dark:bg-slate-800 text-black dark:text-slate-400;
}
@layer components {
.card {
@apply block p-6 bg-white rounded-lg border border-gray-200 dark:border-gray-700 shadow-md dark:bg-transparent;
}
.card-hr {
@apply border-gray-200 dark:border-gray-700;
}
.card-divide {
@apply divide-gray-200 dark:divide-gray-700;
}
a.card,
button.card {
@apply hover:bg-gray-100 dark:hover:bg-gray-700;
}
.card-header {
@apply mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white;
}
.card-body {
@apply font-normal text-gray-700 dark:text-gray-400;
}
header {
@apply dark:bg-gradient-to-b dark:from-gray-900 dark:to-slate-800 text-black dark:text-inherit;
}
.btn-green {
@apply w-fit mt-3 text-white border border-green-700 bg-green-700 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 focus:outline-none dark:focus:ring-blue-800 transition duration-150 ease-out;
}
.btn-red {
@apply w-fit mt-3 text-white border border-red-700 bg-red-700 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 focus:outline-none dark:focus:ring-blue-800 transition duration-150 ease-out;
}
.btn-blue {
@apply w-fit mt-3 text-white border border-blue-700 bg-blue-700 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 focus:outline-none dark:focus:ring-blue-800 transition duration-150 ease-out;
}
.btn-blue-outline {
@apply w-fit mt-3 text-blue-700 dark:text-inherit hover:text-white border border-blue-700 hover:bg-blue-700 dark:bg-transparent focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 dark:border-blue-600 dark:hover:bg-blue-600 focus:outline-none dark:focus:ring-blue-800 transition duration-150 ease-out;
}
}
.text-highlight {
@apply text-blue-700 dark:text-blue-600;
}