GLL Component Library

Previews

      • Button
      • Hyper Link
      • Icon
      • Article
        • Default
        • Hero Only
        • Multi Panel
      • Carousel
      • Footer
      • Header
      • Hero
      • Pattern
      • Image
      • Media Card
      • Text Card
  • Style Guide

No matching results.

Pages

  • Overview
  • Colours
  • Typography
  • Spacing
  • New Components

No matching results.

Overview

GLL Component Library

A hierarchical design system built with ViewComponent for composing pages from reusable panels and patterns.

Component Hierarchy

Documents Page, Article — top-level document shells
Panels Hero, Carousel, Pattern, Breadcrumb — full-width page sections
Patterns MediaCard, TextCard, Image, Video — reusable content blocks
Components Button, HyperLink, Icon — atomic UI elements

How Composition Works

Documents compose panels via slots. Each panel type maps to a component class in PANEL_COMPONENTS.

Panels compose patterns via slots. The PatternComponent renders any pattern type dynamically using the Patterns registry.

Patterns compose components (buttons, links, icons) via slots.

Key Conventions

  • Panel components use panel: as the standard kwarg
  • Pattern components use pattern: as the standard kwarg
  • All slot population happens in templates via with_* methods — never in before_render
  • Slot names reflect design intent, not component type (e.g. cta not button)
Colour System