mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 17:35:10 +03:00
codex/fix-tanstack-e2e
14
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Saxon FletcherandDanny White
|
cd77bebafd |
chore(ui): refresh shared button styles (#50197)
## What kind of change does this PR introduce? UI polish / design system: refreshed button styles, related token tweaks, and a shared floating-button plate. Resolves DEPR-652. ## What is the current behavior? Default, primary, and secondary buttons use older fills, borders, and hover treatments. Primary still leans on brand scale utilities. Default fills don’t always read as raised chrome across surfaces, and floating copy / expand / scroll controls can let busy content show through translucent fills. Call sites hand-roll `rounded-* bg-background` wrappers for that. ## What is the new behavior? Refreshes primary, default, and secondary buttons with medium-weight labels, subtle shadows and inset edges, and smoother transitions. Light-mode default buttons use a raised fill with an accent hover state, primary text is brighter, and inline keyboard shortcuts inherit the button’s colour. Adds `FloatingPlate`: an opaque `bg-popover` shell for floating default buttons (and small clusters). Migrates Studio, Docs-related patterns, www, and `ui-patterns` floaters onto it so busy content no longer shows through translucent fills. Positioning, z-index, and hover/focus reveal stay on the plate’s `className`. Use `rounded="full"` for pills. Also: - Moves primary onto semantic `--primary` / `--primary-hover` (with a light-theme override) instead of brand utility fills - Tokenises button shadows as `--button-shadow-drop` / `--button-shadow-raised` / `--button-shadow-default` on the Button base - Aligns hover direction: darken on light mode, lighten on dark mode for both default and primary - Default fill stays opaque `bg-card` in light (occlusion) and translucent `bg-muted` in dark (adapts to the local surface) - Documents fills and `FloatingPlate` on the design-system Button page (with a live example) - Scales shared radius tokens in Studio and www; medium+ Button sizes use a proportionally softer radius - Fixes www nav CTA centering (`lg:inline-flex` instead of `lg:block`) - Query detail Expand/Collapse wires `aria-expanded` / `aria-controls` | Before | After | | --- | --- | | <img width="1074" height="438" alt="CleanShot 2026-09-18 at 15 52 51@2x" src="https://github.com/user-attachments/assets/ef43da21-b053-4b7e-9ac4-ab8b428228ab" /> | <img width="1090" height="464" alt="CleanShot 2026-09-18 at 15 50 59@2x" src="https://github.com/user-attachments/assets/2ddc55fc-4c8d-499c-a280-f3db3d99023c" /> | | <img width="1082" height="446" alt="CleanShot 2026-09-18 at 15 52 35@2x" src="https://github.com/user-attachments/assets/3dd5452d-325a-4e4a-a79d-26c6c6950a31" /> | <img width="1078" height="446" alt="CleanShot 2026-09-18 at 15 51 13@2x" src="https://github.com/user-attachments/assets/93666385-3e6e-42e0-9891-9cd6bb935b67" /> | ## To test ### Design system - [Button page](https://design-system-git-chore-button-styles-supabase.vercel.app/design-system/docs/components/button): default / primary in light and dark; hover should darken on light, lighten on dark - Same page: [Floating over content](https://design-system-git-chore-button-styles-supabase.vercel.app/design-system/docs/components/button#floating-over-content) / [Floating plate](https://design-system-git-chore-button-styles-supabase.vercel.app/design-system/docs/components/button#floating-plate) example; Copy over SQL should stay opaque - Spot-check hover on a code preview Copy control ### Docs [Docs deploy preview](https://docs-git-chore-button-styles-supabase.vercel.app/docs): - [Docs homepage](https://docs-git-chore-button-styles-supabase.vercel.app/docs): top-right **Sign up** / **Dashboard** primary; menu icon beside it (default icon button) - Shrink below `lg` and open the hamburger drawer: bottom **Sign in** (default) + **Start your project** (primary) medium block buttons - Tab once for **Skip to content** (FloatingPlate) - [MCP guide](https://docs-git-chore-button-styles-supabase.vercel.app/docs/guides/ai-tools/mcp): project picker - [Apple login](https://docs-git-chore-button-styles-supabase.vercel.app/docs/guides/auth/social-login/auth-apple): **Generate Secret Key** button in the Apple Secret Generator - Optional opacity check: any guide code block Copy control (e.g. at the bottom of [Import data into Supabase](https://docs-git-chore-button-styles-supabase.vercel.app/docs/guides/database/import-data)) ### Studio [Studio deploy preview](https://studio-staging-git-chore-button-styles-supabase.vercel.app/): - **Observability → Query Performance**: open a query detail → Expand/Collapse pill + SQL Copy chip (dark: no bleed-through) - **Observability → Query Insights**: select a query → Clear query pill - **Table Editor → any table → Definition** → floating **Open in SQL Editor** - **Connect → Framework → Add files**: Copy on the code tabs (FloatingPlate; light hover follow-up is DEPR-694) - Tab once for **Skip to content** ### WWW - [www deploy preview](https://zone-www-dot-com-git-chore-button-styles-supabase.vercel.app/): nav Sign in / Start your project vertical centering; hero medium CTAs radius --------- Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com> |
||
|
Danny White
|
ec53175b8a |
refactor(ui): rename text-brand to text-primary (#50564)
## What kind of change does this PR introduce? Refactor. Follow-up to #49871. ## What is the current behavior? Branded (green) text still uses the `text-brand` classname while the colour comes from `--primary`. ## What is the new behavior? **Rename-only:** `text-brand` → `text-primary` across callsites and docs. Leftover `bg-brand` / `border-brand` alias to `brand-default`. No intentional colour changes in this PR. This better matches how we treat our green in other components and props, like `variant="primary"` for green buttons. ## To test On light mode: smoke-test that branded text still looks like #49871 (readable green, not the bright fill). - [Homepage](https://zone-www-dot-com-git-dnywh-depr-316-text-brand-de2380-supabase.vercel.app/): “Scale to millions” uses `text-primary` - [Docs homepage](https://docs-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/docs): branded links like “More on self-hosting” are still readable - [Typography docs](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/typography): documents `text-primary` - [Colour usage](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/color-usage): `text-primary` is visibly darker than `bg-brand-default` _on light mode_ - [Studio auth providers](https://studio-staging-git-dnywh-depr-316-text-brand-to-60fa6c-supabase.vercel.app/dashboard/project/_/auth/providers): enabled provider badge text readable; status dot stays bright green <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Updated branded text, link hover states, icons, badges, indicators, and highlighted content across the Design System, Docs, Studio, Learn, UI Library, and marketing experiences to use the primary theme color. * Updated syntax highlighting and table-of-contents styling for consistent primary-color presentation. * Refined brand color fallback behavior for bright fills and borders. * **Documentation** * Updated color-usage and typography guidance to recommend the primary text utility. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny WhiteandJoshen Lim
|
a31ca2bad0 |
fix(ui): make brand text readable across themes (#49871)
## What kind of change does this PR introduce? Bug fix and design-system update. Resolves DEPR-316. Follow-up rename (`text-brand` → `text-primary`) is in a dedicated PR (https://github.com/supabase/supabase/pull/50564) stacked on this one. ## What is the current behavior? `text-brand` resolves to the canonical bright brand green in places that need readable text, which fails WCAG AA on light surfaces. A separate `text-brand-display` token adds another green for large type. ## What is the new behavior? - `text-brand` maps to accessible `--primary` (light mode darkened to meet ~4.5:1 AA) - `--hue` / `--primary-hue` aligned to 157.5 - `text-brand-display` removed; former display callsites use `text-brand` - Bright fills/borders stay on `brand-default` - Design-system colour and typography docs updated | Before | After | | --- | --- | | <img width="514" height="112" alt="CleanShot 2026-09-02 at 11 13 09@2x" src="https://github.com/user-attachments/assets/4e0138a9-a32d-4e4c-a426-90736706e1e7" /> | <img width="512" height="138" alt="CleanShot 2026-09-21 at 11 42 05@2x" src="https://github.com/user-attachments/assets/164cc5b1-a0c5-4e93-95f1-80016641a114" /> | | <img width="864" height="266" alt="CleanShot 2026-09-02 at 11 13 53@2x" src="https://github.com/user-attachments/assets/3c1ca53f-bf9e-431e-bc15-816b4a275b8e" /> | <img width="882" height="248" alt="CleanShot 2026-09-21 at 11 41 37@2x" src="https://github.com/user-attachments/assets/24828e7b-ed6b-44cb-b9dc-becc3398bdfc" /> | | <img width="782" height="692" alt="CleanShot 2026-09-02 at 11 16 30@2x" src="https://github.com/user-attachments/assets/fc871977-77bc-47fb-9e0e-9284e0ecd5cc" /> | <img width="730" height="690" alt="CleanShot 2026-09-21 at 11 42 52@2x" src="https://github.com/user-attachments/assets/bf479515-d5f9-471e-b82d-f097c0f4b56c" /> | | <img width="480" height="306" alt="CleanShot 2026-09-02 at 11 18 53@2x" src="https://github.com/user-attachments/assets/03f341f4-f02e-44f8-a2b2-8c31670d0427" /> | <img width="470" height="300" alt="CleanShot 2026-09-21 at 11 43 19@2x" src="https://github.com/user-attachments/assets/9df18217-d5e6-48b8-ba0b-579d2664b94b" /> | | <img width="960" height="300" alt="CleanShot 2026-09-02 at 11 32 04@2x" src="https://github.com/user-attachments/assets/6b1d9373-7a71-4247-81ff-26441604b09d" /> | <img width="980" height="306" alt="CleanShot 2026-09-21 at 11 44 13@2x" src="https://github.com/user-attachments/assets/41ad4784-02ec-4b29-b860-32af9fa79aa8" /> | | <img width="924" height="214" alt="CleanShot 2026-09-02 at 11 34 44@2x" src="https://github.com/user-attachments/assets/1de661fe-c7b6-499b-a94f-e4737436ec79" /> | <img width="752" height="162" alt="CleanShot 2026-09-21 at 11 44 56@2x" src="https://github.com/user-attachments/assets/1811890f-0660-4445-84e9-447720954fa1" /> | ## To test Test each callsite **in light mode** (dark mode is largely unchanged). ### WWW - [Homepage](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/): “Scale to millions” uses readable brand text (display token is gone) - [Careers](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/careers): small “Careers” eyebrow readable; green dividers stay bright `brand-default` - [Contact](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/contact-us): email / policy links use readable brand text - [Regions](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/regions): “Ask about early access to BYOC” readable ### Docs - [Docs homepage](https://docs-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs): “DOCS” wordmark and resource links readable - [Database overview](https://docs-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/guides/database/overview): nav / footer brand links readable - [JavaScript reference](https://docs-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/reference/javascript/introduction): active sidebar treatment readable ### Design system - [Typography](https://design-system-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/typography): documents `text-brand` only (no display) - [Colour usage](https://design-system-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/color-usage): `text-brand` vs `bg-brand-default` - [Design-system homepage](https://design-system-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/): brand text examples across themes ### Studio - [Auth providers](https://studio-staging-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/dashboard/project/_/auth/providers): enabled provider badge text readable; status dot stays bright - [Database policies](https://studio-staging-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/dashboard/project/_/database/policies?new=true): template hover text more legible - [Database connections](https://studio-staging-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/dashboard/project/_/observability/connections): “Live” status readable; animated dot stays bright green --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Danny White
|
512201dcd0 |
chore(ui): remove the Classic Dark theme (#50387)
## What kind of change does this PR introduce? Chore. ## What is the current behaviour? Classic Dark remains available across the shared theme library and several apps. Studio now supports System, Dark, and Light as its theme modes, but still carries compatibility paths for Classic Dark. ## What is the new behaviour? - Removes Classic Dark from shared theme options, application commands, stylesheets, previews, examples, and replay handling. - Deletes the Classic Dark and faux Classic Dark stylesheets. - Removes the now-unused Classic Dark branches from Studio theme colour controls. - Migrates `classic-dark` to `dark` so first rendered frame renders Dark (not Light) | After | | --- | | <img width="1458" height="1778" alt="CleanShot 2026-09-18 at 11 07 40@2x" src="https://github.com/user-attachments/assets/679bf87f-a3c1-4599-ad2f-292d98d0b856" /> | ## To test 1. In Studio, open Account Preferences → Appearance. Confirm the available themes are System, Dark, and Light, and that theme colour controls still work in each resolved mode. 2. Set the `theme` local storage value to `classic-dark`, then reload Studio. Confirm it renders as Dark immediately and the stored value becomes `dark`. 3. Open the theme switcher in Design System, Learn, and UI Library. Confirm Classic Dark is no longer available and Light, Dark, and System still apply correctly. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Changes** * Removed the Classic Dark theme option from theme menus and settings across the application. * Classic Dark selections are automatically migrated to the standard Dark theme. * Updated theme documentation and demonstrations to list only System, Light, and Dark. * Removed Classic Dark styling and preview support; existing Dark, Light, and System themes remain available. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
claude[bot]andClaude
|
86854671e9 |
feat(www): add Open Authorization Integration Addendum (#48804)
<!-- ccr-slack-attribution --> _Requested by **Nicole Kramer** · [Slack thread](https://supabase.slack.com/archives/C0161K73J1J/p1786027145751449)_ ## 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? Feature — a new legal page on the marketing site (`apps/www`). ## What is the current behavior? **Before:** the Program Addenda page at `/legal/partner-resources/program-addenda` lists exactly one addendum, the Integration Partner Addendum. There is no published Open Authorization (OAuth) addendum anywhere on the site. ## What is the new behavior? **After:** the Program Addenda page also lists the **Open Authorization Integration Addendum**, linking to a new page at `/legal/partner-resources/program-addenda/oauth-partner-addendum`. Formatting, breadcrumbs, version selector, and listing badge all match the existing Integration Partner Addendum. **How:** three files. - `apps/www/data/legal/partner-resources/oauth-partner-addendum/20260806-v1.mdx` — the addendum text, formatted to match `integration-partner-addendum/20260615-v1.1.mdx` (escaped section-number periods, `####` run-in headings for the lettered subsections, italic `_Label_` run-in labels for the enumerated data-protection clauses, explicit `[url](url)` links). - `apps/www/pages/legal/partner-resources/program-addenda/oauth-partner-addendum.tsx` — the page, mirroring `integration-partner-addendum.tsx` with a single-version `versions` array. - `apps/www/lib/addenda.ts` — adds a small `TITLE_OVERRIDES` map. The listing derives titles by capitalizing slug words, which turns `oauth-partner-addendum` into "Oauth Partner Addendum"; the override makes the listing link read the same as the page's `h1`. No other wiring was needed: the addenda listing is generated from the directory, so there is no hub entry, redirect, rewrite, sitemap entry, or `noindex` rule to add. ## Additional context Two things for the requester to confirm: - **The effective date is an assumption.** The addendum document itself contains no date. The listing and version label derive the effective date from the `YYYYMMDD` filename prefix, so this file is dated **August 6, 2026**, taken from the source document's own filename (`2026.08.06 - Supabase-OAuthAddendum-ONLINE.docx`). To change it, rename the file — no code change required. - **The legal text is a verbatim transcription.** Source wording, capitalization, and punctuation are preserved exactly as drafted, including anything that reads like a typo. Only markup was added; the plain text was diffed against the transcription and is character-identical. Please review the wording itself rather than assuming it was copy-edited. One wording choice that was not in the source document: the page subheader, "An addendum to the Master Partner Program Agreement governing OAuth integrations." It mirrors the one-line subheader style of the existing addendum page and is easy to reword. ## Also fixed here: a literal `(c)` rendered as `©` in legal headings While formatting the new addendum we hit a rendering bug that turned out to be **already live on supabase.com**, not new to this branch. The heading font, **Manrope**, ships a default-on standard `liga` feature that maps the glyph sequence `parenleft c parenright` to the copyright glyph. So a literal `(c)` anywhere inside an `h2`–`h6` on the marketing site paints as `©`. Body copy is unaffected because it uses Inter, whose subset has no such ligature — which is why this only ever shows up in headings. This branch adds a `legal-prose` utility (`font-variant-ligatures: no-common-ligatures`) in `apps/www/styles/globals.css` and applies it to two pages: - the new **Open Authorization Integration Addendum** page (heading `#### (c) Security.`), and - the **Master Partner Program Agreement** page, where the `#### (b) Such indemnity …` heading in section 17.1 contains `… ; or (c) replace the Covered Materials …` about 600 characters into the line. That page was **already published**, and rendered "or © replace the Covered Materials" in production. The MPPA change is one word — `className="prose"` → `className="prose legal-prose"`. **No legal text was modified**: no HTML entities, no zero-width characters, no rewording, no re-hyphenation. The DOM still holds `U+0028 U+0063 U+0029`; only the font's shaping is suppressed. Verified in Chromium against the real heading text and the same two font subsets `next/font` serves: the `(c)` run measures **15.36px** before the fix (a single `©` glyph) and **22.05px** after (three literal glyphs), against a 23.30px control for the `(b)` in the same heading. All 17 `.mdx` files under `apps/www/data/legal/` were swept for `(c)` and the other Manrope `liga` input sequences (`--`, `->`, `<-`, `(>)`, `<3`) on heading lines. The only two hits are the two pages fixed above; nothing else needs the utility today. (Headings do contain `ff`/`fi`/`fl`/`tt` — those ligatures are ordinary typography and are intentionally left alone.) **For future legal pages:** because the cause is the heading font's default ligature rather than anything about these documents, any new legal page whose source has `(c)` in a heading will need `legal-prose` on its prose container too. **One side effect worth flagging:** `no-common-ligatures` is blunt, so on those two pages it also suppresses the ordinary `fi`, `ff` and `tt` ligatures — a sweep of the legal `.mdx` files counts 107 such occurrences in headings (`fi` 83, `ff` 21, `tt` 3, `fl` 0), so the note above about leaving them alone holds for the rest of the site rather than for these two pages. That is a deliberate trade-off: correctness of the legal text beats typographic polish on two addendum pages. A narrower alternative exists — `font-feature-settings: "liga" 0` scoped to just the offending ligature, or overriding only the `parenleft_c_parenright` substitution — but it is more fragile and more subset-specific, so push back here if you would rather have that instead. 🤖 Generated with [Claude Code](https://claude.com/claude-code) https://claude.ai/code/session_01VtcJJGqw5jL1ESwhs8DGCu --------- Co-authored-by: Claude <noreply@anthropic.com> |
||
|
Saxon FletcherandClaude Opus 4.8
|
fb02182e86 |
Color system (#47288)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES/NO ## What kind of change does this PR introduce? Bug fix, feature, docs update, ... ## What is the current behavior? Please link any relevant issues here. ## What is the new behavior? Feel free to include screenshots if it includes visual changes. ## Additional context Add any other context or screenshots. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Refreshed theming across the UI to use modern color expressions and shared theme variables (including OKLCH-based gradients), improving consistency for charts, code blocks, overlays, icons, and decorative backgrounds. * **Bug Fixes** * Improved light/dark color and gradient consistency across axis/grid styling, reference lines, buttons/badges, sidebar accents, loaders, and other visual components. * **Documentation** * Updated styling/theming guidance to align with the revised semantic token system and the updated theme variable usage patterns. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com> |
||
|
Francesco Sansalvadore
|
aa764e4013 |
chore(www): refine www styling (#47499)
### Logo positioning bug on Safari #### Before <img width="1538" height="1404" alt="CleanShot 2026-07-01 at 07 11 55@2x_b0d735b7df6470afb861f4e82cfeed554743cec621475197e07ff39a98c5c506" src="https://github.com/user-attachments/assets/dc8483bd-5a2a-4d89-9b90-d0ab3529b4b5" /> #### After <img width="1177" height="526" alt="Screenshot 2026-07-01 at 15 25 59" src="https://github.com/user-attachments/assets/e5ab66eb-56eb-4f1b-8a66-783aafad069d" /> ### Uniform h1 styling #### Before Font-weight too heavy <img width="721" height="504" alt="Screenshot 2026-07-01 at 15 55 53" src="https://github.com/user-attachments/assets/4dc4e157-f746-4626-9ec7-5e893d7155ba" /> #### After <img width="693" height="410" alt="Screenshot 2026-07-01 at 15 56 04" src="https://github.com/user-attachments/assets/c012d6e5-0889-4466-b2b2-56d1c9516e27" /> ### AI Builders platform card ### Before <img width="675" height="573" alt="Screenshot 2026-07-01 at 16 18 31" src="https://github.com/user-attachments/assets/a34e2fde-115b-45e8-8d44-9fc32c22c0a1" /> ### After <img width="640" height="576" alt="Screenshot 2026-07-01 at 16 18 23" src="https://github.com/user-attachments/assets/45ebf1c7-6508-40de-a755-dda17824979a" /> ### Logo theme-awareness on 404 page #### Before <img width="1053" height="670" alt="Screenshot 2026-07-02 at 11 22 45" src="https://github.com/user-attachments/assets/d1f45cc8-00ad-48ad-a21a-3b92bf6097f0" /> #### After <img width="1053" height="666" alt="Screenshot 2026-07-02 at 11 22 28" src="https://github.com/user-attachments/assets/8b6435aa-da87-46f3-9d5c-750f8222edb1" /> --- Plus other minor padding/spacing issues: - remove customer stories in homepage - use correct container width and align "Use Supabase with [framework]" section - restore default `--font-sm` sizing as it resulted too small for www <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes / UI Improvements** * Refined spacing, layout, and responsive styling across multiple homepage sections. * Improved featured logo positioning and adjusted community/hero copy sizing. * Updated site typography for better readability and wrapping. * Refreshed the 404 experience with a smoother reveal animation and consistent layout. * Updated deep dark-mode behavior to apply only during launch weeks. * **Performance** * Lazy-loaded multiple homepage sections to improve initial load and perceived speed. * **SEO / New Features** * Added a dedicated 404 page that disables indexing. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Francesco Sansalvadore
|
acbb19a69a |
feat: www & docs fonts (#47227)
Update marketing website and docs with new sans-serif fonts: - `Inter` - sans-serif for all body text - `Manrope` - sans-serif for headings PR breakdown of #43455 Related: #47226 #47228 #47236 |
||
|
Gildas Garcia
|
70c3bafe63 |
chore: CSS cleanup (#47443)
## Problem - We have unused CSS from previous design system (`.sbui-*` classes) - We use Tailwind `@apply` when we could set the tailwind classes on the components directly ## Solution - Delete all `.sbui-*` classes as we don't use them anymore - Move classes directly on components when that make sense ## Notes I did not migrate all `sbgrid` classes as they are applied in multiple components <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Updated grid editors, placeholders, headers, and dropdowns for cleaner spacing, truncation, and alignment. * Improved layout consistency across text, number, time, JSON, and foreign-key cells. * Adjusted search and impersonation inputs for better fit and padding. * **Chores** * Simplified and removed outdated styling overrides across the Studio and web app. * Reduced unused UI package surface by removing an unused input icon container export. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Francesco Sansalvadore
|
ba133afc4c |
www: blog (#47236)
Update blog layout. PR breakdown of #43455 Related: #47226 #47227 #47228 |
||
|
Francesco Sansalvadore
|
cd62b0b9d4 |
www: product pages (#47271)
Update product pages in marketing website. PR breakdown of #43455 Related: #47226 #47227 #47228 #47236 |
||
|
Francesco Sansalvadore
|
90ef7ea874 |
www: standardize container width (#47226)
Define and clean up standard container width definition for marketing website. PR breakdown of #43455 Related: #47227 #47228 #47236 |
||
|
Ivan Vasilov
|
0abe792889 |
chore: Migrate the main Tailwind JS config to CSS (#45686)
This PR migrates the JS config for Tailwind into a CSS config. As such, all variables have been defined as CSS variables and they're using the specialized Tailwind syntax for generating utility classes. Beside the migration, these changes were also added: - Added `tailwind.config.css` to few packages to make the Tailwind Intellisense work. - Migrated away from Radix style color classes to our defined classes, the values will remain the same. - Most of the CSS is generated by scripts, they'll be removed in next PRs. * Removed redundant `border-light` classes from several components since it was undefined. * Removed redundant `text-strong` classes from several components since it was undefined. How to test: - Open all apps, compare the UI (mainly colors) to builds from #45417 and try to find a difference. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Harmonized color variable usages and updated UI color references (affects palettes, charts, gradients, hero illustrations, and scrollbars). * Tweaked border, tab, and selection visuals across components. * **New Features** * Added a suite of theme animations and refined typography presets used by site prose and docs. * **Refactor** * Overhauled Tailwind/theme configuration and color token generation for more consistent theming. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ivan VasilovandClaude Sonnet 4.6
|
afd690ada5 |
chore: Migrate all apps to use Tailwind CSS configs (#45530)
This PR migrates all tailwind configs in the apps to be CSS configs. They import a shared CSS Tailwind config from the `config` package (which in turns imports the old JS config). The shared JS config will be migrated to CSS in a followup PR. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Chores** * Centralized Tailwind into a config-driven entrypoint and updated the app build flow to use the new build step; many apps now import unified global styles. * **Style** * Migrated global styles to a Tailwind v4-style setup, added project-wide content scanning, consolidated theme imports, standardized theme tokens (including new --container-site max-width), and added a small prose utility to remove paragraph margins. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com> |