Skip to Main Content
Dallas College PEGASUS
Updated: Jan. 21, 2024
Skip to Main Content

Home

Patterns, Elements and Guidelines for
Accessible Styles, Usability and SEO

Version 0.6.8 — Updated: Jan. 21, 2024

Elements

Typography
Colors
Icons
Buttons
Grid

Patterns

Action Links
Boxes, Content and Image
Boxes, Data
Buttons, Grand
Calls-To-Action
Cards, Feature
Cards, Flexbox
Cards, Organizational
Images with Caption
Tiles

Components

Accordions
Cards, Award
Cards, Department
Cards, Event
Cards, People
Cards, People NEW
Dropdowns, Grand
Testimonials

Templates

Page: Conference Landing
Module: Campus Accordions

Utilities

Margins and Padding
Spacers
Shadows
Widths and Heights

Guidelines

Banners and Graphics
Known Issues
Naming Sites and Pages
Page Layouts
Minimal Headers and Footers
PDFs, Word Docs and Accessibility
Navigation Settings

Table of Contents


Elements

Elements are the most basic and fundamental building blocks with which to build pages and layouts in PEGASUS.


Patterns

When two or more Elements come together, they form a Pattern which is reusable block of generic content.


Components

Specialized Patterns that are either for a specific use or contain any sort of functionality comprise a Component.


Templates

Elements, Patterns and Components come together to provide Templates for Pages, Modules or Snippets.

This model is adapted from the principles of Atomic Design by Brad Frost.