Fix prose-invert styling with explicit CSS variables

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
giles
2026-01-11 13:10:31 +00:00
parent 2163cbd13b
commit 889ea98e41
2 changed files with 23 additions and 12 deletions

View File

@@ -42,22 +42,33 @@ tailwind.config = {
800: '#111827',
900: '#030712',
}
},
typography: {
invert: {
css: {
'--tw-prose-body': '#d1d5db',
'--tw-prose-headings': '#f9fafb',
'--tw-prose-links': '#60a5fa',
'--tw-prose-code': '#f9fafb',
'--tw-prose-pre-bg': '#1f2937',
}
}
}
}
}
}
</script>
<style type="text/tailwindcss">
@layer utilities {
.prose-invert {
--tw-prose-body: #d1d5db;
--tw-prose-headings: #f9fafb;
--tw-prose-lead: #9ca3af;
--tw-prose-links: #60a5fa;
--tw-prose-bold: #f9fafb;
--tw-prose-counters: #9ca3af;
--tw-prose-bullets: #6b7280;
--tw-prose-hr: #374151;
--tw-prose-quotes: #f3f4f6;
--tw-prose-quote-borders: #374151;
--tw-prose-captions: #9ca3af;
--tw-prose-code: #f9fafb;
--tw-prose-pre-code: #e5e7eb;
--tw-prose-pre-bg: #1f2937;
--tw-prose-th-borders: #4b5563;
--tw-prose-td-borders: #374151;
}
}
</style>
"""
# Default pagination settings