CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Project Overview

This is a static personal website for Jayme Hoffman (jaymehoffman.com), built with Jekyll but deployed as static HTML files. The site includes:

  • Personal landing page (index.html)
  • Blog posts (/blog/)
  • Work portfolio (/work/)
  • Lists of resources (/lists/)
  • AI products page (/ai/)
  • Quotes section (/quotes/)

Architecture

The site uses a simple file-based structure:

  • All pages are standalone HTML files in their respective directories
  • Shared CSS is in /static/style.css
  • Each page imports the stylesheet using relative paths (e.g., ../static/style.css)
  • Navigation is handled via a consistent top nav component replicated across pages
  • Jekyll configuration exists in _config.yml but the site is deployed as static HTML

Site Structure

  • / - Landing page with bio and social links
  • /blog/ - Blog index with list of posts; each post is in its own subdirectory (e.g., /blog/idea-picking/)
  • /work/ - Portfolio of current and past projects
  • /lists/ - Curated list of favorite resources
  • /ai/ - Embedded Notion database of favorite AI products
  • /static/ - Static assets (CSS, images like pfp.png)

Key Conventions

Navigation Component: Every page includes this exact top nav structure:

<nav class="top-nav">
  <a href="/" class="nav-home">
    <img src="../static/pfp.png" alt="Jayme Hoffman" />
  </a>
  <a href="https://x.com/jaymehoffman/" class="nav-x">𝕏</a>
</nav>

The pfp.png path should be adjusted based on the page’s depth (e.g., ../static/ for blog posts, static/ for root).

Page Structure: All pages follow this template:

<html>
<head>
  <meta charset="UTF-8">
  <title>[Page Title] · Jayme Hoffman</title>
  <link rel="stylesheet" href="../static/style.css">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
  [navigation]
  <div id="main">
    [content]
  </div>
</body>
</html>

Styling:

  • All styling is in /static/style.css
  • Max width of 600px, centered layout
  • System fonts (-apple-system stack)
  • Link color: rgb(29, 155, 240) (Twitter blue)
  • Top nav height: 64px with profile image 40px diameter

Development Workflow

This is a static site with no build process. To make changes:

  1. Edit HTML files directly in their respective locations
  2. Update /static/style.css for styling changes
  3. Test changes by opening HTML files in a browser
  4. Commit and push to deploy (appears to be hosted on GitHub Pages based on CNAME file)

Content Guidelines

  • All pages should maintain the consistent navigation structure
  • Blog posts should be added to /blog/index.html list and have their own subdirectory
  • New pages should follow the existing HTML structure and import the stylesheet appropriately
  • The site uses clean, minimal design with no JavaScript

Jekyll Configuration

While Jekyll configuration exists in _config.yml, the deployed site uses static HTML. The configuration includes:

  • Collections for mental-models and posts
  • Google Analytics: UA-124170593-1
  • SEO and sitemap plugins configured

If working with Jekyll builds, the site would compile to static files, but currently all pages are hand-coded HTML.