---
type: note
tags: [mine, implemented, css, header, font, past requirement]
created: 2025-10-27T09:17:57.483Z
---# card form view section headers

Context: In the card form views of lovable.dev—used to create or edit records of type note or link—each form contains three primary sections: Main, Additional Links, and Media. These sections are visually distinguished by text headers.

Requirement: Update the styling of section headers within card form views to improve visual hierarchy and readability.

Details:

Target Elements: Headers for the following sections:

Main

Additional Links

Media

Styling Changes:

Increase font size by 25% relative to the base font size.

Apply bold font weight.

Implementation Notes:

Use semantic HTML tags (e.g., <h2> or <h3>) or apply a shared class such as .section-header.

Styling should be applied via CSS or Tailwind utility classes, depending on the current stack.

Ensure consistent spacing above and below headers to maintain layout clarity.

Example (CSS):

css
.section-header {
  font-size: 125%;
  font-weight: bold;
}
Example (Tailwind):

html
<h2 class="text-[125%] font-bold">Main</h2>
Supabase Considerations:

No schema changes required.

This is a purely frontend styling update; Supabase integration remains unaffected.


---
**Keywords:** mine, implemented, css, header, font, past requirement
