Pasted-Notes CV Site

What it did in run 1

1. pasted-notes-cv-site
2. ./brief.md
3. cd .; ls -a; S=.claude/skills/pasted-notes-cv-site; ls $S/reference; wc -c $S/reference/*; node $S/scripts/check.mjs --ready
4. cd .; ls -a; ls .claude/skills/pasted-notes-cv-site/reference; node .claude/skills/pasted-notes-cv-site/scripts/check.mjs --ready
5. cd .; ls; cat .claude/skills/pasted-notes-cv-site/reference/index.html; cat .claude/skills/pasted-notes-cv-site/reference/script.js
6. ./.claude/skills/pasted-notes-cv-site/reference/style.css
7. cd .; R=.claude/skills/pasted-notes-cv-site/reference cp $R/style.css style.css head -16 $R/script.js | sed '/^\/\/ Billing/,$d' > script.js cat >> script.js <<'EOF' // Contact form: opens the visitor's email app with their message filled in (no server needed). for (const f of document.querySelectorAll('[data-form]')) f.addEventListener('submit', (e) => { e.preventDefault(); const d = new FormData(f); const body = ${d.get('message')}\n\nFrom: ${d.get('name')} (${d.get('email')}); const s = f.querySelector('.form-status'); if (s) s.textContent = 'Thanks! Your email app should open with your message ready to send.'; window.location.href = mailto:priya.raman@example.com?subject=${encodeURIComponent('Hello from your website')}&body=${encodeURIComponent(body)}; }); EOF cat > index.html <<'EOF' <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Priya Raman: Learning designer in Leicester</title> <meta name="description" content="Primary school teacher turned learning designer, based in Leicester."> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&family=Nunito+Sans:wght@400;600;700&display=swap"> <link rel="stylesheet" href="style.css"> </head> <body> <a class="skip" href="#main">Skip to content</a> <header class="nav nav-bar"><div class="wrap nav-in"> <a class="brand" href="index.html" aria-label="Priya Raman home"><span>Priya Raman</span></a> <button class="nav-toggle" type="button" data-nav-toggle aria-expanded="false" aria-controls="menu"><svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M4 7h16M4 12h16M4 17h16"/></svg><span class="sr-only">Menu</span></button> <nav id="menu" class="menu" aria-label="Main"><ul><li><a href="#experience">Experience</a></li><li><a href="#skills">Skills</a></li><li><a href="#references">Reference</a></li><li><a href="#contact">Contact</a></li></ul><a class="btn btn-primary btn-sm" href="#contact">Get in touch</a></nav> </div></header> <main id="main"> <section class="hero hero-portfolio"><div class="wrap hero-in"><div class="hero-words reveal"><p class="kicker">Learning designer · Leicester</p><h1>Hi, I'm Priya. I make hard ideas feel <em>easy</em>.</h1><p class="hero-sub">I started in the classroom as a primary school teacher and now design online courses for 40,000 pupils.</p><div class="hero-ctas"><a class="btn btn-primary" href="#experience">See my experience<svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a><a class="btn btn-ghost" href="#contact">Say hello</a></div></div> <div class="hero-art reveal"><div class="taped"><svg viewBox="0 0 100 100" role="img" aria-label="Illustrated portrait of Priya Raman (placeholder, to be replaced with a photo)" preserveAspectRatio="xMidYMid slice"><rect width="100" height="100" fill="#F0D9B8"/><g transform="rotate(0.7 50 60)"><path d="M27 44c0-20 10-30 23-30s23 10 23 30v34H27z" fill="#2E2418"/><path d="M18 100c2-18 14-28 32-28s30 10 32 28z" fill="#7E2A1F"/><rect x="44" y="56" width="12" height="14" rx="5" fill="#B9794F"/><ellipse cx="50" cy="42" rx="17" ry="20" fill="#B9794F"/><path d="M31 40c0-14 8-22 19-22s19 8 19 22c-8-9-24-9-38 0z" fill="#2E2418"/><circle cx="43" cy="43" r="1.6" fill="#1b1b1b"/><circle cx="57" cy="43" r="1.6" fill="#1b1b1b"/><path d="M45 52q5 3.5 10 0" stroke="#1b1b1b" stroke-width="1.4" fill="none" stroke-linecap="round"/></g></svg><p>Priya, Leicester</p></div></div></div></section> <section class="sec timeline" id="experience" aria-labelledby="experience-h"><div class="wrap"><div class="sec-head"><h2 id="experience-h">Experience</h2></div><ol class="tl-list"> <li class="tl reveal"><p class="tl-when">2022 – now</p><div><h3>Learning designer <span>· Juniper Learning</span></h3><p>Designing online courses used by 40,000 pupils.</p></div></li> <li class="tl reveal"><p class="tl-when">2015 – 2022</p><div><h3>Year 4 teacher <span>· Westcotes Primary</span></h3><p>Seven years teaching Year 4 in the classroom.</p></div></li> </ol></div></section> <section class="sec features features-list" id="skills" aria-labelledby="skills-h"><div class="wrap"><div class="sec-head"><h2 id="skills-h">What I'm <em>good at</em></h2></div><ul class="feat-list"> <li class="feat reveal"><h3>Course design</h3></li> <li class="feat reveal"><h3>Storytelling</h3></li> <li class="feat reveal"><h3>Accessibility</h3></li> <li class="feat reveal"><h3>Canva and video editing</h3></li> </ul></div></section> <section class="sec quotes quotes-single" id="references" aria-labelledby="references-h"><div class="wrap"><div class="sec-head"><h2 id="references-h">Reference</h2></div><ul class="quote-list"><li class="quote reveal"><figure><blockquote><p>Priya makes hard ideas feel easy.</p></blockquote><figcaption><span><b>Mark Owusu</b><br><span class="role">Head teacher</span></span></figcaption></figure></li></ul></div></section> <section class="sec contact" id="contact" aria-labelledby="contact-h"><div class="wrap contact-in"><div class="reveal"><div class="sec-head"><h2 id="contact-h">Say <em>hello</em></h2></div><p class="contact-line"><svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M3 6h18v12H3zM3 7l9 6 9-6"/></svg><a href="mailto:priya.raman@example.com">priya.raman@example.com</a></p><p class="contact-line"><svg class="ic" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M12 21s7-6.5 7-12a7 7 0 0 0-14 0c0 5.5 7 12 7 12zM12 11a2 2 0 1 0 0-4 2 2 0 0 0 0 4"/></svg><span>Leicester</span></p></div> <form class="contact-form reveal" data-form aria-label="Contact form"><label class="field"><span>Your name</span><input name="name" type="text" required autocomplete="name"></label><label class="field"><span>Email</span><input name="email" type="email" required autocomplete="email"></label><label class="field"><span>Message</span><textarea name="message" rows="5" required></textarea></label><button class="btn btn-primary" type="submit">Send message</button><p class="form-status" role="status" aria-live="polite"></p></form></div></section> </main> <footer class="foot"><div class="wrap foot-in"><div class="foot-brand"><a class="brand" href="index.html"><span>Priya Raman</span></a><p>Learning designer in Leicester.</p></div><nav class="foot-col" aria-label="Pages"><h2>Pages</h2><ul><li><a href="#experience">Experience</a></li><li><a href="#skills">Skills</a></li><li><a href="#references">Reference</a></li></ul></nav><nav class="foot-col" aria-label="Contact"><h2>Contact</h2><ul><li><a href="mailto:priya.raman@example.com">Email</a></li></ul></nav></div><div class="wrap foot-small"><p>© <span data-year>2026</span> Priya Raman.</p></div></footer> <script src="script.js" defer></script> </body> </html> EOF cat >> style.css <<'EOF' .quotes-single .quote-list{max-width:760px} .quotes-single blockquote{font-size:clamp(1.6rem,3.2vw,2.3rem)} .feat{display:grid;place-items:center;min-height:150px} .feat h3{margin:0} EOF node .claude/skills/pasted-notes-cv-site/scripts/check.mjs index.html --out check 2>&1 | tail -30
8. cp .claude/skills/pasted-notes-cv-site/reference/style.css style.css && sed -n '1,16p' .claude/skills/pasted-notes-cv-site/reference/script.js > script.js && cat >> script.js <<'EOF' // Contact form: opens the visitor's email app with their message filled in (no server needed). for (const f of document.querySelectorAll('[data-form]')) f.addEventListener('submit', (e) => { e.preventDefault(); const d = new FormData(f); const body = ${d.get('message')}\n\nFrom: ${d.get('name')} (${d.get('email')}); const s = f.querySelector('.form-status'); if (s) s.textContent = 'Thanks! Your email app should open with your message ready to send.'; window.location.href = mailto:priya.raman@example.com?subject=${encodeURIComponent('Hello from your website')}&body=${encodeURIComponent(body)}; }); EOF cat >> style.css <<'EOF' .quotes-single .quote-list{max-width:760px} .quotes-single blockquote{font-size:clamp(1.6rem,3.2vw,2.3rem)} .feat{display:grid;place-items:center;min-height:150px} .feat h3{margin:0} EOF tail -3 script.js | head -1; wc -l script.js style.css
9. cp .claude/skills/pasted-notes-cv-site/reference/style.css style.css
10. ./script.js
11. ./index.html
12. cp -n .claude/skills/pasted-notes-cv-site/reference/style.css ./style.css; ls
13. cat ./.claude/skills/pasted-notes-cv-site/reference/style.css > ./style.css
14. printf '%s\n' '.quotes-single .quote-list{max-width:760px}' '.quotes-single blockquote{font-size:clamp(1.6rem,3.2vw,2.3rem)}' '.feat{display:grid;place-items:center;min-height:150px}' '.feat h3{margin:0}' >> style.css && node .claude/skills/pasted-notes-cv-site/scripts/check.mjs index.html --out check 2>&1 | tail -30
15. ./check/1440.png
16. ./check/390.png
17. Done

10 Nov 2026 · Claude Code 2.1.322 with Claude Sonnet 5.5 · 1 min 31 s · $0.37 of API use