CLAUDE.md

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

Project Overview

This is a Jekyll-based blog called “Curators Hub” - a community-driven platform for curators, artists, and enthusiasts. The site uses the Minima theme with extensive custom styling and is designed for GitHub Pages deployment.

Development Commands

Local Development

# Install dependencies
bundle install

# Start development server with live reload
bundle exec jekyll serve

# Build the site for production
bundle exec jekyll build

# Clean generated files
bundle exec jekyll clean

Content Management

# Create a new blog post (manual file creation required)
# Files go in _posts/ with format: YEAR-MONTH-DAY-title.markdown

# Check site structure
bundle exec jekyll doctor

Architecture & Structure

Jekyll Site Structure

• _config.yml - Main site configuration (title: “Curators Hub”, theme: minima)
• _layouts/ - Page templates (default.html, home.html)
• _includes/ - Reusable components (header.html, footer.html, logo.html)
• _posts/ - Blog posts in Markdown format
• _sass/main.scss - Custom styling (overrides Minima theme)
• assets/css/styles.scss - Entry point for CSS compilation
• pages/ - Static pages (about.md)
• index.md - Homepage with custom layout

Theme Architecture

• Uses Minima theme as base with extensive custom styling
• Custom CSS variables for dark theme (–color-bg, –color-base: #4CC5DC, –color-accent: #7A6CF0)
• Responsive design with mobile-first approach
• Font Awesome icons and Mona Sans Google Font integration

Content Categories

The site is organized around four main content categories:

1. Urban Hustle - Small business and entrepreneurship stories
2. Tech4All - Coding projects and tech tutorials
3. Podcasts - Audio content and interviews
4. Community Spotlights - Community member highlights

Key Components

• Hero Section - Gradient background with CTA buttons
• Categories Grid - 2x2 responsive card layout
• Featured Posts - Dynamic Jekyll post rendering with excerpts
• Podcast Feature - Dedicated section for Neighborhood Studios podcast
• Newsletter Signup - Email subscription form

Development Notes

Styling System

• Uses CSS custom properties extensively for theming
• SCSS compilation through Jekyll’s asset pipeline
• Dark theme with cyan (#4CC5DC) and purple (#7A6CF0) accent colors
• Mobile-responsive breakpoints at 768px and 480px

Content Structure

• Blog posts require front matter with layout, title, date, and categories
• Posts support Jekyll’s liquid templating and code highlighting
• Custom post metadata includes reading_time and category tags

Dependencies

• Jekyll 4.4.1
• Minima theme ~2.5
• jekyll-feed plugin for RSS
• jekyll-seo-tag plugin for meta tags
• Platform-specific gems for Windows development (wdm, tzinfo-data)

Jekyll Pages Best Practices

Page Creation and Organization

Reference: https://jekyllrb.com/docs/pages/

Creating Pages

• Pages are the most basic building block for content in Jekyll
• Create as .html or .md files in root directory or subfolders
• Use front matter for metadata and configuration
• Pages are standalone content not tied to dates (unlike posts)

Recommended File Structure

.
├── index.md              # Homepage
├── about.md              # About page (root level)
├── pages/
│   ├── contact.md        # Contact page
│   ├── privacy.md        # Privacy policy
│   └── terms.md          # Terms of service
├── categories/
│   ├── urban-hustle.md   # Urban Hustle category page
│   ├── tech4all.md       # Tech4All category page
│   ├── podcasts.md       # Podcasts category page
│   └── spotlights.md     # Community Spotlights page
└── _posts/               # Blog posts

Page Front Matter Template

---
layout: page              # Use 'page' layout for static pages
title: "Page Title"       # Required: page title
permalink: /custom-url/   # Optional: custom URL structure
description: "Page description for SEO"
---

URL Structure

• Subfolders in source mirror in _site output
• Example: pages/contact.md → http://site.com/pages/contact.html
• Use permalink in front matter for custom URLs
• Example: permalink: /contact/ → http://site.com/contact/

Integration with Current Theme

• Our custom styling in _sass/main.scss applies to all pages
• Use existing CSS classes for consistency
• Follow the established design patterns (dark theme, cyan/purple accents)
• Leverage existing components in _includes/ directory