Design, simply elegant.

The E*TRADE Design Language is a design system that provides a seamless experience from end to end.

November (2019.11.16)
Colors etrade.design Updated the Color page so the swatch is more readable in IE 11.
Spacing etrade.design Update the spacing page so it looks the same in IE 11.
Release Notes etrade.design Fixed the active link so it now shows up on the release notes page.
Charts etrade.design Move chart colors from the colors page to the chart documentation page.
All etrade.design Created a breakpoint selector for the iFrames.
All etrade.design Add CodeMirror plugin for React to be used for formatting CodeSnippet.
All etrade.design Add a React copy icon functionality to CodeSnippet
Storybooks react.etrade.design Added a text field phone number formatting input.
Storybooks react.etrade.design Refactored to the Text field, so live formatting is accessible.
Storybooks react.etrade.design Refactored the Flyout component. Added ability to open and reposition/resize based on the relationship with the browser window.
Storybooks react.etrade.design Fixed a bug where the React Universal Message was throwing an error when descendants were used.
Bitbucket Design Language Styles Fixed a bug in the grouping right border, where is was misalign on some monitors.
November release (2019.11.1)
Bitbucket design-language Fixed instances where double focus rings were showing on links.
Bitbucket design-language Updates to copy build script.
Bitbucket design-language Added the ability to style text as italic using the `.text-italic` class.
Typography etrade.design Added documentation for the `.text-italic` class.
CardGroup design-language-react Created CardGroup component.
All etrade.design Removed jQuery from Google Tag Managment analytics tags.
All etrade.design Fixed issue where the search field icon was misaligned.
Colors etrade.design Fixed issue where the color page was showing incorrect border-color hex value.
ExpandCollapse design-language-react Enhancements made to the ExpandCollapse component icon including adding the ability to pass a class to the ExpandCollapse icon, adding the ability to disable rotation of the ExpandCollapse icon, and adding the ability to change the placement of icon to the right.
All etrade.design Fixed an issue where styles were not loading on Internet Explorer 11 in some cases.
Print etrade.design Added print styles page.
Cards etrade.design Fixed layout issues on cards page on Internet Explorer 11.
TextInput design-language-react Fixed issue where TextInput component does not add correct classes for icon rendering.
Spacing etrade.design Fixed layout issues on spacing page on Internet Explorer 11.
Copy Usage etrade.design Fixed issue where copy usage page underline is offset on Internet Explorer 11.
All etrade.design Fixed an issue where the sticky nav scroll goes to the wrong position on Internet Explorer 11.
All etrade.design Fixed an issue where the sticky nav scroll goes to the wrong position on Internet Explorer 11.