🧪 STYLE GUIDE / SYSTEM REFERENCE (Eleventy)

---

🧭 1. SYSTEM OVERVIEW

This site uses a layout composition system controlled via front matter.

Each page is composed of:

• HEADER (optional)
• NAV (inside header)
• MAIN CONTENT (Markdown)
• FOOTER (optional)

Each region can be:

• default
• off
• custom (via partials)

---

⚙️ 2. FRONT MATTER CONTROLS

Layout

layout: layouts/base.njk

Required for now. Always uses base layout.

---

Body layout (content width)

body: inset   # default readable column
body: wide    # full width

---

Navigation

nav: default
nav: off
nav: custom
navPartial: nav-landing

---

Header

header: default
header: off
header: custom
headerPartial: header-campaign

---

Footer

footer: default
footer: off
footer: custom
footerPartial: footer-minimal

---

🧠 3. PARTIAL SYSTEM

All partials live in:

src/_includes/partials/

Naming:

• nav-default.njk
• nav-landing.njk
• header-default.njk
• header-campaign.njk
• footer-default.njk
• footer-minimal.njk

Rules:

• flat structure only
• explicit naming only
• no dynamic discovery

---

📄 4. MARKDOWN RULES

Headings

Use only:

# H1
## H2
### H3
#### H4

Avoid:

Heading

---

Paragraphs

Standard:

This is a paragraph.

Optional:

<p class="body">Standard</p>
<p class="body-small">Dense</p>
<p class="body-large">Expanded</p>

---

Emphasis

• italic
• bold
• bold italic

---

Links

[Photography](/photography)

Reference style:

[1]: /photography

---

Blockquotes

> This is a blockquote

---

Lists

• unordered

1. ordered

• nested supported

---

Code

Inline:

`code`

Block:

function test() {
  console.log("ok");
}

---

🧱 5. DEFAULT SYSTEM BEHAVIOUR

header: default
nav: default
body: inset
footer: default

---

🧪 6. COMMON CONFIGURATIONS

Landing page

header: off
nav: off
footer: off
body: wide

---

Campaign page

header: custom
headerPartial: header-campaign
nav: off
body: wide
footer: off

---

Standard article

layout: layouts/base.njk
body: inset

---

⚠️ 7. RULES

DO NOT:

• mix layout systems
• use inline structural HTML in content
• use <br> for spacing
• invent new front matter keys

DO:

• keep layout logic in base.njk
• use front matter only for overrides
• use markdown for content
• use partials only for structural swaps

---

🧭 8. SYSTEM PURPOSE

This system is designed to:

• separate content from structure
• enable flexible page composition
• remain fully static and portable
• scale into blog / portfolio / case study system