Component showcase

Health blocks

Blocks woven into health-vertical landings. 6 variants, 5 rendered live.

trust band

healthin useOpen live
desktop preview
desktop 1280px
mobile preview
mobile 390px
Files
  • src/components/sections/health/TrustBand.astro
  • src/components/sections/health/plan.ts
  • src/lib/health.ts
How to pin

no (surfaces keys health<n> are pinnable through theme.json surfaces)

Reads
derived from services/about/list/team + contact.hours | detectTreatments, trustFacts, journeySteps, openingHours (lib/health.ts)
Used by
not tracked (layout is seeded per site)
Selected by
automatic: only when business.vertical==health on the landing (planHealth in SectionList); HEALTH_IDS trust=confianza,treatments=tratamientos,journey=tu-visita,booking=turnos; explorer replaces the first non-menu services section when >=3 treatments
Notes
Support: HealthIcon, Monogram, explorer.ts, journey.ts, icons.ts, health.css

treatment explorer

healthin useOpen live
desktop preview
desktop 1280px
mobile preview
mobile 390px
Files
  • src/components/sections/health/TreatmentExplorer.astro
  • src/components/sections/health/plan.ts
  • src/lib/health.ts
How to pin

no (surfaces keys health<n> are pinnable through theme.json surfaces)

Reads
derived from services/about/list/team + contact.hours | detectTreatments, trustFacts, journeySteps, openingHours (lib/health.ts)
Used by
not tracked (layout is seeded per site)
Selected by
automatic: only when business.vertical==health on the landing (planHealth in SectionList); HEALTH_IDS trust=confianza,treatments=tratamientos,journey=tu-visita,booking=turnos; explorer replaces the first non-menu services section when >=3 treatments
Notes
Support: HealthIcon, Monogram, explorer.ts, journey.ts, icons.ts, health.css

journey (tu-visita)

healthin useOpen live
desktop preview
desktop 1280px
mobile preview
mobile 390px
Files
  • src/components/sections/health/Journey.astro
  • src/components/sections/health/plan.ts
  • src/lib/health.ts
How to pin

no (surfaces keys health<n> are pinnable through theme.json surfaces)

Reads
derived from services/about/list/team + contact.hours | detectTreatments, trustFacts, journeySteps, openingHours (lib/health.ts)
Used by
not tracked (layout is seeded per site)
Selected by
automatic: only when business.vertical==health on the landing (planHealth in SectionList); HEALTH_IDS trust=confianza,treatments=tratamientos,journey=tu-visita,booking=turnos; explorer replaces the first non-menu services section when >=3 treatments
Notes
Support: HealthIcon, Monogram, explorer.ts, journey.ts, icons.ts, health.css

booking band

healthin useOpen live
desktop preview
desktop 1280px
mobile preview
mobile 390px
Files
  • src/components/sections/health/BookingBand.astro
  • src/components/sections/health/plan.ts
  • src/lib/health.ts
How to pin

no (surfaces keys health<n> are pinnable through theme.json surfaces)

Reads
derived from services/about/list/team + contact.hours | detectTreatments, trustFacts, journeySteps, openingHours (lib/health.ts)
Used by
not tracked (layout is seeded per site)
Selected by
automatic: only when business.vertical==health on the landing (planHealth in SectionList); HEALTH_IDS trust=confianza,treatments=tratamientos,journey=tu-visita,booking=turnos; explorer replaces the first non-menu services section when >=3 treatments
Notes
Support: HealthIcon, Monogram, explorer.ts, journey.ts, icons.ts, health.css

health team

healthin useOpen live
desktop preview
desktop 1280px
mobile preview
mobile 390px
Files
  • src/components/sections/health/HealthTeam.astro
  • src/components/sections/health/plan.ts
  • src/lib/health.ts
How to pin

no (surfaces keys health<n> are pinnable through theme.json surfaces)

Reads
derived from services/about/list/team + contact.hours | detectTreatments, trustFacts, journeySteps, openingHours (lib/health.ts)
Used by
not tracked (layout is seeded per site)
Selected by
automatic: only when business.vertical==health on the landing (planHealth in SectionList); HEALTH_IDS trust=confianza,treatments=tratamientos,journey=tu-visita,booking=turnos; explorer replaces the first non-menu services section when >=3 treatments
Notes
Support: HealthIcon, Monogram, explorer.ts, journey.ts, icons.ts, health.css

health slot dispatcher

healthin use

not rendered: dispatcher with no visual of its own; it places the other health blocks

Files
  • src/components/sections/health/HealthSlot.astro
  • src/components/sections/health/plan.ts
  • src/lib/health.ts
How to pin

no (surfaces keys health<n> are pinnable through theme.json surfaces)

Reads
derived from services/about/list/team + contact.hours | detectTreatments, trustFacts, journeySteps, openingHours (lib/health.ts)
Used by
not tracked (layout is seeded per site)
Selected by
automatic: only when business.vertical==health on the landing (planHealth in SectionList); HEALTH_IDS trust=confianza,treatments=tratamientos,journey=tu-visita,booking=turnos; explorer replaces the first non-menu services section when >=3 treatments
Notes
Support: HealthIcon, Monogram, explorer.ts, journey.ts, icons.ts, health.css