Stateless Components

Structure

DesktopLayout

Header

Uses <PageTitle> and <SmallPassiveButton>.

Overlay

Navigation

CompanyLogo

MediumNavItem

MediumNavItemHover

MediumNavItemSelected

SmallNavItem

UtilityNavItem

UtilityNavItemHover

UtilityNavItemSelected

UtilityNav

Uses <UtilityNavItem>, <UtilityNavItemHover> and <UtilityNavItemHoverSelected>.

Account

Uses <MediumAvatar>.

Media

LargeAvatar

MediumAvatar

SmallAvatar

HeroImage

ArticleThumb

TwitterThumb

Forms

Checkbox

Radio

Switch

Input

IconInput

Current usage is limited to Login and other screens based on that design. Uses <IconInputField> and <SmallIcon>.

LabelInput

Textarea

Select

Option A

Buttons

Standard Interface

Type	Large	Medium	Small	Text
Primary	Large Primary Button	Medium Primary Button	Small Primary Button	Text Primary Button
Danger	Large Danger Button	Medium Danger Button	Small Danger Button	Text Danger Button
Twitter	Large Twitter Button	Medium Twitter Button	Small Twitter Button	Text Twitter Button
Facebook	Large Facebook Button	Medium Facebook Button	Small Facebook Button	Text Facebook Button
LinkedIn	Large LinkedIn Button	Medium LinkedIn Button	Small LinkedIn Button	Text LinkedIn Button
Passive	Large Passive Button	Medium Passive Button	Small Passive Button	Text Passive Button

Standard States

Small Primary Button Hover Small Primary Button Disabled Small Primary Button Loading Small Primary Icon Button Text Primary Button Hover Text Primary Button Disabled Text Primary Button Loading

Limited Usage

Login Toggle Button Prev Paging Button Next Paging Button

Icons

HeaderIcon

LargeIcon

MediumIcon

SmallIcon

Typography

PageTitle

SubtleSmallCaps

StoryTitle

StoryExcerpt

Label

Prompts

InlineNoticeAlert

InlineWarningAlert

InlineErrorAlert

Content

Tables

Size	Twitter	Facebook	Facebook Page	LinkedIn
Large
Medium
Small

Stories