Antoine Quote Eames Quote Hoffmann Quote Lee Quote Mingus Quote

Simple Elegance, revisited by E*TRADE

A unified aesthetic plays a key role in making E*TRADE a connected, engaging and meaningful experience. By drawing inspiration from the world of finance where speed is paramount, our design language supports the perception of speed, by being efficient and minimalist.

Through the Design Language, we've created an aesthetic that applies the abstract principles of simple elegance so our experiences are differentiated, easy to use and easy to comprehend.

February 9th Release (2019.2.9)
Text Fields Styles Fix to text input fields with only one input group
Tables Styles Update table striping
Universal messaging Styles Universal message h4 now increases in size at the smallest breakpoint
Bitbucket Styles Add sticky header css to styles
Bitbucket Styles $border-color updated to #e4e4e4
Bitbucket Styles Remove border-radius from cards
Bitbucket Styles Add Graphik for testing
Tabs Styles Add new tabs variations
Pagination Styles Updates to pagination documentation
Colors Styles Add copy classname to colors page
Storybook React React: deprecate secondary card style
Storybook React React: update to the expand collapse component
Storybook React React: add progress bar
Storybook React React: add minimal navigation
February 1st Release
Tabs Styles Fix issues with Tab updates as released on 2019.1.25
Tabs Styles Add Tab Enhancement .nav-tabs-no-overflow
January 25th Release (2019.1.25)
Footer Documentation Clean up markup in the footer legal text.
Text input Documentation Add usage for text fields with icons. They do not support illustrative icons.
Buttons Documentation Large mobile button size is specced as 49px on the buttons page, should be 45px
Formatting Documentation Replaced the replay icon on the real time quotes example to the refresh icon on the formatting page.
Toolkit Color update: Change green ui to purple in DSM
Bitbucket Styles Color update: All UI using $brand-green will switch to new purple
Bitbucket Styles Color update: Create accent CLASSES based on current $variables
Cards Documentation Color update: Accent colors on the documentation cards page - replace chart classes with accent classes
Bitbucket Styles Nav tabs: Add a feature tab variation to tabs
Bitbucket Styles Nav tabs: Active tab text in tabs should be purple color
Bitbucket Styles Nav tabs: Nav tabs should support multiple lines of content, filling available width
Bitbucket Styles Tables: Table row needs a vertical-align:top helper class to handle form error states
Bitbucket Styles Tables: Enhance table-stacked to support any content in headers
Bitbucket Styles Minimal navigation: Link + icon pair on minimal navigation should be link color, not grey
Bitbucket Styles Cards: Change card border color to $border-color
Bitbucket Styles Cards: Deprecate secondary card style
Bitbucket Styles Toggles: Toggles with inline variation are not toggleable when clicking on the toggle
Bitbucket Styles Text: Refactor text helper classes to create a text-small class
Bitbucket Styles Text: Small label should be 13px on mobile
Bitbucket Styles Lists: Remove padding-bottom from list-inline
Bitbucket Styles Sticky header: Custom CSS for sticky/stacked header
Storybook React Library Expand collapse: Correct markup in Expand Collapse component
Bitbucket Styles Expand collapse: Fix the collapse div on the expand-collapse from shifting during animation
Storybook React Library Text input: Update TextInput type field
Bitbucket Styles Repo inhancements: Add grunt-babel @babel/core to package.json
January 15th Release (2019.1.15)
Storybook React Library Add VerticalOffset component
Storybook React Library Add ExpandCollapse component
Storybook React Library Add sticky header to Table component
Storybook React Library Add ClassNameDecorator component
Storybook React Library Add mousenter and mouseout events to Button component
January 11th Release (2019.01.11)
Bitbucket Styles New helper class for localization - Right to Left support
Bitbucket Styles Add Instagram icon to styles
Cards Styles Cards with an image (not a background) stretch in IE 11
Bitbucket Styles _list.scss is imported twice in design language
Expand collapse Styles Added an expand collapse helper class
December 17th Release
Deffinition lists Styles Fixes an issue with definition list were the dd did not render correctly
December 14th Release
Colors Styles New primary purple (Donatello Purple) sass value ($primary-color)
Colors Styles The $link-color will switch to new $primary-purple
Colors Styles The chart color 1 is now our new $primary-purple. $chart-color-2 replaces chart-color-7. Other chart colors move down 1.
Colors Styles Create $dark-background-color (plum) sass value to be used as colors for UI
Colors Styles Create a new "Accent Colors" section on the colors page on etrade.design
Styles Bitbucket Text field updates to form elements
Styles Bitbucket New blockquote styles added
Styles Bitbucket Restore "text-disclaimer" style
November 30th Release
Bitbucket Styles Fix to the table footer (tfoot) which adjusts spacing and adds text-bold
Buttons and links Styles Fix outline around btn-link
Bitbucket Styles Removed Ruby as a dependency of design language
Tabs Styles Update tabs (nav-tabs) with transparent border gradient
Tabs Styles Update tabs with a .nav-list-center helper class
Definition lists Styles Fix for a definition list alignment issue, where text was overflowing
November 15th Release
Form elements Styles bug fix for text field with icon group left pushes text when in focus
Toggles Styles update to toggle making it more readable
Form elements Styles add transparent background on inline dropdowns and update to disabled state
Datepicker Styles added Datepicker page
November 12th Release
Tabs Styles nav-tabs-border fix
Buttons and links styles fix to the dropdown-right helper class - removes padding right
November 6th Release
Universal message Styles Fix for universal message icons not rendering properly
Button and links Styles Add new helper class .dropdown-right for .dropdown and .btn-group
Cards Styles Fix for cards with an image (not a background) stretch in IE 11
Definition list Styles Create .definition-list-condensed
Bitbucket print.scss Print page has unwanted border boxing for certain spans
package.json Styles Namespace CSS as both edesign and design in build process
October 30th Release
Storybook React library Datepicker React component
October 8th Release
Buttons Styles Fixed button sizes not working
September 28th Release
Storybook React library Added inline props to Dropdown component
Storybook React library Added ToggleButton component
Storybook React library Added Error component
Storybook React library Stacked prop added to Table component
Storybook React library Title prop added to Button component
Storybook React library Lodash dependency refactor
September 27th Release
Pagination Styles Pagination component added
Tables Styles Stacked table component
Buttons/Links Styles Fixed an issue where anchor links were not inheriting font weight
Tables Styles Fixed an issue where the hover state on tables was not working properly
Definition Lists Styles Fixed an issue where empty definition list items caused mis-alignments
Buttons/Links Styles Fixed an bug in which button links were not resizing on breakpoints as expected
Tables Styles Added styling for table footers
August 23rd Release
Storybook React library Flyout component added
Storybook React library FileUpload component added
Storybook React library Custom className bug fixed in TableCell component
August 17th Release
Storybook React library Segmented Progress Bar component added
Storybook React library Dropdown component prop updates
Storybook React library TextInput component prop updates
Storybook React library Automated component creator added
July 27th Release
Storybook React library Modal component added
Storybook React library Spinner component added
Storybook React library Toast component added
June 29th Release
Storybook React library Universal Message component added
Storybook React library Text field component added
Storybook React library Text area component added
Storybook React library Text field prefix and suffix support
Storybook React library Text field with icons support
Buttons/Links Styles Fixed sizing of small button
Cards Styles Fixed dismissible compact card
June 26th Release
Storybook React library Hotfix to remove error messages for Button component href and "inline-link" Buttons
Design Language Inspector Browser extension Add ability to preview / inject latest Design Language in page
Design Language Inspector Browser extension Add Wireframe Mode
June 15th Release
Typography Styles DEPRECATION NOTICE: iOS and Android font stacks have been removed. They will revert back to the customer type stack sizing.
Typography styles Customer typography updated to Fort font family.
Typography styles Updated font stacks to medium font weights for headers
Typography styles Added responsive text alignment helper classes
Typography styles Updated font stacks to medium font weights for headers
Definition Lists Styles Column support for definition lists
Tags Styles Fixed tags overflowing on mobile and wrapping text
Toggles Styles Toggles component added
Spacing Styles Fixed vertical offset XXXL using wrong spacing
Cards Styles Fixed compact cards with images
Typography Styles Added line height reset helper class
Sliders Styles Updated slider's initial value to reflect change to new link color
Toasts Styles Toasts can live outside of the toast container
Buttons and Links Styles Updated disabled treatment for primary and primary outline buttons
Buttons and Links Styles Dropdown buttons now support buttons stlyed as links dropdowns
Form elements Styles Inline dropdowns show an arrow indicating it will invoke a dropdown menu
Design Language Inspector Browser extension Improve Design Language version detection
Design Language Inspector Browser extension Improve extention update feature