CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
What This Is
Personal portfolio site for Anshid (AI/ML professional). Built with Jekyll and deployed to GitHub Pages at anshid.github.io. No Node.js, no bundler — Jekyll handles Sass compilation and static site generation natively.
Development Commands
# Serve locally with live reload
bundle exec jekyll serve
# Build for production
bundle exec jekyll build
# Install Ruby dependencies (first time)
bundle install
The site is served at http://localhost:4000 by default. Jekyll auto-regenerates on file changes.
Architecture
Jekyll static site — Liquid templating, Markdown content, single SCSS file.
| Layer | Files | Notes |
|---|---|---|
| Templates | _layouts/default.html, home.html, page.html |
default.html is the master shell |
| Components | _includes/header.html, footer.html |
Header has fixed nav with mobile toggle; footer has social links and CV links |
| Styling | assets/css/main.scss |
All CSS and Google Fonts import live here; Jekyll compiles it to main.css |
| Content | index.md, about.md, projects.md, teaching.md |
Top-level pages in nav |
| Hidden pages | certifications.md, blog.md |
Exist but not linked in the nav bar |
| Sub-pages | projects/*.md, courses/*.md |
Individual project and course detail pages |
| Teaching philosophy | ClassPhilosophy/*.md |
Uses explicit permalink: to route into /teaching/ URL space |
| Config | _config.yml |
Site title, description, header_pages list (unused by nav — see below) |
JavaScript: Minimal — inline JS in header.html handles the mobile nav toggle. Pages can opt into Mermaid diagram rendering by setting use_mermaid: true in their front matter; default.html then loads Mermaid from CDN.
URL Routing Gotcha: ClassPhilosophy/
Files in ClassPhilosophy/ would normally generate URLs like /ClassPhilosophy/my-first-class/. They instead use explicit permalink: in their front matter to route into the teaching section:
permalink: /teaching/first-class/
Any new file placed outside its intended URL hierarchy must do the same, or Jekyll will use the directory path as the URL.
Static Assets
assets/css/main.scss— compiled tomain.cssby Jekyllassets/favicon.svg— site faviconassets/files/AIML_Engineer.pdfandTeaching.pdf— CVs linked from the footerassets/OTML/CH01.pdf…CH16.pdf— Optimization for Machine Learning course slides
The course slide pages (courses/optimization.md, courses/calculus.md) currently use # placeholder links. When linking actual PDFs, use /assets/OTML/CHxx.pdf.
Design System
Defined as CSS custom properties at the top of main.scss:
- Theme: dark (
#0b0f19base,#131a2asurface) with blue/purple accents (#3b82f6,#8b5cf6) - Fonts: Outfit (headings), Inter (body) — imported via
@import url(...)at the top ofmain.scss - Cards:
.modern-cardwith glassmorphism (backdrop-filter, semi-transparent bg) - Grid:
.modern-gridusesauto-fillwithminmax(300px, 1fr) - Buttons:
.btnbase +.btn-primarymodifier - Sections:
.section-titlefor headings within content pages - Teaching roles:
.role-tilewith.role-headerfor institution/date layout (used only inteaching.md)
When adding new styled components, follow the existing CSS variable conventions and add styles to main.scss (not inline).
Content Workflow
- Adding a new project: create
projects/<slug>.mdwith front matter (layout: page,title:,description:), then add a card entry inprojects.md - Adding a course page: create
courses/<slug>.mdwithlayout: page, then link it fromteaching.md - Adding a nav page: create the Markdown file AND manually add the link to
_includes/header.html— theheader_pageslist in_config.ymldoes not drive the nav bar (the nav is hardcoded inheader.html) - Front matter:
layout: pagewraps content in the standard article container;layout: homeis for the index only; adduse_mermaid: trueto any page that needs Mermaid diagrams - Teaching philosophy letters: place in
ClassPhilosophy/with an explicitpermalink:pointing into/teaching/, then add the link toteaching.md