BDA UI TOOLKIT
Base
Typography
Voice & Tone
Color Palettes
Badges
Loaders
Containers
Alerts
Collapsibles
Content Sections
Footer
Modals
Popovers
Tab Panels
Tables
Tooltips
Wells
Controls
Buttons
Button groups
Button dropdowns
Forms
Navigation
Global Navigation
Sub-Navigation
Breadcrumbs
Pagination
Media
Icons
Images
Data Visualization
Videos
Benefits Delivery & Administration UI Toolkit (Draft)
Version: 0.0.2 –
Changelog
Site Map
Base
Typography
Body copy
Headings
Addresses
Blockquotes
Lists
Voice & Tone
Voice
Tone
Color Palettes
BDA UI Toolkit Colors
Functional
Semantic
Tints/Shades
Grays
Color Contrast
Badges
Loaders
Progress Bars
Spinners
Containers
Alerts
Variants
Collapsibles
Drawers
Accordions
Content Sections
Footer
Modals
Examples
Popovers
Static examples
Live examples
Contextual Help Cursor
Tab Panels
Tables
Variants
Contextual classes
Responsive tables
Tooltips
Wells
Controls
Buttons
Button tags
Colors
Sizes
Active state
Disabled state
Button groups
Basic example
Button toolbar
Sizing
Nesting
Button dropdowns
Variants
Sizing
Forms
Basic example
Supported controls
Fieldsets
Input states & assistance
Navigation
Global Navigation
Sub-Navigation
Vertical
Horizontal
Breadcrumbs
Pagination
Default pagination
Pager
Media
Icons
Functional icons
Examples
Images
Brand-Aligned
Retina images
Responsive images
Image shapes
Data Visualization
Videos
View full-size
(opens in a new browser tab)
×
ES UI Guidelines Changelog
Ver. 0.0.2
Base:
Updated the "Contrast" section to have basic contrast check results for branded colors and grays;
Added 'Spinners' to the "Loading" section.
Containers:
Added guidance for site footers.
Controls:
Adjusted button text sizes;
Increased button padding;
Also fixed the issue of button text sitting too high within the affordance;
Added datepicker functionality.
Added slider functionality:
Single value;
Range;
Vertical variants of each of the above.
Navigation:
Wrapped all navigational element parent tags with
<nav>
tags;
Changed pipe character separators to CSS-rendered chevrons in Breadcrumbs;
Changed color of the badges in the global nav from
@wtwViolet
to
@wtwMagenta
.
Ver. 0.0.1
Initial WIP Version
Sections shared with other LOBs:
Navigation;
Media.