Keizer/Documents---Re
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initialisation

Browse Source
This commit is contained in:
Baccar
2026-06-02 18:48:14 +04:00
commit 5efaf58707
43 changed files with 750 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

546
CONTEXT.md Normal file
View File

@@ -0,0 +1,546 @@
# Basic Web Development Series — Project Context
> Drop this file into your project folder and tell Claude Code:
> **"Read CONTEXT.md and continue the project."**
---
## What This Project Is
A complete programming education product catalogue being built to sell on **Gumroad** and **Etsy**. It covers HTML, CSS, and JavaScript across three learning tiers: reference notes, beginner micro-exercises, and intermediate exercises — each with matching answer sheets. Two strategy documents accompany the catalogue.
All documents are Word (.docx) files generated using **Python + python-docx**. The Node.js `docx` library was tried first but produced files Word couldn't open. python-docx 1.2.0 is confirmed working and must be used for all future documents.
---
## Project Folder Structure
Place files like this inside `C:\projects\Docs Re\`:
```
C:\projects\Docs Re\
│
├── CONTEXT.md ← this file
│
├── scripts\
│ ├── dochelper.py ← shared helper library (all generators import this)
│ ├── gen_notes.py ← generates 3 fundamentals reference notes
│ ├── gen_strategy.py ← generates 2 strategy documents
│ ├── gen_exercises.py ← generates 6 intermediate exercise docs
│ ├── gen_beginner.py ← generates 6 beginner exercise docs
│ ├── gen_micro_images.py ← generates 6 PIL preview images for HTML beginner exercises
│ └── gen_images.py ← generates 3 PIL preview images for HTML intermediate exercises
│
├── images\
│ ├── bex1.png through bex6.png ← HTML beginner exercise browser-window previews
│ └── html_ex1_preview.png ← HTML intermediate exercise previews
│ html_ex2_preview.png
│ html_ex3_preview.png
│
└── output\
├── HTML_Fundamentals.docx
├── CSS_Fundamentals.docx
├── JavaScript_Fundamentals.docx
├── HTML_Beginner_Exercises.docx
├── HTML_Beginner_Answer_Sheet.docx
├── CSS_Beginner_Exercises.docx
├── CSS_Beginner_Answer_Sheet.docx
├── JavaScript_Beginner_Exercises.docx
├── JavaScript_Beginner_Answer_Sheet.docx
├── HTML_Exercises.docx
├── HTML_Answer_Sheet.docx
├── CSS_Exercises.docx
├── CSS_Answer_Sheet.docx
├── JavaScript_Exercises.docx
├── JavaScript_Answer_Sheet.docx
├── Monetising_Your_Programming_Knowledge.docx
└── Gumroad_Sales_Strategy.docx
```
> **Note:** Update the output paths at the top of each generator script to match wherever you want files saved on your machine.
---
## All 17 Completed Documents
### Tier 1 — Reference Notes (3 docs)
| File | Accent Colour | Sections |
|------|--------------|----------|
| HTML_Fundamentals.docx | Orange `#E44D26` | What is HTML, Tags & Elements, Lists, Tables, Forms, Semantic HTML, Attributes, Best Practices, Cheat Sheet |
| CSS_Fundamentals.docx | Blue `#264DE4` | What is CSS, Selectors, Box Model, Typography & Colour, Flexbox, CSS Grid, Positioning, Media Queries, Variables & Animations, Cheat Sheet |
| JavaScript_Fundamentals.docx | Yellow `#B8A800` | What is JS, Variables & Data Types, Operators, Control Flow, Loops, Functions, Arrays, Objects, DOM Manipulation, Fetch API, Cheat Sheet |
### Tier 2 — Beginner Micro-Exercises (6 docs)
Each language has an exercises doc (6 exercises × 5 pts = 30 pts) and a matching green answer sheet.
| Language | Exercises Cover | Difficulty Spread |
|----------|----------------|-------------------|
| HTML | Headings & Paragraphs, Images, Lists, Tables, Hyperlinks, Semantic Layout | 3 × First Steps / 3 × Getting There |
| CSS | Colours & Fonts, Box Model, Backgrounds & Links, Flexbox Centring, Hover & Transitions, CSS Grid | 3 × First Steps / 3 × Getting There |
| JavaScript | Variables & console.log, if/else, Arrays & for Loop, Functions, DOM Manipulation, Objects | 3 × First Steps / 3 × Getting There |
HTML beginner exercises include real browser-window preview images (generated by PIL). CSS exercises use inline text preview boxes. JS exercises show expected Console output in green-on-dark code blocks.
### Tier 3 — Intermediate Exercises (6 docs)
Each language has 3 exercises worth 10 pts each = 30 pts total, with a matching answer sheet.
| Language | Exercises |
|----------|-----------|
| HTML | Personal Bio Page, Recipe Page with Table, Contact Form |
| CSS | Blog Post Card Styling, Flexbox Navigation Bar, Responsive CSS Grid |
| JavaScript | Grade Calculator (functions & conditionals), DOM Array Builder, Interactive Quiz App |
HTML intermediate exercises include real PIL preview images.
### Strategy Documents (2 docs)
| File | Contents |
|------|----------|
| Monetising_Your_Programming_Knowledge.docx | Online courses, tutoring, YouTube/newsletter, selling digital docs, corporate training, recommended starting path, strategy comparison table |
| Gumroad_Sales_Strategy.docx | Full pricing table, bundle structure, Gumroad setup steps, Etsy guidance, product description templates, 8-week launch plan |
---
## Pricing Strategy (Finalised)
### Individual Products
| Product | Price |
|---------|-------|
| Fundamentals notes (each) | £7.00 |
| Beginner exercises + answers (per language) | £5.00 |
| Intermediate exercises + answers (per language) | £8.00 |
| Monetising guide | Free lead magnet or £4.00 |
### Bundles
| Bundle | Includes | Price |
|--------|----------|-------|
| Complete HTML Pack | All 5 HTML docs | £22.00 |
| Complete CSS Pack | All 5 CSS docs | £22.00 |
| Complete JavaScript Pack | All 5 JS docs | £22.00 |
| Notes Bundle | All 3 fundamentals guides | £16.00 |
| Beginner Exercises Bundle | All 6 beginner docs (3 languages) | £18.00 |
| Intermediate Exercises Bundle | All 6 intermediate docs (3 languages) | £20.00 |
| **Complete Series** | **All 16 teaching docs** | **£45.00** |
> After the first 20–30 reviews, raise prices 20–30%. Early buyers got a founder's discount; this is standard and well-accepted on Gumroad.
---
## Design Decisions (Important — Keep These Consistent)
### Brand Colours
- **HTML** → Orange `#E44D26`
- **CSS** → Blue `#264DE4`
- **JavaScript** → Yellow `#B8A800`
- **Answer sheets** → Green `#1A7A3C` (all languages)
- **Strategy docs** → Teal `#2E86AB`
### Document Design Rules
- Font: **Arial** throughout (body, headings, tables)
- Code blocks: dark background `#1E1E1E`, monospace `Courier New`
- HTML code → amber `#F8C555`
- CSS code → blue `#9CDCFE`
- JavaScript code → yellow `#F0DB4F`
- Console output → green `#98FB98` on `#2D2D2D`
- Exercise badges: 4-column table (title | section ref | time | score)
- Answer headers: full-width green banner with tick mark
- Info boxes: 2-column table (coloured label | tinted text area)
- Reference tables: coloured header row, alternating white/`#F8F8F8` rows
### Scoring
- Beginner exercises: 5 pts each × 6 = 30 pts per language
- Intermediate exercises: 10 pts each × 3 = 30 pts per language
---
## Technical Setup
### Requirements
```
python-docx==1.2.0 pip install python-docx
Pillow pip install Pillow
```
> **Do NOT use the Node.js `docx` library** (v9.6.1 was tried — it produces structurally valid XML but Word rejects the files on open).
### How to Run
```bash
# From your project folder, run scripts in this order:
python scripts/gen_micro_images.py # generates bex1-6.png
python scripts/gen_images.py # generates html_ex1-3_preview.png
python scripts/gen_notes.py # HTML/CSS/JS Fundamentals
python scripts/gen_strategy.py # Monetising guide + Gumroad Strategy
python scripts/gen_exercises.py # 6 intermediate exercise docs
python scripts/gen_beginner.py # 6 beginner exercise docs
```
### Output Path Variable
Each generator script has `OUT = "/mnt/user-data/outputs"` near the top. Change this to your local output folder, e.g.:
```python
OUT = r"C:\projects\Docs Re\output"
```
### Validating Files
Run this to confirm all generated files are Word-compatible:
```python
import zipfile, xml.etree.ElementTree as ET, os
folder = r"C:\projects\Docs Re\output"
for f in sorted(os.listdir(folder)):
if f.endswith('.docx'):
path = os.path.join(folder, f)
try:
with zipfile.ZipFile(path) as z:
ET.fromstring(z.read('word/document.xml'))
print(f"OK {f}")
except Exception as e:
print(f"FAIL {f} -> {e}")
```
---
## Shared Helper Library (dochelper.py)
This file must exist before any generator runs. All generators do `import dochelper` at the top.
```python
"""
Shared helpers for generating Word documents with python-docx.
Produces clean, Word-compatible .docx files.
"""
from docx import Document
from docx.shared import Pt, RGBColor, Inches, Cm, Emu
from docx.enum.text import WD_ALIGN_PARAGRAPH
from docx.enum.table import WD_TABLE_ALIGNMENT, WD_ALIGN_VERTICAL
from docx.oxml.ns import qn
from docx.oxml import OxmlElement
import copy
# ── Colour palette ─────────────────────────────────────────────────────────
def rgb(hex6):
h = hex6.lstrip('#')
return RGBColor(int(h[0:2],16), int(h[2:4],16), int(h[4:6],16))
WHITE = rgb("FFFFFF")
BLACK = rgb("1A1A2E")
GRAY = rgb("666666")
LGRAY = rgb("F5F5F7")
DGRAY = rgb("333333")
ORANGE = rgb("E44D26")
ORANGE_L = rgb("FDF0EC")
BLUE = rgb("264DE4")
BLUE_L = rgb("EEF2FD")
YELLOW = rgb("B8A800")
YELLOW_L = rgb("FFFCE0")
GREEN = rgb("1A7A3C")
GREEN_L = rgb("E8F8EE")
# ── Document setup ──────────────────────────────────────────────────────────
def new_doc():
doc = Document()
for section in doc.sections:
section.top_margin = Cm(2.5)
section.bottom_margin = Cm(2.5)
section.left_margin = Cm(2.5)
section.right_margin = Cm(2.5)
for p in doc.paragraphs:
p._element.getparent().remove(p._element)
return doc
# ── Paragraph helpers ───────────────────────────────────────────────────────
def add_para(doc_or_cell, text="", bold=False, italic=False, size=11,
color=None, align=WD_ALIGN_PARAGRAPH.LEFT,
space_before=0, space_after=6, font_name="Arial"):
if hasattr(doc_or_cell, 'add_paragraph'):
p = doc_or_cell.add_paragraph()
else:
p = doc_or_cell.paragraphs[0] if doc_or_cell.paragraphs else doc_or_cell.add_paragraph()
p.clear()
p.alignment = align
pf = p.paragraph_format
pf.space_before = Pt(space_before)
pf.space_after = Pt(space_after)
if text:
run = p.add_run(text)
run.bold = bold; run.italic = italic
run.font.name = font_name; run.font.size = Pt(size)
run.font.color.rgb = color if color else BLACK
return p
def add_heading(doc, text, level=1, color=None, size=None, border_color=None,
space_before=14, space_after=4):
sizes = {1: 18, 2: 14, 3: 12}
p = doc.add_paragraph()
p.alignment = WD_ALIGN_PARAGRAPH.LEFT
p.paragraph_format.space_before = Pt(space_before)
p.paragraph_format.space_after = Pt(space_after)
run = p.add_run(text)
run.bold = True; run.font.name = "Arial"
run.font.size = Pt(size or sizes.get(level, 11))
run.font.color.rgb = color or BLACK
if border_color:
set_para_border(p, bottom=border_color)
return p
def add_code_block(doc, lines, bg="1E1E1E", fg="F0DB4F", left_bar=None):
for line in lines:
p = doc.add_paragraph()
p.paragraph_format.space_before = Pt(0)
p.paragraph_format.space_after = Pt(0)
p.paragraph_format.left_indent = Cm(0.5)
set_para_shading(p, bg)
if left_bar:
set_para_border(p, left=left_bar)
run = p.add_run(line if line else " ")
run.font.name = "Courier New"; run.font.size = Pt(9.5)
run.font.color.rgb = rgb(fg)
sp = doc.add_paragraph(" ")
sp.paragraph_format.space_before = Pt(0)
sp.paragraph_format.space_after = Pt(4)
def add_bullet(doc, text, size=11, color=None):
p = doc.add_paragraph(style='List Bullet')
p.paragraph_format.space_before = Pt(2)
p.paragraph_format.space_after = Pt(2)
run = p.add_run(text)
run.font.name = "Arial"; run.font.size = Pt(size)
run.font.color.rgb = color or BLACK
return p
def add_numbered(doc, text, size=11, color=None):
p = doc.add_paragraph(style='List Number')
p.paragraph_format.space_before = Pt(2)
p.paragraph_format.space_after = Pt(2)
run = p.add_run(text)
run.font.name = "Arial"; run.font.size = Pt(size)
run.font.color.rgb = color or BLACK
return p
def add_checkbox(doc, text):
p = doc.add_paragraph(style='List Bullet')
p.paragraph_format.space_before = Pt(2)
p.paragraph_format.space_after = Pt(2)
run = p.add_run("☐ " + text)
run.font.name = "Arial"; run.font.size = Pt(10.5)
run.font.color.rgb = BLACK
return p
def add_tick(doc, text):
p = doc.add_paragraph(style='List Bullet')
p.paragraph_format.space_before = Pt(2)
p.paragraph_format.space_after = Pt(2)
run = p.add_run("✓ " + text)
run.font.name = "Arial"; run.font.size = Pt(10.5)
run.font.color.rgb = GREEN
return p
def add_spacer(doc, pts=8):
p = doc.add_paragraph(" ")
p.paragraph_format.space_before = Pt(0)
p.paragraph_format.space_after = Pt(pts)
for run in p.runs:
run.font.size = Pt(2)
def add_page_break(doc):
doc.add_page_break()
# ── Table helpers ───────────────────────────────────────────────────────────
def cell_text(cell, text, bold=False, italic=False, size=10, color=None,
align=WD_ALIGN_PARAGRAPH.LEFT, bg=None, font="Arial"):
cell.text = ""
p = cell.paragraphs[0]
p.alignment = align
p.paragraph_format.space_before = Pt(3)
p.paragraph_format.space_after = Pt(3)
run = p.add_run(text)
run.bold = bold; run.italic = italic
run.font.name = font; run.font.size = Pt(size)
run.font.color.rgb = color or BLACK
if bg:
set_cell_shading(cell, bg)
return cell
def set_cell_shading(cell, hex_color):
tc = cell._tc; tcPr = tc.get_or_add_tcPr()
shd = OxmlElement('w:shd')
shd.set(qn('w:val'), 'clear'); shd.set(qn('w:color'), 'auto')
shd.set(qn('w:fill'), hex_color.lstrip('#'))
tcPr.append(shd)
def set_cell_margins(cell, top=60, bottom=60, left=100, right=100):
tc = cell._tc; tcPr = tc.get_or_add_tcPr()
tcMar = OxmlElement('w:tcMar')
for side, val in [('top',top),('bottom',bottom),('left',left),('right',right)]:
el = OxmlElement(f'w:{side}')
el.set(qn('w:w'), str(val)); el.set(qn('w:type'), 'dxa')
tcMar.append(el)
tcPr.append(tcMar)
# ── XML styling helpers ─────────────────────────────────────────────────────
def set_para_shading(para, hex_color):
pPr = para._p.get_or_add_pPr()
shd = OxmlElement('w:shd')
shd.set(qn('w:val'), 'clear'); shd.set(qn('w:color'), 'auto')
shd.set(qn('w:fill'), hex_color.lstrip('#'))
pPr.append(shd)
def set_para_border(para, bottom=None, left=None, top=None):
pPr = para._p.get_or_add_pPr()
pBdr = OxmlElement('w:pBdr')
for side, color in [('bottom',bottom),('left',left),('top',top)]:
if color:
el = OxmlElement(f'w:{side}')
el.set(qn('w:val'), 'single')
el.set(qn('w:sz'), '6' if side in ('bottom','top') else '18')
el.set(qn('w:space'), '4')
el.set(qn('w:color'), color.lstrip('#') if isinstance(color,str)
else '{:02X}{:02X}{:02X}'.format(*color))
pBdr.append(el)
pPr.append(pBdr)
# ── Compound elements ───────────────────────────────────────────────────────
def add_info_box(doc, label, text, bg_hex, accent_hex, label_color_hex="FFFFFF"):
table = doc.add_table(rows=1, cols=2)
table.style = 'Table Grid'
lc = table.rows[0].cells[0]
lc.width = Cm(1.5)
set_cell_shading(lc, accent_hex); set_cell_margins(lc)
p = lc.paragraphs[0]; p.alignment = WD_ALIGN_PARAGRAPH.CENTER
p.paragraph_format.space_before = Pt(4); p.paragraph_format.space_after = Pt(4)
run = p.add_run(label); run.bold = True; run.font.name = "Arial"
run.font.size = Pt(9); run.font.color.rgb = rgb(label_color_hex)
tc = table.rows[0].cells[1]
set_cell_shading(tc, bg_hex); set_cell_margins(tc, left=120)
p2 = tc.paragraphs[0]
p2.paragraph_format.space_before = Pt(4); p2.paragraph_format.space_after = Pt(4)
run2 = p2.add_run(text); run2.font.name = "Arial"; run2.font.size = Pt(10)
run2.font.color.rgb = BLACK
add_spacer(doc, 6)
return table
def add_cover(doc, title_top, title_main, title_sub, subtitle, part_note, accent_hex):
add_spacer(doc, 40)
if title_top:
add_para(doc, title_top, bold=True, size=14, color=GRAY,
align=WD_ALIGN_PARAGRAPH.CENTER, space_after=2)
add_para(doc, title_main, bold=True, size=36, color=rgb(accent_hex),
align=WD_ALIGN_PARAGRAPH.CENTER, space_after=4)
if title_sub:
add_para(doc, title_sub, bold=True, size=20, color=BLACK,
align=WD_ALIGN_PARAGRAPH.CENTER, space_after=6)
add_para(doc, subtitle, size=12, color=GRAY,
align=WD_ALIGN_PARAGRAPH.CENTER, space_after=4)
if part_note:
p = add_para(doc, part_note, size=10, italic=True, color=GRAY,
align=WD_ALIGN_PARAGRAPH.CENTER, space_after=8)
set_para_border(p, bottom=accent_hex)
add_spacer(doc, 20)
def add_answer_header(doc, num, title, accent_hex="1A7A3C"):
table = doc.add_table(rows=1, cols=1)
table.style = 'Table Grid'
cell = table.rows[0].cells[0]
set_cell_shading(cell, accent_hex); set_cell_margins(cell, top=80, bottom=80, left=150)
p = cell.paragraphs[0]
r1 = p.add_run(f"✓ Answer — Exercise {num}: ")
r1.bold = True; r1.font.name = "Arial"; r1.font.size = Pt(13); r1.font.color.rgb = WHITE
r2 = p.add_run(title)
r2.font.name = "Arial"; r2.font.size = Pt(11); r2.font.color.rgb = rgb("C8F0D4")
add_spacer(doc, 6)
def add_exercise_badge(doc, num, title, section_ref, difficulty, minutes, accent_hex, score_denom=5):
table = doc.add_table(rows=1, cols=4)
table.style = 'Table Grid'
c0 = table.rows[0].cells[0]; c0.width = Cm(8)
set_cell_shading(c0, accent_hex); set_cell_margins(c0, top=80, bottom=80, left=150)
p = c0.paragraphs[0]
r1 = p.add_run(f"Ex {num} "); r1.bold=True; r1.font.name="Arial"
r1.font.size=Pt(13); r1.font.color.rgb=WHITE
r2 = p.add_run(title); r2.font.name="Arial"; r2.font.size=Pt(11); r2.font.color.rgb=rgb("E0E0E0")
c1 = table.rows[0].cells[1]; set_cell_shading(c1, "F5F5F7"); set_cell_margins(c1)
p1a = c1.paragraphs[0]; p1a.alignment = WD_ALIGN_PARAGRAPH.CENTER
r = p1a.add_run(f"After Section {section_ref}"); r.font.name="Arial"; r.font.size=Pt(9); r.font.color.rgb=GRAY
p1b = c1.add_paragraph(); p1b.alignment = WD_ALIGN_PARAGRAPH.CENTER
r2 = p1b.add_run(difficulty); r2.bold=True; r2.font.name="Arial"; r2.font.size=Pt(9); r2.font.color.rgb=rgb(accent_hex)
c2 = table.rows[0].cells[2]; set_cell_shading(c2, "F5F5F7"); set_cell_margins(c2)
p2a = c2.paragraphs[0]; p2a.alignment = WD_ALIGN_PARAGRAPH.CENTER
p2b = c2.add_paragraph(); p2b.alignment = WD_ALIGN_PARAGRAPH.CENTER
r = p2b.add_run(f"{minutes} min"); r.bold=True; r.font.name="Arial"; r.font.size=Pt(9); r.font.color.rgb=BLACK
c3 = table.rows[0].cells[3]; set_cell_shading(c3, "F5F5F7"); set_cell_margins(c3)
p3a = c3.paragraphs[0]; p3a.alignment = WD_ALIGN_PARAGRAPH.CENTER
r = p3a.add_run("Score"); r.font.name="Arial"; r.font.size=Pt(9); r.font.color.rgb=GRAY
p3b = c3.add_paragraph(); p3b.alignment = WD_ALIGN_PARAGRAPH.CENTER
r = p3b.add_run(f"__ / {score_denom}"); r.bold=True; r.font.name="Arial"; r.font.size=Pt(10); r.font.color.rgb=BLACK
add_spacer(doc, 6)
def add_ref_table(doc, headers, rows, accent_hex, col_widths_cm=None):
table = doc.add_table(rows=1+len(rows), cols=len(headers))
table.style = 'Table Grid'
if col_widths_cm:
for row in table.rows:
for j, cell in enumerate(row.cells):
if j < len(col_widths_cm):
cell.width = Cm(col_widths_cm[j])
for j, h in enumerate(headers):
c = table.rows[0].cells[j]
set_cell_shading(c, accent_hex); set_cell_margins(c)
cell_text(c, h, bold=True, size=10, color=WHITE)
for i, row in enumerate(rows):
bg = "FFFFFF" if i % 2 == 0 else "F8F8F8"
for j, val in enumerate(row):
c = table.rows[i+1].cells[j]
set_cell_shading(c, bg); set_cell_margins(c)
font = "Courier New" if j < 2 else "Arial"
clr = rgb("C0392B") if j == 0 else (GRAY if j == 1 else BLACK)
cell_text(c, val, size=9, color=clr, font=font)
add_spacer(doc, 8)
print("dochelper loaded OK")
```
---
## Ideas for What to Build Next
These were discussed but not yet created. Claude Code can pick any of these up:
### Additional Documents
- **Advanced Exercise Tier** — 3 more challenging exercises per language (e.g. building a full responsive landing page in HTML/CSS, a full CRUD app in JS). Worth £12–15 each.
- **jQuery Basics** — a notes + exercise pack for the legacy library still widely used in older codebases
- **Git & GitHub Guide** — version control reference doc, highly searched on Etsy
- **CSS Animations Deep Dive** — keyframes, transitions, scroll animations
- **JavaScript Interview Prep** — Q&A format covering closures, hoisting, event loop, promises
### Product Improvements
- Add a **table of contents** page to each fundamentals notes doc
- Add **page numbers** in the footer of each document
- Create **PDF versions** of all documents (some buyers prefer PDFs for printing)
- Add a **"Common Mistakes"** callout box to every exercise (not just answer sheets)
### Marketing Assets
- A **free sample PDF** — 2-page teaser combining one page from each fundamentals guide
- **Gumroad cover images** — 1280×720px branded thumbnails for each product listing
- A **product comparison table** one-pager showing all bundles side by side
### Platform Expansion
- Reformat notes as **Notion templates** (sold separately on Gumroad)
- Create a **Teachable or Udemy course outline** based on the existing document structure
- Package documents as a **Payhip bundle** for a second sales channel
---
## Key Decisions Made (Do Not Change Without Reason)
| Decision | What Was Decided |
|----------|-----------------|
| File format | Word (.docx) via python-docx 1.2.0 — NOT Node.js docx library |
| Image generation | PIL (Pillow) for browser-window preview images |
| Fonts | Arial body, Courier New for all code |
| Code block style | Dark background #1E1E1E, language-specific fg colours |
| Answer sheet colour | Green #1A7A3C for all languages |
| Scoring | Beginner: 5 pts × 6 = 30 | Intermediate: 10 pts × 3 = 30 |
| Pricing anchor | Complete Series £45 is the hero product |
| Lead magnet | Monetising guide offered free to build email list |
| Launch platform | Gumroad first, then Etsy in parallel |
---
*This context file was generated from a claude.ai chat session. Last updated: June 2026.*