Carlos deArtola monogramCARLOS DE ARTOLA
APPENDIX D

Page Opener

One per page. The eyebrow is a Breadcrumb. The numeral is for chapters only.

HANDLE
page-opener
LIVES IN
src/components/PageBadge.jsx (PageOpener)
USED ON
Top of every page
PROPS
no · trail (mounts a Breadcrumb) or eyebrow · title · deck · readingTime · numeral · icon
EXAMPLE
LIVE

As it renders.

APPENDIX

A page begins.

Eyebrow strip, display title, optional deck at the right, then the hairline.

CODE
COPY AND PASTE

How it is called.

JSX
import PageOpener from '../components/PageBadge.jsx'

<PageOpener
  no="APPENDIX A"
  trail={[{ label: 'HOME', to: '/' }, 'ABOUT ME']}
  title="Bio"
  deck="Bio, toolset, associations, education, and a chronological ledger."
  readingTime="5"
/>

{/* chapters add the numeral */}
<PageOpener no="CHAPTER 02 / 06" trail={[{ label: 'HOME', to: '/' }, { label: 'WORK', to: '/#work' }, 'XACTFLEX']} numeral="02" title="XactFlex" />
RULES

What must stay true.

One per page. The eyebrow is a Breadcrumb. The numeral is for chapters only.