StepsVertical

vertical numbered steps with a connecting line.

Live preview

1. 1

   Write

   Drop a markdown file in content/.

2. 2

   Save

   And done — no build step.

3. 3

   Publish

   Export and upload.

Install

From your site folder, run:

Copyjprot add StepsVertical

That downloads the self-contained component into theme/components/StepsVertical.js,

where it is picked up automatically — the same way as any built-in component.

To remove it later, just delete that file.

Use it as a homepage section

Add an entry to the sections: list in jprot.config.js:

Copysections: [
  { component: 'StepsVertical', title: 'StepsVertical' },
]

Use it inside a page

On its own line in any Markdown file, passing the props:

Copy:::StepsVertical items='[{"title":"Write","text":"Drop a markdown file in content/."},{"title":"Save","text":"And done — no build step."},{"title":"Publish","text":"Export and upload."}]'

Props

Prop	Type	Note
items	array	[{ title, text }]

↩ Back to all elements