## 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 -->
## What kind of change does this PR introduce?
bug fix careers page on anchor link click
## What is the current behavior?
on `/careers`, clicking "open positions", scrolling down and back up,
then clicking it again crashes the page
## What is the new behavior?
destructuring defaults on the page props, so an empty-props render is
harmless instead of fatal _ prefetch still returns `{}`, but the
sequence now renders normally instead of throwin
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Improved the careers page so it renders correctly when job listings,
placeholder job details, or contributor information are unavailable.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Add number of open position on the main cta button in the careers page.
## Before
<img width="1328" height="614" alt="Screenshot 2026-09-08 at 16 57 24"
src="https://github.com/user-attachments/assets/7c640e52-afdf-4e77-9705-fe539ed045a7"
/>
## After
<img width="1352" height="639" alt="Screenshot 2026-09-08 at 16 57 05"
src="https://github.com/user-attachments/assets/40c265dd-b28e-44e7-9170-f45a330edfbb"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* The careers page now displays the current number of open positions.
* The “Open positions” call-to-action includes the position count and
uses a medium-sized button style.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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?
Noticed this by accident, simplified the apply button area sizing on
large screens.
| Before | After |
|--------|--------|
| <img width="390" height="228" alt="Screenshot 2026-08-27 at 15 25 36"
src="https://github.com/user-attachments/assets/7f49021c-1332-4a00-b19c-5544537c1cb4"
/> | <img width="491" height="274" alt="Screenshot 2026-08-27 at 15 45
11"
src="https://github.com/user-attachments/assets/846faff8-bd72-4141-b8d4-01d7ddd97b6d"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Improved job listing badge layout and responsiveness.
* Long location names now truncate cleanly instead of overflowing.
* Reduced location icon size for a more balanced presentation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- ccr-slack-attribution -->
_Requested by **Dasha Nikolov, Ivan Vasilov** · [Slack
thread](https://supabase.slack.com/archives/C0161K73J1J/p1785158372513869?thread_ts=1785158372.513869&cid=C0161K73J1J)_
**Before:** the careers page lists open roles under one heading per
individual team (Auth, Data API, Functions, Realtime, Storage, ...).
**After:** roles are grouped under their top-level department heading
(Engineering, Design, ...), collapsing the per-team split.
## 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 / enhancement to the marketing site (`apps/www`) careers page.
## What is the current behavior?
Open positions on the careers page are grouped by individual team,
producing one `<h3>` heading per team (Auth, Data API, Functions,
Realtime, Storage, ...). This fragments the list into many small groups.
## What is the new behavior?
Roles are grouped under their top-level department heading (Engineering,
Design, ...), so related teams are collapsed under a single department
section.
**How:** added a `department: string` field to `JobItemProps` and group
on `job.department` (from the Ashby public job-board API, which returns
both `department` and `team` as top-level strings per posting) instead
of `job.team`. `groupJobsByTeam` is replaced by `groupJobsByDepartment`
(it had no other callers), `getServerSideProps` now calls it, and the
render loop was updated to key on and display the department heading.
All styling, keys, and job rendering are unchanged.
## Additional context
A Vercel preview deploy will show the result on the careers page.
---
_Generated by [Claude
Code](https://claude.ai/code/session_01GEvKydFSLsHhpBbNJ2PEzg)_
---------
Co-authored-by: Claude <noreply@anthropic.com>
before
<img width="1360" height="564" alt="Screenshot 2026-06-17 at 11 30 45"
src="https://github.com/user-attachments/assets/69516e92-0c3d-42ad-b893-2d6ffdf9e9f8"
/>
after
<img width="1351" height="596" alt="Screenshot 2026-06-17 at 11 31 29"
src="https://github.com/user-attachments/assets/8c78e4c5-f46b-4419-87bd-d689982c3f5b"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Refined the visual presentation of the "Open positions" call-to-action
button on the careers page with improved spacing and layout alignment.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.
## Solution
- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code
## How to test
As this is just prop renaming, if it builds it's ok
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
## Problem
The contributors section on /careers has a fixed `w-[1080px]` container
with no max-width constraint. On mobile viewports this causes horizontal
overflow and breaks the page layout.
## Fix
Added `max-w-full overflow-hidden` to the contributors wrapper so it
caps at 1080px on large screens and fits within the viewport on smaller
ones.
## File changed
`apps/www/pages/careers.tsx`
## Screenshots
| Before | After |
|--------|-------|
| <img
src="https://github.com/user-attachments/assets/71c2ac3b-e4b8-49cf-801b-90ecb8b41811"
width="300" /> | <img
src="https://github.com/user-attachments/assets/594465f4-2ca7-4858-89ef-dee71eb37415"
width="300" /> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Bug Fixes
* Fixed overflow in the contributors section to prevent content spilling
and ensure background clipping.
* Improved layout stability so contributor avatars and content render
consistently across screen sizes.
* Resolved visual glitch that could cause unintended scroll or layout
shifts within the contributors area.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45923)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Summary
- Adds `breadcrumbListSchema(items)` helper to `apps/www/lib/json-ld.ts`
and a hand-curated `apps/www/lib/breadcrumbs.ts` route map.
- Wires inline `<script type="application/ld+json">` BreadcrumbList
blocks into 18 marketing surfaces: blog (index + slug), customers (index
+ slug), events (index + slug), 5 product pages (database, auth,
storage, edge-functions, realtime), 3 modules (vector, cron, queues),
pricing, careers, company, features.
- Pages router callers wrap the script in `<Head>`; app router callers
place it directly in JSX. Dynamic surfaces append a leaf at render time
using the page's title (`frontmatter.title` for blog, `meta_title ??
title` for customers, `event.meta_title ?? event.title` for events).
- Modules sit at `Home > {Name}` since no `/modules` index page exists;
products sit at `Home > {Product}` (no shared products parent). Absolute
`https://supabase.com` URLs match the existing `CANONICAL_ORIGIN`
convention so anchors stay stable across Vercel previews.
Linear:
[GROWTH-822](https://linear.app/supabase/issue/GROWTH-822/add-breadcrumblist-json-ld-to-www-marketing-surfaces)
(sub-issue under
[GROWTH-724](https://linear.app/supabase/issue/GROWTH-724)).
> **Note on branch name:** the branch is
`pamela/growth-820-www-breadcrumb-jsonld`; the actual Linear issue is
GROWTH-822. The branch was named before the sub-issue was created.
Ignore the `820` in the branch.
Explicitly deferred (separate PRs / low SEO ROI): `/launch-week/*`,
`/solutions/*`, `/partners/*`, `/alternatives/*`, `/changelog`,
`/legal/dpa`, `/aws-reinvent-2025`, `/wrapped`, `/contribute/*`,
`/brand-assets`, `/ga`, `/ga-week`, `/state-of-startups*`, and the
homepage (Organization + WebSite already cover homepage entity signals;
single-item BreadcrumbList is ignored by Google).
## Test plan
- [x] On the Vercel preview, `curl -s https://<preview>/database | grep
'"BreadcrumbList"'` returns the script block with `Home > Database`.
- [x] `curl -s https://<preview>/blog/<recent-slug> | grep
'"BreadcrumbList"'` returns `Home > Blog > {post title}`.
- [x] `curl -s https://<preview>/customers/<slug> | grep
'"BreadcrumbList"'` returns `Home > Customer Stories > {customer
title}`.
- [x] `curl -s https://<preview>/events/<slug> | grep
'"BreadcrumbList"'` returns `Home > Events > {event title}`.
- [x] `curl -s https://<preview>/modules/vector | grep
'"BreadcrumbList"'` returns `Home > Vector`.
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.
---------
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
This PR preps the monorepo for a migration to Tailwind v4:
- Bump all Tailwind dependencies and libraries to the latest possible
version, while still compatible with Tailwind 3.
- Cleans up obsolete Tailwind 3 specific options and configs.
- Cleans up unused CSS files and fixes the CSS imports.
- Migrates all `important` uses in `@apply` lines to using the `!`
prefix.
- Move `typography.css` to the `config` package and import it from the
apps.
- Migrated all occurrences of `flex-grow`, `flex-shrink`,
`overflow-clip` and `overflow-ellipsis` since they're deprecated and
will be removed in Tailwind 4.
- Make the default theme object typesafe in the `ui` package.
- Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and
`divider-opacity` to the new format where they're declared as part of
the property color.
- Bump and unify all imports of `postcss` dependency.
## Problem
We'd like to update react to `19` but many of our dependencies don't
support it.
## Solution
Update those dependencies. This PR focuses on `react-markdown`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Upgraded react-markdown to 10.1.0 (and remark-gfm to 4.0.0) across
projects for improved Markdown support.
* **Style**
* Adjusted Markdown rendering so typography and spacing are applied via
surrounding containers, improving consistent styling across docs and UI.
* **New Content**
* Added a new RSS feed item for a recent blog post.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
* Add lucide-react to docs (to make the autocomplete work).
* Migrate the docs app icons.
* Migrate the ui-patterns.
* Remove the old icons from ui package.
* Migrate the www app from react-feather icons.
* Migrate all of studio icons.
* Migrate the only component in design-system.
* Fix an old import in ui package. Revert an import in docs app.
* Fix some pages in www.
* Remove unneeded files used in generation of icons.
* Fix a prettier error.
* Fix more issues in www.
* Fix an issue in Log Date picker.
* Replace all string sizes with number sizes because the icons grew in some cases.
* Fix more imports in security page.
* Fix an extra import.
* Remove the size prop from all icons if they're in a button and they match the button size.
* Minor fixes for docs and www.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Danny White
