Releases: canonical/vanilla-framework
v4.7.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.7.0
🚀 Features
- Add 25/75 grid split support to top navigation by @bartaz (#4960)
- Align top navigation items padding with grid margin by @bartaz (#4948)
💣 Potentially breaking changes
Updates to top navigation (increased padding and new 25/75 layout variant) may cause top navigation items not fit on smaller screens. If your project adjusts $breakpoint-navigation-threshold
you may need to update its value, so that navigation switches to mobile view when items don't fit anymore.
🐛 Bug Fixes
- Fix tracker popup by @britneywwc (#4962)
- Fix GitHub contributors URLs by @bartaz (#4946)
🔨 Maintenance
- Update dependency canonicalwebteam.discourse to v5.4.9 by @renovate (#4944)
- Update dependency postcss-cli to v11 by @renovate (#4965)
- Update dependency stylelint to v16 by @renovate (#4966)
- Update all non-major dependencies by @renovate (#4964)
- Configure renovate versioning for node stable versions only by @bartaz (#4956)
- Fix GitHub contributors URLs by @bartaz (#4946)
Full Changelog: v4.6.0...v4.7.0
v4.6.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.6.0
🚀 Features
- Responsive grid patterns by @bartaz (#4933)
- Adjust spacing between heading groups by @bartaz (#4941)
💣 Potentially breaking changes
With the introduction of new responsive grid patterns (row--25-75-on-medium
, etc), the default responsive behaviour of row--25-75
has changed. Previously on medium screens it did not split the layout, but used a stacked mobile layout. With Vanilla 4.6.0 the row--25-75
will split into 2+4 columns layout on medium screens by default. This also means that is-split-on-medium
modifier class is no longer needed, as its behaviour is now default for row--25-75
.
If you are using row--25-75
without is-split-on-medium
make sure that the layout doesn't break on medium screen sizes.
If you are using row--25-75
with is-split-on-medium
no change is needed, but is-split-on-medium
is redundant and can be safely removed from code.
For more information refer to the Vanilla grid documentation.
🐛 Bug Fixes
- Add support for "Removed" status label to Vanilla changelog by @bartaz (#4943)
- Add more space between logo tag and text by @aaryanporwal (#4924)
🔨 Maintenance
- Reverts postcss-cli update to v11 as it breaks dotrun by @bartaz (#4940)
- Update actions/download-artifact action to v4 by @renovate (#4936)
- Update actions/upload-artifact action to v4 by @renovate (#4937)
- Update dependency postcss-cli to v11 by @renovate (#4938)
- Update all non-major dependencies by @renovate (#4935)
- Update all non-major dependencies by @renovate (#4928)
- Update dependency @testing-library/cypress to v10 by @renovate (#4930)
- Update dependency pyyaml to v6 by @renovate (#4931)
- Update actions/setup-node action to v4 by @renovate (#4929)
Full Changelog: v4.5.1...v4.6.0
v4.5.1
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.5.1
🐛 Bug Fixes
- Fix grid column reordering off by one err by @aaryanporwal (#4922)
- Add missing white background to sticky panel by @aaryanporwal (#4909)
- Show suru on all screens by @aaryanporwal (#4908)
📝 Documentation
- Fix margin in brochure example by @aaryanporwal (#4919)
- Update links component a11y documentation by @aaryanporwal (#4918)
- Update implementation tab for tooltips by @aaryanporwal (#4913)
- Update empty state documentation by @aaryanporwal (#4914)
- Update navigation component a11y documentation by @aaryanporwal (#4916)
- Update logo section component a11y documentation by @aaryanporwal (#4917)
- Use new documentation layout on Vanilla site by @bartaz (#4863)
- Update issue templates by @bartaz (#4906)
- Fixed typo for Button docs by @britneywwc (#4896)
🔨 Maintenance
- Update dependency cypress to v13 by @renovate (#4867)
- Update internal dependencies by @renovate (#4910)
- Update dependency canonicalwebteam.discourse to v5.4.4 by @renovate (#4901)
- Bump canonicalwebteam.discourse to 5.4.3 by @jpmartinspt (#4902)
New Contributors
- @jpmartinspt made their first contribution in #4902
- @aaryanporwal made their first contribution in #4908
Full Changelog: v4.5.0...v4.5.1
v4.5.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.5.0
🚀 Features
📝 Documentation
- Fixed minor typos for Inline Radio and Checkbox docs by @britneywwc (#4892)
New Contributors
- @britneywwc made their first contribution in #4892
Full Changelog: v4.4.0...v4.5.0
v4.4.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.4.0
🚀 Features
- New documentation layout by @bartaz (#4886)
- Add paper background support to side navigation by @bartaz (#4881)
🐛 Bug Fixes
🔨 Maintenance
- Revert pushing to release branch by @bartaz (#4890)
- Update actions/checkout action to v4 by @renovate (#4880)
- Update all non-major dependencies by @renovate (#4879)
- Refresh styles of table of contents component by @bartaz (#4885)
- Ignore warnings to prevent redirects from failing the build by @bartaz (#4882)
Full Changelog: v4.3.0...v4.4.0
v4.3.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.3.0
💣 Fixing misaligned logo sections from 4.2
In Vanilla 4.2 we reworked our logo section component. If used correctly, with correctly sized images it should be a seamless upgrade, but if you have used logo section with logos not correctly spaced by visual design team you may end up with broken look of oversized logos.
In Vanilla 4.3 we introduced a fallback workaround for this regression. It doesn't fix the issue automatically, but we introduced a has-misaligned-images
fallback class name that can be added to broken logo sections if logo images can't be replaced by new ones. You can learn more in the docs.
🚀 Features
🔨 Maintenance
- Adjust font-weight of small caps and h5 by @lyubomir-popov (#4873)
- Update publish-on-release.yml by @samhotep (#4862)
- Update all non-major dependencies by @renovate (#4866)
- Remove old Canonical logo from contribute page by @bartaz (#4861)
New Contributors
Full Changelog: v4.2.0...v4.3.0
v4.2.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.2.0
💣 Potentially breaking changes
In Vanilla 4.2 we reworked our logo section component. If used correctly, with correctly sized images it should be a seamless upgrade, but if you have used logo section with logos not correctly spaced by visual design team you may end up with broken look of oversized logos.
🚀 Features
🐛 Bug Fixes
🔨 Maintenance
New Contributors
Full Changelog: v4.1.0...v4.2.0
v4.1.0
Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
New in Vanilla v4.1.0
🚀 Features
- Add suru component by @bartaz (#4849)
- Dark tabs by @lyubomir-popov (#4817)
- Add responsive variant of 25/75 grid by @bartaz (#4846)
- Add display headings by @bartaz (#4840)
📝 Documentation
- Remove Vanilla 3 changes from "What's new" page by @bartaz (#4851)
- Add examples of hero sections by @bartaz (#4843)
- Fix license link by @bartaz (#4839)
- Move brochure sites example to separate category by @bartaz (#4836)
- Migration guide updates by @bartaz (#4830)
- Remove outdated info about alpha releases by @bartaz (#4835)
🔨 Maintenance
- Update border and font in chips by @ClementChaumel (#4850)
- Update breadcrumb's bottom margin by @ClementChaumel (#4842)
- Bump stylelint from 14.16.1 to 15.10.1 by @dependabot (#4825)
- Bump semver from 5.7.1 to 5.7.2 by @dependabot (#4827)
- Update dependency @canonical/cookie-policy to v3.5.0 by @renovate (#4829)
Full Changelog: v4.0.0...v4.1.0
v4.0.0
🍦 New in Vanilla 4.0
Vanilla 4.0 introduces elements of new style used for current rebranding of Canonical's brochure websites, including typography changes (utilising new variable Ubuntu font), wider grid width, some updated colours, and updates to any related components.
The most important changes include:
- updated typography of headings
- grid width increased to 80 rem
- some new components that help to build brochure sites in new style (horizontal rule, sections, new shorthand grid variants)
🚀 Migrating to Vanilla 4.0
We treat Vanilla 4.0 as an interim release that includes elements of new branding, but keep the support for old style of components as well to allow for easier and more granular migration on our biggest websites. Therefore, there are no significant breaking changes or removed components.
But because of quite significant visual changes introduced by updated typography and wider grid, it is recommended to properly QA templates and pages, especially if there are any custom styles built on top of Vanilla.
You can check our migration guide for more details.
🔗 Getting Vanilla Framework
Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs
📝 Change log
- Typography changes by @lyubomir-popov @ClementChaumel in #4734
- Align prefix for stepped list @ClementChaumel @bartaz in #4735
- Fix alignment of heading icon @bartaz in #4736
- Update small screens font sizes @lyubomir-popov in #4740
- Revert logo font size to match logo sizing by @bartaz in #4756
- chore(deps): update all non-major dependencies by @renovate in #4754
- Update rule-highlight pattern to use to appropriate class by @petesfrench in #4759
- Paper background by @bartaz in #4763
- Add paper colour variable by @bartaz in #4772
- Implement white strips for paper background by @bartaz in #4773
- Migration docs 4.0 by @bartaz in #4774
- Merged with latest Vanilla 3.15.1
- Update typography docs for Vanilla 4.0 by @bartaz in #4780
- Add utility to limit max width of text lists by @bartaz in #4781
- Update text colour to 000 by @bartaz in #4786
- Add teal accent colour by @bartaz in #4799
- Darker rule component by @bartaz in #4801
- Links on dark by @bartaz in #4805
- Remove rounded corners by @bartaz in #4810
- Ubuntu font 0.869 and old style numerals by @bartaz in #4812
- Update muted heading by @lyubomir-popov in #4807
- Change ticks in lists to grey by @ClementChaumel in #4792
- Use is-dark class name for consistency by @bartaz in #4819
- Make sure logo tag background is not configurable by @bartaz in #4821
- Update section component by @bartaz in #4823
- Merge Vanilla 4.0 feature branch by @bartaz in #4751
Full Changelog: v3.15.1...v4.0.0
v4.0.0-rc.1
💣 Breaking changes in Vanilla 4
This is a release candidate of Vanilla 4.0.0. On top of changes from previous alpha versions it fixes some minor issues and inconsistencies.
Migration guide
We also created a draft version of the migration guide that can be accessed on our demo server.
What's Changed
- Update muted heading by @lyubomir-popov in #4807
- Change ticks in lists to grey by @ClementChaumel in #4792
- Use is-dark class name for consistency by @bartaz in #4819
- Make sure logo tag backround is not configurable by @bartaz in #4821
- Update section component by @bartaz in #4823
Full Changelog: v4.0.0-alpha.3...v4.0.0-rc.1