tailwind.css
33 lines
| 1 | @tailwind base; |
| 2 | @tailwind components; |
| 3 | @tailwind utilities; |
| 4 | |
| 5 | /* Custom component styles using @apply */ |
| 6 | @layer components { |
| 7 | .presto-button { |
| 8 | @apply px-4 py-2 bg-presto-500 text-white rounded-md hover:bg-presto-600 focus:outline-none focus:ring-2 focus:ring-presto-500 focus:ring-offset-2 transition-colors duration-200; |
| 9 | } |
| 10 | |
| 11 | .presto-card { |
| 12 | @apply bg-white rounded-lg shadow-md p-6 border border-gray-200; |
| 13 | } |
| 14 | |
| 15 | .presto-input { |
| 16 | @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-presto-500 focus:border-presto-500; |
| 17 | } |
| 18 | |
| 19 | .presto-label { |
| 20 | @apply block text-sm font-medium text-gray-700 mb-1; |
| 21 | } |
| 22 | } |
| 23 | |
| 24 | /* Custom utility classes */ |
| 25 | @layer utilities { |
| 26 | .text-shadow { |
| 27 | text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); |
| 28 | } |
| 29 | |
| 30 | .text-shadow-lg { |
| 31 | text-shadow: 0 4px 8px rgba(0, 0, 0, 0.12); |
| 32 | } |
| 33 | } |