Component status
When we add, make significant updates, or deprecate a component we update their status so that it’s clear what’s available to use. Check back here anytime to see current status information.
What's new in Vanilla 2.16
| Component | Status | Version | Notes |
|---|---|---|---|
| Application layout | New |
2.16.0 | We added new layout styles for building responsive full-screen applications. |
| Suru strip | New |
2.16.0 | We added new strip variants .p-strip--suru and .p-strip--suru-topped. |
Previously in Vanilla
| Component | Status | Version | Notes |
|---|---|---|---|
| Chip | New |
2.15.0 | We added the new .p-chip component to be used to display small actionable pieces of information. |
| List inline stretched | New |
2.14.0 | We added the new .p-inline-list--stretch list variant that arranges items so they span the full width of the parent container. |
| Accordion | Updated |
2.13.0 | We updated the accordion component with a new .p-accordion__tab--with-title variant that allows using headings in accordion buttons. |
| Muted text | New |
2.12.0 | New u-text--muted utility class has been added. |
| Icons | Updated |
2.12.0 | The icons have been updated to new style. |
| Icons - Question | Deprecated |
2.12.0 | The p-icon--question has been deprecated will be removed in future release v3.0. Please use existing `.p-icon--help` icon instead. |
| Side navigation | Updated |
2.11.0 | A no-JS fallback was added for the side navigation toggle functionality on small screens. |
| Side navigation | Updated |
2.11.0 | A new raw HTML variant of the side navigation component. |
| Side navigation | Updated |
2.10.0 | Update to the responsive styling of the side navigation. |
| Side navigation | New |
2.9.0 | New side navigation component was added. |
| Navigation | Updated |
2.8.0 | New navigation classes (p-navigation__items, p-navigation__item, p-navigation__link) were added to replace existing (p-navigation__links, p-navigation__link, and classless <a>). |
| Navigation | Deprecated |
2.8.0 | Navigation classes p-navigation__links, p-navigation__link, and classless <a> are deprecated and will be removed in future release v3.0. Please use new class names (p-navigation__items, p-navigation__item, p-navigation__link) instead. |
| Contextual menu | Updated |
2.7.0 | Added dark theme to contextual menu. |
| Heading classes | Updated |
2.7.0 | New heading classes with numbers (p-heading--1, ...) were added for consistency with other class names we use. |
| Heading classes | Deprecated |
2.7.0 | Heading classes with numbers as words (p-heading--one, --two, ...) are deprecated and will be removed in future release v3.0. Please use class names with numbers (p-heading--1, --2, ...) instead. |
| Range input | New |
2.6.0 | Styling of Slider component was added to all <input type="range"> elements by default. This makes p-slider class optional for styling range inputs. |
| Checkbox, radio button | Updated |
2.6.0 | New `is-table-header` added to properly align checkboxes and radio buttons used in table headers. |
| Slider | Updated |
2.6.0 | Styling of Slider component was added to all <input type="range"> elements by default. This makes p-slider class optional for styling range inputs. |
| Contextual menu | New |
2.5.0 | Optional state indicator was added to contextual menu |
| Font metrics | New |
2.5.0 | Added u-visualise-font-metrics utility to visualise font metrics |
| Line length | New |
2.5.0 | Added $max-width--default variable and u-no-max-width utility to control line length |
| Table cell padding overlap | New |
2.5.0 | Added u-table-cell-padding-overlap utility to overlap table cell padding |
| Truncation | New |
2.5.0 | Added u-truncate utility to truncate text with ellipsis |
| Social icons | Updated |
2.5.0 | Updated style of social icons. Added new .p-icon--rss and p-icon--email icons. |
| Social icons | Deprecated |
2.5.0 | We will be removing p-icon--canonical and p-icon--ubuntu from social icon set in future release v3.0 |
Upgrade guide
During the development of Vanilla v2 several CSS class names or SCSS mixins and placeholders have been deprecated and will be removed in the upcoming release v3.0.
See the upgrade guide to learn about all the breaking changes that will happen when these deprecated features are removed and how to update the code for a future version of Vanilla.
Status key
Newly released components, utilities or settings that are safe to use in projects.
These components, utilities or settings are in the process of being removed and should no longer be used in projects.
Design spec and code implementation are not yet finished.
These are existing components, utilities or settings that have been updated either through design or code.
Proposal approved in our bi-weekly meeting . A design spec is created and development starts ready for code review.