We list all the updates, bug fixes, and new features.
New Radio Toggle We added css to support radio toggles.
New Responsive Grid - Denali’s responsive grid allows content to adapt seamlessly to different screen sizes. View Principle
New Component Behavior - Component behavior refers to the way that Denali’s components adapt to fit within the different breakpoints. View Principle
New Page Density & Spacing - Balancing page density and spacing is fundamental to creating interfaces that are easy to consume. View Principle
New Helpers - Flex - Flex helpers, based on flexbox, help layout responsive elements within a container. View Docs
New Helpers - Margins - Margin helpers are used to space out elements. View Docs
New Helpers - Padding - Padding helpers are used to control an elements padding. View Docs
New Theme Your App - Follow the steps below to theme your app with Denali. View Guide
New Grouped Chips We added grouped chips to help you display key value pairs. View docs
New Fields - These principles includes the basic foundation, types, positioning and states. View Principle
New Fields Responsiveness - By default input groups are not responsive, but by adding a helper class of responsive to the element, will stack the label and input while increasing the width to 100% of the viewport when the screen size is broken down to mobile. View docs
New Toggle Inverse - When a toggle is on a darker background apply .is-inverse class to a toggle's outer <div> container. View docs
Navbar - We recently removed .nav-center, so to replicate it use .nav-right and use .nav-group to section off navbar sections. View docs We also added responsiveness to the navbar by added some classes and elements. View docs
New Containers - Containers are a foundational layout element. Denali offers a choice between a basic container and a full container. Basic containers can be placed within full containers for added flexibility. View docs
New Rows - Rows horizontally layout content and are direct children of containers. View docs
New Columns - Columns must always be wrapped within rows and are used to layout content vertically or horizontally. View docs
Buttons - We just published out principles for buttons. This includes the basic foundation, labels, density and details on the states and usage for each type of button. View Principle
Denali is a comprehensive and customizable design system and CSS framework that provides a scalable approach to efficient UI design and development. Denali has worked so well for us internally that we’ve decided to share it with the open source community in the hope that your projects may also benefit from its use.