Mockup Gallery

The primary article page for authored source content. Three-column layout with left TOC nav, article prose, and right taxonomy sidebar. Features code blocks, callouts, see-also grid, and the full Haleiki design system.

The site-wide columnar footer component. Dark surface with brand column, three link columns, content notice, and copyright bar. Designed to work on both day and night themes.

The complete Haleiki design system reference. Brand mark, OKLCH colour palettes for both themes, typography specimens, spacing system, layout tokens, and implementation notes.

The wiki's front door. Hero with prominent search, category card grid with real article links, featured articles, knowledge tier browsing, and quick links. Designed as a library entrance.

Articles within a single category, organized by tier and subcategory. Uses Tibetan Buddhism as the example with 16 articles across 5 subcategories. Right sidebar with category metadata.

The complete card catalog. All 90 articles organized by category and subcategory with a sticky left nav for category jump links. IntersectionObserver tracks scroll position.

Structured knowledge article with standardized sections. Features Quick Definition callout, prerequisite cards, example panels, common error warnings, and two-column confusion contrast grid. Mark-and-Sweep as example.

CC BY-SA compliance page listing all 90 source articles and media with full provenance. Grouped by source project (Wikipedia, Rigpa Wiki) and category. License text summaries.

Dedicated search results page with faceted filtering. Left sidebar filters by page type, category, and tier. Eight mock results for 'ownership' with highlighted query terms.

The news section landing page. Hero article card, two side-by-side secondary stories, compact recent posts list, and category/tag sidebar sections. Newspaper-style above-the-fold hierarchy.

Individual news article with focused reading layout at 700px. Date, category, tags, author, full prose with callouts and code blocks, prev/next navigation, and related posts.

Paginated chronological archive of all news posts, grouped by month. Compact rows with date, title, and category. Pagination controls at top and bottom.

Tag cloud with three size tiers based on frequency, plus per-tag post listings. 24 tags across 42 posts. Tags link to anchor sections with their associated articles.

Editorial categories for news posts (Announcement, Architecture, Content, Design, Feature). Card grid with descriptions and recent posts, plus full post listings per category.