Release Notes


Style updates to checkbox appearance

March 09, 2019

  • Added color variable $highlight-outline
  • Used variable to create a new class that highlights the solid checkbox when users use keyboard navigation to highlight elements

Style updates to form field appearance

March 09, 2019

  • Changed the border-radius of .text-input, .textarea, and .select form fields from 0 to 3px
  • Changed the border-radius of .checkbox labels from 30% to 3px
  • Added $fill-gray-light color (#d7d7d7) and corresponding .fill-gray-light class
  • Changed border color for all form fields to $fill-gray-light

Breaking down utilities for more granular imports

February 28, 2019

  • Broke apart solid-utilities/colors, solid-utilities/grid, solid-utilities/layout, and solid-utilities/typography into optional smaller imports for applications that do not need all helper classes, to reduce code bloat.
  • Added an .xbold class to make use of the $xbold font weight variable

Colors Updated For Contrast - Follow-up

February 25, 2019

  • Changed `$text-pink` from `#f43192` to `#e40c78`

Colors Updated For Contrast

February 25, 2019

  • Changed `$fill-pink` from `#f43192` to `#e40c78`
  • Changed `$text-promoted-orange` from `#f7ad19` to `#bf5608`
  • Changed `$fill-teal` from `#0dccb0` to `#007c7c`
  • Changed `$text-gray-lightest from `#999999` to `#757575`

Display Flexbox Moved

February 21, 2018

  • {"Moved `display"=>"flex` rules alongside other display mode rules"}

Popover Fix

January 09, 2018

  • Potential Breaking Change: top and bottom popover classnames were flipped

Popover Component

January 05, 2018

  • Added: components for top, right, bottom, and left popovers with white and gray backgrounds

New Instagram Brand Color

December 06, 2017

  • Updated the hex value of the instagram fill and text color.

Fix broken 2.9.81

November 15, 2017

  • Updates the package.json version in order to override a broken version

New Extrabold Variable

November 03, 2017

  • Added: new $xbold variable for a heavier font-weight

Updated YouTube Red Text Color

October 27, 2017

  • updated the hex value of the youtube text color

Updated YouTube Red Fill Color

October 27, 2017

  • updated the hex value of the youtube fill color

Adjusted White Button Hover State

October 18, 2017

  • .button--white now hovers to .8 transparency instead of darkening to a light gray, making it look less dull when placed on dark backgrounds.

Fix release notes

August 23, 2017


Add $fill-buzzfeed color for social and svg.

August 22, 2017

  • Added: $fill-buzzfeed color (same value as $fill-red)
  • Added: .fill-buzzfeed class
  • Added: .svg-buzzfeed class

Update Deployment workflow.

July 13, 2017

  • Potential Breaking Change: removed the !important declaration on the .block-grid__item inline-block style
  • Deprecated: docs - they have now been moved to the solid_docs project
  • Deprecated: dist files - these are now published with the package
  • Deprecated: flex - moved the non-prefixed version to deprecated.scss
  • Added: a prefixed version of the .flex class
  • Added: icons for the Apple News and RSS social buttons
  • This release is the start of a new deployment process which sees the solid documentation moved to mono/solid_docs.

Auto Height and Unbolded Headers

June 28, 2017

  • Added: Auto height layout class.
  • Reset all header elements to normal font-weight by default.

New Flex Classes

April 25, 2017

  • Added: Flexbox classes to accommodate for space-between and space-around styling on the main axis, including .xs-flex-justify-space-between, .xs-flex-justify-space-around, .xs-flex-align-space-between and .xs-flex-align-space-around. Thanks Jared for the contribution!

SVG Hover Fix

March 22, 2017

  • Reduces reach of SVG hover states to effect only SVGs appearing within explicitly styled links including .link-blue, .link-gray, .link-gray-lighter and .link-white
  • Fixes previous release note bugs

No More FOIT

March 10, 2017

  • Added: Default hover states for SVGs that appear within a tags
  • Removed font reset from Meyer's reset styles to remove instances of FOIT.

The Teal and Purple Show

January 20, 2017

  • Added: Teal and purple fill and SVG fill colors
  • Added: Purple text color
  • Added: Apple News and RSS social buttons
  • Added: Body copy is now .text-gray as default

The Colors

December 08, 2016

  • Potential Breaking Change: Removed an override that replaced the :focus state for buttons. Buttons now use the browser outline for :focus.
  • Fixed error in docs for the generate-breakpoint-prefixes mixin
  • Updated color values based on the branding team's new color palette

I Believe I-con Fly

November 15, 2016

  • Potential Breaking Change: Removed !important from list-unstyled margin and padding.
  • Deprecated: Renamed media-query mixin to solid-breakpoint mixin and deprecated old name.
  • Added: SVG icon sizing classes and accessibility documentation
  • Added: Error handling in solid breakpoint mixin
  • Added: SMS button with icon
  • Added: Declared all variables as !default to allow for easier theming.
  • Added: MIT license
  • Updated social buttons to use brand SVG icons and improved accessibility.

Flexbox Alpha

September 15, 2016

  • Added: Flexbox classes. This is an alpha release, final implementation may change.

Support for Disabled Buttons

August 25, 2016

  • Added: Additional support for the disabled attribute on buttons
  • Added: Disabled opacity Sass variable

Pagination Class Fix

July 29, 2016

  • Corrected inconsistently written pagination button classes

Pagination and Refactored Messaging

July 28, 2016

  • Breaking Change: Refactored messaging component to use inline SVG icons.
  • Deprecated: Messaging component. For old messaging styles, include messaging.deprecated.scss
  • Added: Warning message is now a component.
  • Added: Pagination is now a component.
  • Slightly decreased size of Card component shadow.
  • Card component now uses our $border-lighter variable.

Introducing The Half Space

June 23, 2016

  • Potential Breaking Change: Removed !important on table elements inside .table-border.
  • Added: New 05 spacing unit with a value of .25rem for spacing and positioning classes
  • Added: White link class
  • Added: Support for momentum scrolling on iOS overflow elements
  • Updated the fallback typeface for Caponi to be Helvetica instead of Georgia.

Removed Important On Button Icon SVG Margin

June 10, 2016

  • Potential Breaking Change: Removed !important from the svg in button with icon to allow svg margin to be overwritten by Solid utility classes. This allows for a centered icon if there's no text in the button.
  • Small updates to docs.

Orange You Glad I Added Pink

June 02, 2016

  • Added: Link to the Solid Sketch template in the docs
  • Added: Pink and promoted orange text colors
  • Added: Pink svg fill

Solid 2

May 27, 2016

  • Breaking Change: Removed deprecated line heights, color variables, non-prefixed type classes, and buttons

Responsive Typography Line Height

May 26, 2016

  • Updated responsive text sizes to have correct line heights.

Responsive Typography

May 23, 2016

  • Deprecated: Non-prefixed typography size classes.
  • Added: Responsive text size classes
  • Rewrote and clarified Layout documentation.

Card Component

May 12, 2016

  • Added: Card component
  • Edited a redundant release note.
  • Moved installation instructions out of and into

Updated Line Height Values For Headers

May 06, 2016

  • Potential Breaking Change: Updated the values of $line-height-1, $line-height-2, and $line-height-3 to tighten line heights for headers.
  • Deprecated: $line-height-4, $line-height-5, and $line-height-6
  • Added: Reference to fonts repo in Typography docs
  • Added: Documentation about !importants to FAQ section

SVG Colors, Button State Tweaks and Less Important Labels

April 07, 2016

  • Potential Breaking Change: Removed !important from display: block; on form labels.
  • Added: Disabled input styles to all input types.
  • Added: Styling for active button states.
  • Added: Transition for button hover states.
  • Added: Classes for SVG fill colors.
  • Decreased size of checkbox and radio labels.

Bug Fix For Deprecated Text And Fill Color Classes

March 30, 2016

  • Properly deprecated the double dashed text and fill colors that were supposed to be deprecated in Solid 1.5.1.

What Goes Around Comes Around

March 24, 2016

  • Added: SASS Variables to docs.
  • Added: Right and left rounded borders.
  • Fixed a bug to make modal content scroll when taller than the viewport.
  • Fixed a bug to unify outlined and non-outlined button heights.
  • Updated Normalize to the latest version (4.0) and removed comments from the resulting compilation process. This reduces the final file size of Solid by about 5%.

No Double Dashes in Colors and Borders

March 17, 2016

  • Potential Breaking Change: Reduced the h1 size to 1.75rem (28px). Previously h1 was 2.25rem (36px).
  • Deprecated: All lighter versions of borders have changed from .xs-border--lighter to .xs-border-lighter. Double-dashed class names will be removed in 2.0.
  • Deprecated: All fill, link and text color classes and variables now use single dash modifider format instead of the double dash format. Any classes that were previously using the double dash format will be removed in Solid 2.0.
  • Added: Font-smoothing: antialiased to the .slab class.

Button Refactor

March 11, 2016

  • Potential Breaking Change: .button--primary is now .button.
  • Deprecated: Due to breaking buttons changes we now have a deprecated buttons partial you can load for the old styles. It is named solid-utilities/_buttons.deprecated.scss. It will be removed in Solid 2.0.
  • Added: White button
  • Added: Transparent button
  • Added: Button mixin can be used to make additional buttons.
  • Fixed bug to extend input error state borders to textareas and small inputs.
  • Table padding lessened to .75rem

X Gonna Give it To Ya: Close Button in Messaging STABLE

February 23, 2016

  • Stable version of 1.4.4

X Gonna Give it To Ya: Close Button in Messaging

February 18, 2016

  • Deprecated: Package did not publish correctly, use version 1.4.5 instead.
  • Added: Close option to Messaging component.


February 08, 2016

  • Potential Breaking Change: Changed textarea to a block element, to avoid an undesired margin-bottom.
  • Added: Tags are now a component.

Social Colors & Tabular Figures

January 21, 2016

  • Added: Social link colors.
  • Added: Support for tabular figures in OpenType.

New Vertical Alignment Classes and Refactored Button Heights

January 14, 2016

  • Potential Breaking Change: Removed explicit height on buttons, inputs, selects, and button groups.
  • Potential Breaking Change: Unified line height on buttons, inputs, selects, and button groups.
  • Added: Vertical alignment utility classes.
  • Bug fix for secondary button with icon hover state.

Modals Are in and Social Buttons Are Back!

December 22, 2015

  • Added: Modals are now a component.
  • Added: Added back in social buttons.
  • Added: Z-index variables.
  • Added: Prefixed width-auto utility class.
  • Added: Small textarea.

No Gutters Class on Block Grid

December 08, 2015

  • Added: Optional no gutters class to block grid.
  • Added: Override for iOS default input style.
  • Removed periods before the em and strong elements in the Typography docs.

Social Buttons Removed

December 02, 2015

  • Breaking Change: Social Buttons Removed Added back in release 1.4.0.
  • Added: Dist binaries to docs.
  • Restructured docs and reformatted titles.

No Margin on Buttons

November 17, 2015

  • Potential Breaking Change: Buttons now have no margin.
  • Potential Breaking Change: TDs are now vertically aligned to center by default.
  • Added: Line height to buttons.
  • Removed 3px border radius on table borders.
  • Updating typography line height to rem values.
  • Button and link hover transitions are now faster.

Social Buttons Deprecated

October 27, 2015

  • Potential Breaking Change: Renamed _style.scss to _borders.scss.
  • Potential Breaking Change: Removed !important from ol and ul styles in typography base styles.
  • Deprecated: Social buttons will be removed in Solid 1.3.0. Added back in release 1.4.0.
  • Fixed misaligned text in select menus.
  • Fixed an error in docs where the .list-unstyled class wasn't added to the unstyled list example.
  • Fixed a typo in overflow section where the nowrap class was being used instead of truncate.

Fix Grid Offset Classes and Remove Duplicate buttons.scss

October 06, 2015

  • Removed strange characters that were messing up grid offset classes.
  • Removed duplicate _buttons.scss file that was in solid-components.
  • DOCS: swapped out Harp js for Jekyll.

Import Structure Update

October 01, 2015

  • Potential Breaking Change: Restructured imports to allow importing base/utilities/components seperately.
  • Potential Breaking Change: Literally everything inside solid-utilities.scss is !important.
  • Added: Button groups are now a component!
  • Fixed a typo in overflow section where the nowrap class was being used instead of truncate.

Patch: Display Border Box is Back in

September 24, 2015

  • Border box was accidentally removed in 1.0.6 - it's back in!

Everything is !important, Social Buttons, Class Cleanup, Docs Cleanup

September 23, 2015

  • Breaking Change: .xs-show has been deprecated. Use the responsive display classes found in Utilities going forward.
  • Breaking Change: .xs-half-width and .xs-full-width have been deprecated in favor of using .xs-col-6 and .xs-col-12.
  • Breaking Change: .block-grid-item is now .block-grid__item, in line with our other BEM classes.
  • Potential Breaking Change: Added !important to all utility classes
  • Added: Specific line heights for each type size.
  • Added: Buttons with icons and social buttons.
  • Added: .xs-static and .xs-overflow-visible in case one needs to reset those at a specific breakpoint.
  • .block-grid is no longer necessary to create a Block Grid.
  • Fixed overflow classes to be responsive.
  • Rewritten Grid, Block Grid, Responsive and Utilities documentation.
  • Overhauled navigation. Now with hot new sublinks and design!

Change Segmented Buttons, Various Fixes in Docs

September 04, 2015

  • Breaking Change: Segmented Buttons are now Button Groups. CSS now reflects other button CSS.
  • Added: Added Favicon to docs.
  • Added: Spacing utilities go up to 6 (i.e. xs-mr6).
  • Added: $space-5 and $space-6 variable to all spacing classes.
  • Rewritten Typography, Colors, Buttons, Forms, Messaging and Tables documentation.
  • Button documentation reflects CSS implementation.
  • Radio input and checkbox CSS are now implemented the same way.

Solid as Node Package

August 26, 2015

  • Solid 1.0.4 is now published as a node package

Prepare Solid for Public Launch (plus typo fixes!)

August 25, 2015

  • Potential Breaking Change: Form Elements now Wrapped in Fieldset
  • Updated Release Notes

Fix Typos, Inconsistencies in Docs

August 11, 2015

  • Added: bower.json for your convenience.
  • Solid logo is visible in docs.
  • No more responsive prefixes on type size classes.
  • Responsive prefixes re-added on floats.
  • Various typos and inconsistencies resolved in docs.

Fix Bad Pruning in package.json

July 30, 2015

  • Merge pull request
  • Fix dev dependencies so that make dev does not prune harp.

Solid 1.0

July 29, 2015

  • Solid now has a package.json and instructions on how to integrate this framework into YOUR project.