mirror of
https://github.com/supabase/supabase.git
synced 2026-10-16 06:39:09 +03:00
fb24d91305
* update test * move back button, fix width issues on sidebar * update sidebar logic * Update ProjectLayout.tsx * lots of updates. layouts now streamlined. localstorage for tabs in use * moar * bunch of new tab logic * fix empty tab issue * Update tabs.ts * layouts switched * new pages now have fixed layouts * fix tabs * fix code bg * add tabs support for multiple project refs * intialization issue * update ID handling * fixed isOpened state for SQL snippets * remove old assistant because its bugging up panels * preview style works in sql editor * fix border * removes preview tab if there is one * fix background of loading skeleton * lots of issues with types/icons/redirect * new tab cards * snippets in empty state now work * moar stuff * tabs now in feature flags * Update tabs.ts * Update tabs.ts * moar * add feature previews * remove code not needed * Update next-env.d.ts * Delete FeaturePreviewModal.tsx * fix typescript errors. remove more explorer stuff * remove explorer files * fixed issues with templates and quickstarts tab * fixed active state when tabs are not opted in * logic error * fix open/highlight issue when opted out of tabs * templates/quickstarts now displayed with new cards * Update recent-items.tsx * Update new-tab.tsx * add icon back in * add old empty state back in * recent items updated to respect project ref * localstorage cleanup on deletion * moar * overflow tabs now working * correct tab names used for new sql templates/quickstarts * ongoing queries fix * cleanup * update images * Update RouteValidationWrapper.tsx * Update AppLayout.tsx * Update NavigationBar.tsx * add headers back into side panels * improve writing * tabs now drag and drop a billion times better * Update tabs.tsx * Update tabs.tsx * init issues on stores, which caused a race condition. * fix hydration error * init * init sidebars * init * Update app-default-navigation.tsx * user dropdown updates * moar layouts * init * moar * moar * updat * reverse top bar * some banners * moar * start adding account page * change styling of dropdowns * Update sidebar.tsx * fix new tab issue in sql * Update ProjectLayout.tsx * Update pnpm-lock.yaml * latest * Update pnpm-lock.yaml * moar layouts on account * getLayout updates * more fixes * force a cache build * moar * Update app-default-navigation.tsx * fix AI button animation * moar layout * account pages refactored * Update user-dropdown.tsx * Update new-tab.tsx * move EditorMenuListSkeleton * Fix type issues * fixes: DESIGN-87 fixes: DESIGN-87 * refactor sort/filter components * Update rules-set-button-text.tsx * remove discussions for now * small styling fixes * Update FeaturePreviewModal.tsx * Update FeaturePreviewModal.tsx * Update RouteValidationWrapper.tsx * revert * revert * revert * revert * revert * more revert * Update collapse-button.tsx * Update SQLEditorTreeViewItem.tsx * revert * Update SchemaGraph.tsx * Delete new-upcoming.tsx * revert * Update ProjectLayout.tsx * fix home link * Update table-editor.spec.ts * test update * Update projects.tsx * remove * Delete sidebar-open-top-banner.tsx * add organizations page * Update table-editor.spec.ts * Fix the playwright tests. * layout fixes * layout fix * revert sort/filter * Update LastSignInWrapper.tsx * revert * revert * remove * update file names * revert * revert * revert * advisor lint page tabs revert * revert * revert * revert * revert * revert * revert tabs * remove packages * add sidebar * sidebar docs added * add sidebar * fixed issues * fix mobile * fixes * add org side bar in * redirect updated * fix more layouts * move settings icon back down * remove old stuff * Delete SideBar.tsx * use ProfileImage component * spelling * Update ThemeSettings.tsx * Update ThemeSettings.tsx * Update Sidebar.tsx * layout udpate * Update Sidebar.tsx * fixes * Minor lints * Update Sidebar.tsx * create a alt user dropdown for self hosting and local * add fragment back in * Adds Theme Selector for local/self hosting * Update UserDropdown.tsx * fix theme selector for local self host * Update index.ts * Update DefaultLayout.tsx * now supports feature preview * remove old files * rename files * revert * Update LayoutHeader.tsx * clean * revert * revert * Update resource-banner.tsx * remove redundant side bar stuff * organizations action bar updated. removed hardcoded value * fix type errors * fix tests * Undo test changes * Fix account pages for when feature preview is off * Bug fixes 1 * Missing key in map of EmailTemplates * Fix missing border in StorageExplorer * fix missing header in performance advisor * Final clean up * Fix DefaultLayout re-rendering issue on auth pages * A couple of fixes * Redirect to /organizations if land on /projects with feature preview on * Route back to /projects if toggling preview off on /organizations * Add HomePageActions to /org/slug * make re-routing nicer * Moar fixes * Fix logging in redirect to /organizations irregardless of feature preview * Fix missing withAuth in OrganizationLayout * Minor clean upo * Fix branch dropdown not aligned * Add feature preview for update layout * update dropdowns to only be chevron triggered in new layout * Update content-query.ts * Update entity-types-infinite-query.ts * add IS_PLATFORM for org dropdown * Add IS_PLATFORM check for EnableBranchingDropdown in LayoutHeader * Midway fixing mobile nav * Mobile nav fixes * Address feedbacks --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> Co-authored-by: Alaister Young <a@alaisteryoung.com> Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> Co-authored-by: Jordi Enric <jordi.err@gmail.com>
Supabase UI Package
Figma-tokens setup
Tokens setup is based partly on blogpost on the Mirahi Digital Garden.
Transforms tokens stored on Figma Tokens using token-transformer and Style Dictionary to css-variables with references, and use them in your TailwindCSS environment with multiple themes.
Build all the styles files (css-variables and tailwind config)
npm run build-styles
This creates a directory called styles with the tokens and also CSS required.
Other examples
You can find other examples here by Jan Six
Adding new themes/sets
Add new sets by extending the scripts in package.json. Currently theme sets derive from exported/[set name] but can come from anywhere.
Adding a new set can be done with the following:
// package.json
//..
"build-transform-light": "npx token-transformer tokens.json styles/tokens/02_themes/light.json global,exported/light,theme global",
// add a new line like this:
"build-transform-new": "npx token-transformer tokens.json styles/tokens/02_themes/new.json global,new,theme global",
//..
// append the new theme/set command to end of the build-transform command
"build-transform": "npm run build-transform-global && npm run build-transform-typography && npm run build-transform-dark && npm run build-transform-light && npm run build-transform-new",