trix.css 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. @custom-variant active {
  2. &:where(&:active, [data-trix-active]) {
  3. @slot;
  4. }
  5. }
  6. .trix-content {
  7. @apply prose leading-normal prose-h1:mt-0 prose-h1:mb-2 prose-h1:text-xl
  8. prose-p:mt-0 prose-p:mb-2 prose-a:underline prose-blockquote:mt-0
  9. prose-blockquote:mb-2 prose-pre:mt-0 prose-pre:mb-2 prose-ol:mt-0 prose-ol:mb-2
  10. prose-ul:mt-0 prose-ul:mb-2 prose-li:my-0;
  11. & :is(div, p) + h1 {
  12. @apply mt-4;
  13. }
  14. & :first-child {
  15. @apply mt-0;
  16. }
  17. & :last-child {
  18. @apply mb-0;
  19. }
  20. --tw-prose-body: var(--p-text-color);
  21. --tw-prose-headings: var(--p-primary-color);
  22. --tw-prose-lead: var(--p-primary-color);
  23. --tw-prose-links: var(--p-primary-color);
  24. --tw-prose-bold: var(--p-text-hover-color);
  25. --tw-prose-counters: var(--p-text-color);
  26. --tw-prose-bullets: var(--p-primary-color);
  27. --tw-prose-hr: var(--p-text-muted-color);
  28. --tw-prose-quotes: var(--p-text-color);
  29. --tw-prose-quote-borders: var(--p-primary-color);
  30. --tw-prose-captions: var(--p-text-hover-color);
  31. --tw-prose-code: var(--p-text-muted-color);
  32. --tw-prose-pre-code: var(--p-content-hover-color);
  33. --tw-prose-pre-bg: var(--p-content-hover-background);
  34. --tw-prose-th-borders: var(--p-content-border-color);
  35. --tw-prose-td-borders: var(--p-content-border-color);
  36. /*
  37. --tw-prose-invert-body: var(--color-pink-200);
  38. --tw-prose-invert-headings: var(--color-white);
  39. --tw-prose-invert-lead: var(--color-pink-300);
  40. --tw-prose-invert-links: var(--color-white);
  41. --tw-prose-invert-bold: var(--color-white);
  42. --tw-prose-invert-counters: var(--color-pink-400);
  43. --tw-prose-invert-bullets: var(--color-pink-600);
  44. --tw-prose-invert-hr: var(--color-pink-700);
  45. --tw-prose-invert-quotes: var(--color-pink-100);
  46. --tw-prose-invert-quote-borders: var(--color-pink-700);
  47. --tw-prose-invert-captions: var(--color-pink-400);
  48. --tw-prose-invert-code: var(--color-white);
  49. --tw-prose-invert-pre-code: var(--color-pink-300);
  50. --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
  51. --tw-prose-invert-th-borders: var(--color-pink-600);
  52. --tw-prose-invert-td-borders: var(--color-pink-700);
  53. */
  54. }