tailwind.css 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. @tailwind base;
  2. @tailwind components;
  3. @tailwind utilities;
  4. body {
  5. font-family: 'Inter', sans-serif;
  6. font-size: 16px;
  7. @apply bg-gray-50 dark:bg-gray-900;
  8. }
  9. table th,
  10. table td {
  11. @apply py-2 px-4;
  12. }
  13. input:focus,
  14. button:focus,
  15. textarea:focus,
  16. select:focus,
  17. [role="button"]:focus {
  18. outline: none;
  19. @apply ring-2 ring-accent dark:ring-gray-200;
  20. }
  21. .text-overflow {
  22. overflow: hidden;
  23. text-overflow: ellipsis;
  24. white-space: nowrap;
  25. }
  26. .line-clamp {
  27. display: -webkit-box;
  28. -webkit-line-clamp: 2;
  29. -webkit-box-orient: vertical;
  30. overflow: hidden;
  31. text-overflow: ellipsis;
  32. }
  33. .scroll::-webkit-scrollbar {
  34. width: 7px;
  35. height: 9px;
  36. }
  37. .scroll::-webkit-scrollbar-thumb {
  38. @apply bg-gray-300 dark:bg-gray-700;
  39. border-radius: 8px;
  40. }
  41. .scroll::-webkit-scrollbar-track {
  42. background: transparent;
  43. }
  44. .tippy-box[data-theme~='tooltip-theme'] {
  45. @apply px-2 py-1 bg-gray-900 text-sm text-gray-200 rounded-md;
  46. }
  47. @layer utilities {
  48. .hoverable {
  49. @apply hover:bg-gray-800 hover:bg-opacity-5 dark:hover:bg-gray-200 dark:hover:bg-opacity-5;
  50. }
  51. .bg-input {
  52. @apply bg-black bg-opacity-5 hover:bg-opacity-10 dark:bg-gray-200 dark:bg-opacity-5 dark:hover:bg-opacity-10;
  53. }
  54. .bg-box-transparent {
  55. @apply bg-black bg-opacity-5 dark:bg-gray-200 dark:bg-opacity-5;
  56. }
  57. }