Files
kemal.earth a578708231 feat(studio): usage area brush up (#38408)
* fix: date range picker dropdown width

This fixes the date range pickers width on the Usage section. No more crumpled up menu items.

* chore: remove AI slop empty classes

* feat: get rid of legacy scaffold header on usage page

* chore: remove legacy scaffold from no permissions layout on usage

* feat: improve styling for sticky header area

* nit: small uppercase for a p

* fix: padding for no permission banner

Was missing the ScaffoldHeader wrapper

* feat: update loading skeleton for header area

* style: same breakpoints for header loading skeletons

* feat: remove ListBox in favour or Select_Shadcn_ for our project dropdown

* fix: logic for admonition when project is selected

* fix: remove rogue border from total usage grid

* fix: use proper background colour for sticky bar

* fix: more info link click area

* fix: reduce width of hover card on compute metrics

* feat: remove separator from usage section headers

* fix: revert width of hover cards for compute and billing metric

* fix type size and chevron tint

* only wrap anchored metrics in Link

otherwise non-anchored metrics get #undefined Link and unnecessary pointer

* style: shore up sections with headers

* fix: reset select state to undefined

The setSelectedProjectRef was causing our rings not to show on the usage table.

* Fixy

* Nit refactors and fixes

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-09-08 11:11:51 +01:00

21 lines
479 B
TypeScript

import { cn } from 'ui'
export interface SectionHeaderProps {
title: string
description: string
className?: string
}
const SectionHeader = ({ title, description, className }: SectionHeaderProps) => {
return (
<div className={cn('mx-auto flex flex-col gap-10 py-14', className)}>
<div>
<p className="text-xl">{title}</p>
<p className="text-sm text-foreground-light">{description}</p>
</div>
</div>
)
}
export default SectionHeader