Files
supabase/apps/studio/components/layouts/ProjectLayout/ProductMenuBar.tsx
T
Francesco Sansalvadore bd9e78b209 chore: dashboard header alignments (#42769)
Align borders to match header heights.

<img width="2904" height="1734" alt="shot_2026-02-04_at_08 42 21z_2x"
src="https://github.com/user-attachments/assets/0538f8eb-64a5-4329-94fb-3ea4feed847d"
/>
2026-02-13 11:48:12 +01:00

30 lines
819 B
TypeScript

import { PropsWithChildren } from 'react'
import { cn } from 'ui'
interface ProductMenuBarProps {
title: string
className?: string
}
const ProductMenuBar = ({ title, children, className }: PropsWithChildren<ProductMenuBarProps>) => {
return (
<div
/**
* id used in playwright-tests/tests/snapshot/spec/table-editor.spec.ts
* */
id="spec-click-target"
className={cn(
'flex flex-col w-full h-full', // Layout
'hide-scrollbar bg-dash-sidebar border-default'
)}
>
<div className="border-default flex min-h-[var(--header-height)] items-center border-b px-6">
<h4 className="text-lg">{title}</h4>
</div>
<div className={cn('flex-grow overflow-y-auto', className)}>{children}</div>
</div>
)
}
export default ProductMenuBar