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';
const { title = 'Schedule Your Free Consultation', showBackground = false } = Astro.props;
---
<section class:list={['form-section', { 'form-section-background': showBackground }]} aria-labelledby="form-title">
@@ -12,7 +13,7 @@ const { title = 'Schedule Your Free Consultation', showBackground = false } = As
<label>Phone<input type="tel" name="phone" autocomplete="tel" /></label>
<label>Service of interest<select name="service"><option>ABA Therapy</option><option>Autism Evaluation</option><option>Learner Social Club</option><option>Other</option></select></label>
<label>How can we help?<textarea name="message" rows="5"></textarea></label>
<button class="button" type="submit" disabled aria-describedby="form-note">Submit</button>
<Button type="submit" disabled aria-describedby="form-note">Submit</Button>
<p id="form-note" class="form-note">Online submission is not yet connected. Please call (480) 687-7099.</p>
</form>
</div>