MOPC/MOPC-Portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Tremor chart colors: add @source for Tailwind v4 to scan Tremor classes
All checks were successful
Build and Push Docker Image / build (push) Successful in 8m22s
Details

Browse Source 
Tremor generates Tailwind utility classes dynamically (fill-blue-500,
bg-emerald-500, etc). Tailwind v4 auto-content detection doesn't scan
node_modules, so these classes were missing from CSS output, causing
all charts to render in black.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Matt
2026-02-21 01:14:59 +01:00
parent 533d8cb8e5
commit 350e9b96e8
1 changed files with 4 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/globals.css
View File

@@ -43,6 +43,10 @@
/* Source the JS config for extended theme values */ /* Source the JS config for extended theme values */
@config "../../tailwind.config.ts"; @config "../../tailwind.config.ts";
/* Tremor generates Tailwind utility classes dynamically (fill-blue-500, bg-emerald-500, etc.)
Tailwind v4 needs to scan Tremor's compiled JS to include them in the output. */
@source "../../node_modules/@tremor/react/dist/**/*.js";
/* Theme variables - using CSS custom properties with Tailwind v4 @theme */ /* Theme variables - using CSS custom properties with Tailwind v4 @theme */
@theme { @theme {
/* Container */ /* Container */