mirror of
https://github.com/supabase/supabase.git
synced 2026-10-08 10:55:06 +03:00
Danny White
564185e81f
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? UI polish ## What is the current behavior? `--chart-success` mixes `foreground-muted` with white in both themes. That softens light mode, but brightens dark mode so OK/success segments (and the Level key/dots) read too stark. ## What is the new behavior? - Light: a bit softer (`50%` muted + white) - Dark: mixes toward `--background` instead of white so the fill is clearly softer | Before | After | | --- | --- | | <img width="1728" height="997" alt="Unified Logs Agua Basket Supabase" src="https://github.com/user-attachments/assets/c9927079-34f7-41c3-99ff-7ad7b701ac20" /> | <img width="1728" height="997" alt="Unified Logs Agua Basket Supabase" src="https://github.com/user-attachments/assets/e35e6c62-63bd-4974-aa36-4686e7b9f9e2" /> | | <img width="1728" height="997" alt="Unified Logs Agua Basket Supabase" src="https://github.com/user-attachments/assets/7c4bd3c4-739d-4fd4-bf65-b954d1df3270" /> | <img width="1728" height="997" alt="Unified Logs Agua Basket Supabase" src="https://github.com/user-attachments/assets/6b59d4f0-32f8-4cb7-b0be-6036589a364a" /> | Covers the unified logs chart, Level sidebar key, and row dots via the shared token. ## Additional context Follow-up to #47829.
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.