mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 01:45:10 +03:00
Anthony Lio
12a1fd5427
## Problem #50734 restyled single named code blocks as file tabs but code blocks grouped with `<$CodeTabs>` render through a separate path and kept the old pill style ## Solution - add a `CodeTabs` component with the same file tab styling - sets the `<$CodeTabs>` remark directive at it instead of `Tabs` - remove the unused `NamedCodeBlock` copy in www (nothing in www outputs it) | state | preview | | -------|------| | before | <img width="781" height="352" alt="image" src="https://github.com/user-attachments/assets/1e6261ae-30b7-4397-b2f4-c31bad5f9839" /> | | after | <img width="762" height="291" alt="image" src="https://github.com/user-attachments/assets/851b25ed-98b7-4a5c-8d3e-fece385e3af2" /> | <!-- ## Preview links If relevant, include links to changed pages for easy review access. Copy the preview base URL from the Vercel bot comment on this PR. Use the following table as an example template. | Site | Live | Preview | Search for | | -------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ | ----------------------------- | | WWW | [/blog/your-post](https://supabase.com/blog/your-post) | [/blog/your-post](https://zone-www-dot-com-git-branch-name-supabase.vercel.app/blog/your-post) | unique phrase from the change | | Docs | [/docs/guides/your-page](https://supabase.com/docs/guides/your-page) | [/docs/guides/your-page](https://docs-git-branch-name-supabase.vercel.app/docs/guides/your-page) | unique phrase from the change | | Studio | [/dashboard](https://supabase.com/dashboard) | [/dashboard](https://studio-git-branch-name-supabase.vercel.app/dashboard) | unique phrase from the change | | Design system | [/design-system](https://supabase.com/design-system) | [/design-system](https://design-system-git-branch-name-supabase.vercel.app/design-system) | unique phrase from the change | | UI library | [/library](https://supabase.com/library) | [/library](https://ui-library-git-branch-name-supabase.vercel.app/library) | unique phrase from the change | | Knowledge base | [/kb/guides/your-page](https://supabase.com/kb/guides/your-page) | [/kb/guides/your-page](https://kb-git-branch-name-supabase.vercel.app/kb/guides/your-page) | unique phrase from the change | --> <!-- ## Additional context Optionally add any other context or screenshots. --> ## Review instructions 1. visit [/docs/guides/getting-started/quickstarts/nextjs](https://docs-git-fix-docs-codetabs-file-tabs-supabase.vercel.app/docs/guides/getting-started/quickstarts/nextjs#7-query-supabase-data-from-nextjs) ## Checklist Check all before review: - [x] I have read [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) - [x] If I wrote a new docs topic or edited an existing topic, I used the `/write-the-docs` or `/edit-the-docs` skill, which references [WORD_LIST](https://github.com/supabase/supabase/blob/master/apps/docs/WORD_LIST.md) and the docs [CONTRIBUTING](https://github.com/supabase/supabase/blob/master/apps/docs/CONTRIBUTING.md) guide <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Documentation code samples support labeled tabs, with the first tab selected by default. * Source menus show organization and repository paths, and source links remain labeled “View source.” * **Style** * Updated code sample tabs with active-tab accents and flares, plus clearer focus outlines and depth effects. * Refined code-block spacing and presentation, including a styled source footer and updated menu alignment. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
Reference Docs
Supabase Reference Docs
Maintainers
If you are a maintainer of any tools in the Supabase ecosystem, you can use this site to provide documentation for the tools & libraries that you maintain.
DocSpec
We use documentation specifications which can be used to generate human-readable docs.
- OpenAPI: for documenting API endpoints.
- SDKSpec (custom to Supabase): for SDKs and client libraries.
- ConfigSpec (custom to Supabase): for configuration options.
- CLISpec (custom to Supabase): for CLI commands and usage.
The benefit of using custom specifications is that we can generate many other types from a strict schema (eg, HTML and manpages). It also means that we can switch to any documentation system we want. On this site we use Next.js, but on Supabase's official website, we use a custom React site and expose only a subset of the available API for each tool.
Contributing
To contribute to docs, see the developers' guide and contributing guide. If you write with an AI coding agent, use the /write-the-docs skill to draft and /edit-the-docs to revise an existing page.