About this block

Tenure Spans draws a whole career as a horizontal bar chart against a shared year axis. Every role becomes a bar whose length is how long the stay actually lasted, with company and title labelled down the left and grid lines marking the years across the top, so the shape of a history reads in one glance.

Spans are one const array, and a small pct helper maps each start and end year to a left offset and width on the axis. Full time roles take a solid bar while a freelance practice runs as a faded one alongside, and a legend under the chart decodes the two. The scale is the point: it shows the gaps and overlaps that a list of date ranges hides.

When to use

Reach for this block on a resume page or an about page where the length of each stay tells its own story. The installer swaps the roles and years for their own and sets the axis to span their career, leaving the bars to carry the tenure.

A natural flow around it on a Portfolio Pro page:

Before

• About split

After

• Skills section
• Contact section

What you can display

One strong use is the decade of roles drawn to scale. Other timeline shapes:

• Overlapping work. Employment and freelance on the same axis to show the years they ran together.
• Project spans. One bar per engagement to map a freelance history by duration.
• Education and work. Study and roles stacked on a shared axis for a fuller picture.

Tip: keep the axis honest so short stays read as short rather than padded out to match the rest.