mirror of
https://github.com/supabase/supabase.git
synced 2026-10-17 07:09:07 +03:00
* SheetProvider in studio * mobile global nav * view sub navigation * fix ProjectLayout conditional * Account mobile layout * width * hide * layout * overflow * responsive button * overflow * fix mobile nav if IS_PLATFORM * refactor * hide if no content * show command menu item on mobile * ui-patterns sheet provider * use client * show if productMenu * show if productMenu * drag to close * drag to close * 16px input fontsize on inputs to avoid zoom on mobile * offscreen test element * offscreen test element * offscreen test element * update test * update test * update test * pb * test? * test * test * test * spec-click-target * remove console * remove unused import * add dependency to sheet content * close sheet on router.asPath change * remove provider and use simple Sheet * update sidebar mobile * align labels * avoid input zoom on mobile * remove yo
Writing pages
Rough guidelines
- Try to break down your pages into smaller building blocks - components which are tightly coupled to a page can be placed within the folder
components/interfaces/xxx/...(Refer to the README.md under the components folder) - Keep to using
useStatehooks for any UI related logic, do not create MobX local stores to handle UI logic.
Template for building pages
import { NextPage } from 'next'
import { withAuth } from 'hooks/misc/withAuth'
// Import the corresponding layout based on the page
import { Layout } from 'components/layouts'
// Import the main building blocks of the page
import { ... } from 'components/interfaces/xxx'
// Import reusable UI components if needed
import { ... } from 'components/ui/xxx'
// Name your page accordingly
const Page: NextPage = () => {
return (
<Layout>
<div>Page content</div>
</Layout>
)
}
export default withAuth(Page)