refactor(button): consolidate button styles into Button.astro

Extends Button.astro with a center prop, native <button> element support
(type, disabled, aria-describedby), harmonised padding (.65rem), and
transition. Removes global .button, .button-small, .button-light, and
.button-center rules from components.css, layout.css, and typography.css.
Converts all inline class="button" usages across Header, HomeHero,
HomeFinancialHelp, HomeServicesIntro, FormShell, TeamPage, CareersPage,
and FaqPage to the <Button> component. Updates three scoped style
selectors to :global() to reach the child component's elements.
This commit is contained in:
2026-06-25 20:59:02 -07:00
parent a3f666c974
commit c6202d2ac6
12 changed files with 56 additions and 30 deletions
+2 -1
View File
@@ -1,4 +1,5 @@
---
import Button from '../Button.astro';
import type { HeroSection } from '../../types/home-sections';
interface Props { section: HeroSection }
const { section } = Astro.props;
@@ -9,7 +10,7 @@ const { section } = Astro.props;
<p class="eyebrow">{section.eyebrow}</p>
<h1 set:html={section.heading} />
<p>{section.body}</p>
<a class="button" href={section.cta.href}>{section.cta.label}</a>
<Button href={section.cta.href}>{section.cta.label}</Button>
</div>
<img src={`/assets/images/${section.image}`} alt={section.imageAlt} loading="eager" />
</div>