mirror of
https://github.com/supabase/supabase.git
synced 2026-10-14 13:49:09 +03:00
Ivan Vasilov
9fbe5152d9
# Changes ## Removed unused themes - Deleted `concept-two.css` (unused) and `dark-combined.css` which was identical to `dark.css` - Removed the alias `deep-dark` to `dark` theme since it was unused ## Removed Figma token transform scripts - Deleted the entire `internals/transform/` directory (~700 lines of JS) — these scripts transformed Figma tokens into Tailwind variables but are no longer needed - Deleted `internals/tokens/cleanse-css-for-tailwind.js` and `extract-design-tokens.js` - Removed related dependencies from `package.json` ## Removed other unused files - Deleted `shadcn.css` (unused) - Deleted `tailwind-theming.md` (outdated doc), https://supabase.com/design-system/docs/color-usage is a better resource ## Refactoring - Extracted the `motion-safe-transition` Tailwind plugin into its own file (`packages/config/tailwind-plugins/motion-safe-transition.js`) - Renamed the tailwind class generation script for clarity - Added stub `tailwind.config.js` files in packages that were missing them, so VSCode IntelliSense works in those workspaces - Updated `packages/ui/README.md` to reflect current usage patterns (imports, styling conventions) instead of outdated Figma tokens workflow # Testing - Check all apps whether they have the correct themes with the correct colors [Linear task](https://linear.app/supabase/issue/FE-3059/clean-up-unused-ui-build-artifacts-themes-and-figma-token-scripts)
Styles
When to write custom styles
Tailwind should be sufficient to cover the majority of styling needs. We typically only write custom styles here in the event where we're working with an external library and we need to override some styles (e.g Monaco, or even our own UI library).
Ideally, keep custom styling here to a minimum, use tailwind directly in the pages and components where possible, so that we have less code to maintain.
If you're writing custom styles
Group custom styles into separate stylesheets based on their context. For styles which are generic and global, we can write them in main.scss.