File: src/blocks/about/About01.astro
Two-column about section: portrait placeholder + name/role on the left; heading, bio, and highlight checklist on the right. Stacks on mobile.
Config
// blocks.ts
about: {
heading: "About",
subheading: "A bit about how I work.",
highlights: [
"10+ years shipping web products",
"Performance and accessibility first",
],
},
// identity.ts — author fields reused by About
author: {
name: "Jordan Blake",
role: "Independent web developer",
bio: "I build fast, accessible websites…",
},Add to a page
---
import About01 from "@/blocks/about/About01.astro";
---
<About01 />Inline:
<About01
heading="About me"
authorName="Alex Rivera"
authorRole="Designer-developer"
highlights={["Design systems", "Astro & React"]}
/>Props
| Prop | Config key | Notes |
|---|---|---|
heading |
about.heading |
|
subheading |
about.subheading |
|
highlights |
about.highlights |
Checklist strings |
authorName |
author.name |
Under portrait |
authorRole |
author.role |
|
authorBio |
author.bio |
Body paragraph |
Portrait is a CSS gradient placeholder (no image prop yet).