mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 11:55:05 +03:00
Introduces `packages/config/tailwind.config.css` as the CSS-first orchestration layer shared by every app. It collects three things that were previously duplicated across every app's main CSS entry: - `@import` of `packages/ui/build/css/source/global.css` — the design system's CSS variable definitions. - `@import` of `dark.css`, `light.css`, and `classic-dark.css` — per-mode overrides for those variables. - `@import` of `packages/config/tailwind-utilities/hit-area.css` — the v4-native `hit-area-*` utility port. And one new thing: - `@custom-variant dark` matching v3's `darkMode: ['class', '[data-theme*='dark']']` — active on `.dark` or `[data-theme*='dark']`, on the element itself or any ancestor, with zero-specificity via `:where()`. Every app's main CSS entry now reads: @import 'tailwindcss'; @import '.../packages/config/tailwind.config.css'; @import './tailwind.config.css'; @config '.../packages/config/tailwind.config.js'; The four duplicated imports (global + three themes + hit-area) disappear from each app's entry file. The `@config` bridge stays for now; the declarative theme still lives in the JS config. The next commit will merge `tailwind.config.js` and `ui.config.js` into a single JS plugin loaded by this CSS file, at which point the `@config` line goes away. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>