v3.0.1

New in Vanilla v3.0.1

This is a small bug-fix release to solve an issue with misaligned chips in search and filter component introduced in 3.0.0.

But we also started writing some accessibility docs for our components in the meantime.

🐛 Bug Fixes

• Fix spacing issues with chips in search and filter (#4246)

📝 Documentation

• Add tooltip accessibility doc (#4241)
• Add accessibility card text (#4237)
• Add search box accessibility doc (#4239)
• Add link accessibility doc (#4235)
• Add lists accessibility doc (#4234)
• Add accessibility accordion notes (#4233)

Getting Vanilla Framework

Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs

v3.0.0

New in Vanilla v3.0.0

We’ve just released Vanilla v3.0 - a new major update to our CSS framework. It includes a few significant updates and improvements around spacing variables, responsive breakpoints, a new expanding search box and various updates to existing components. Important aspects of the release include dropping a noticeable chunk of deprecated styles and components and removing IE support.

🚀 Features

Media query breakpoint updates

• Update default value of navigation breakpoint (#4111)
• Clean up media query breakpoints in components (#4107)
• Remove medium breakpoint (#4105)
• Clean-up breakpoints in utilities (#4096)
• Update 12 col breakpoint from medium to large (#4078)

Colored chips and labels

• Chips (#4124)
• Add interactive chips (#4169)
• Add theming for chips (#4168)
• Make dismiss in chips round (#4191)
• Inline labels (#4110)
• Update the docs and examples for chips (#4188)
• Bring back labels component (#4184)
• Remove label component (#4154)

New expanding search

• Update navigation search (#4003)
• Update search in navigation to expanding search (#4228)

Use sass builder

• Fix sass deprecation warning (#4208)
• Switch to dart-sass (#3919)
• Add index file to allow importing from package directly (#4093)

Spacing variables refactor

• Spacing refactor rebased on the 3.0 feature branch (#3971)
• Variable mappings (#4106)
• Improve consistency of variable map keys (#4116)
• Refactor margin/gutter scss maps (#4176)

Removed components and styles

• Update switch component to use more reliable HTML (#4117)
• Remove remaining deprecated docs (#4101)
• Remove deprecated inline image pattern (#4099)
• Remove 100% width from buttons on small screens (#4097)
• Remove unused pagination link (#4094)
• Remove $color-navigation-background (#4086)
• Remove checkbox & radio base styles (#4072)
• Remove p-link--external (#4069)
• Remove IE fallback grid (#4030)
• Fix rebase problems, remove old variables (#4005)
• Remove IE support (#4004)
• Remove deprecated icon styles (#3960)
• Remove deprecated typography styles (#3956)
• Remove deprecated navigation styles (#3947)
• Remove deprecated styles for headings, buttons and grid (#3943)
• Remove some of the deprecated patterns (#3934)

🐛 Bug Fixes

• Wrap font-face definitions in @at-root (#4190)
• Fix misused aria-label on mobile card table (#4179)
• Remove unnecessary margin reset (#4177)

📝 Documentation

Migration guide

• Reorder migration guide (#4218)
• Upgrade warnings (#4215)
• Make the naming of tables and class names more consistent (#4210)
• Improve clarity of variables section of upgrade guide (#4209)
• Change order of variable names (#4204)
• Add breadcrumbs to upgrade guide (#4203)
• Add search box description to upgrade guide (#4201)
• Add new Accordion section to upgrade guide (#4199)
• Add code pattern changes to upgrade guide (#4198)
• Add p-notification__action class info to upgrade guide (#4200)
• Add contextual menu icon update to upgrade guide (#4196)
• Reword text-max-width section of upgrade guide (#4197)
• Initial improvements to upgrade guide (#4119)
• Upgrade guide (#4113)

Other docs and website updates

• Improve the docs around breakpoints (#4207)
• Add updated labels to side navigation (#4221)
• Update README on vanilla website (#4223)
• Update what's new page (#4219)
• Update homepage (#4216)
• Update current team members (#4120)
• Add aria-describedby to fields with help or validation messages (#4135)
• Add forms input a11y docs (#4125)
• Document vertical spacing utilities (#4092)

🔨 Maintenance

• Bump version to 3.0.0 (#4231)
• Add missing import sections (#4185)
• Update run script to use essential build (#4149)
• Update watch:scss:skip-standalone (#3986)

Dependencies

• Update dependency canonicalwebteam.flask-base to v0.9.3 (#4230)
• Update all non-major dependencies (#4224)
• Add image module and update images (#4212)
• Remove specific node versions from package.json (#4202)
• Update dependency @canonical/latest-news to v1.3.0 (#4180)
• Update dependency postcss-cli to v9 (#4024)
• Attempt to force node LTS version in renovate (#4181)
• Update internal dependencies at any time (#4178)
• Update all non-major dependencies (#4165)
• Prevent renovate from upgrading python in CircleCi image (#4173)
• Pin dependencies (#4164)
• Update stylelint to v14 (#4142)
• Use official image for CircleCi with Python and node (#4143)

Getting Vanilla Framework

Install with NPM: https://www.npmjs.com/package/vanilla-framework
Visit the documentation at https://vanillaframework.io/docs

v3.0.0-rc.1

New in Vanilla v3.0.0-rc.1

This is a Release Candidate 1 for Vanilla 3.0. It contains updates to chips and label components along some other small bugfixes and dependency updates.

🚀 Features

• Add interactive chips (#4169)
• Add theming for chips (#4168)
• Make dismiss in chips round (#4191)
• Update the docs and examples for chips (#4188)
• Bring back labels component (#4184)
• Remove label component (#4154)

🐛 Bug Fixes

• Wrap font-face definitions in @at-root (#4190)
• Fix misused aria-label on mobile card table (#4179)
• Remove unnecessary margin reset (#4177)

🔨 Maintenance

• Bump version to 3.0 release candidate (#4192)
• Add missing import sections (#4185)
• Update dependency @canonical/latest-news to v1.3.0 (#4180)
• Update dependency postcss-cli to v9 (#4024)
• Attempt to force node LTS version in renovate (#4181)
• Update internal dependencies at any time (#4178)
• Refactor margin/gutter scss maps (#4176)
• Update all non-major dependencies (#4165)
• Prevent renovate from upgrading python in CircleCi image (#4173)
• Pin dependencies (#4164)
• Update run script to use essential build (#4149)
• Update stylelint to v14 (#4142)
• Use official image for CircleCi with Python and node (#4143)

v2.37.1

This is a maintenance release, it doesn't change anything in SCSS code. Changes are mostly around dependencies.
Most notably we moved all dependencies to devDependencies to avoid installing them in projects using Vanilla.
It removes node-sass which was causing issues on Macs with M1 chips.

💣 Potentially breaking changes

There have been reports of builds failing after this update due to error with missing postcss. Vanilla used to install node-sass and postcss as its dependencies. We don't do it anymore since this version. If your project uses postcss or node-sass for building, you need to make sure you have any required dependencies in your package.json. Also in some of our projects we only install production dependencies in Dockerfile (not devDependencies), so you need to make sure that any build tools are included in dependencies rather than devDependencies

Changes

• Move all dependencies to devDependencies
• Update all non-major dependencies (#4108 )
• Update GH action workflow to publish prereleases
• Add breadcrumb accessibility docs (#4088)
• Rename default branch to main
• Update renovate config to group dependency updates
• Add redirects for class name docs (#4014)

Dependency updates

• Update dependency postcss to v8.3.9
• Update dependency canonicalwebteam.flask-base to v0.9.1
• Update dependency autoprefixer to v10.3.7
• Update dependency svgo to v2.7.0
• Update build-tools orb to v3
• Update dependency postcss to v8.3.9

v3.0.0-beta.2

New in Vanilla v3.0.0-beta.2

• Update current team members (#4120)
• Improve consistency of variable map keys (#4116)
• Upgrade guide (#4113)

🚀 Features

• Chips (#4124)
• Update switch component to use more reliable HTML (#4117)

📝 Documentation

• Chips (#4124)
• Add aria-describedby to fields with help or validation messages (#4135)
• Add forms input a11y docs (#4125)

🔨 Maintenance

• Update version to 3.0.0-beta.2 (#4141)

v3.0.0-beta.1 (prerelease)

This is a Vanilla 3.0 beta pre-release after merging vanilla-3.0 branch to main.

v3.0.0-alpha.2 (prerelease)

This prerelease of Vanilla 3.0 includes the styles index file (to allow @import "vanilla-framework") and fixes issues with @use "sass:math"

v3.0.0-alpha.1 (prerelease)

This is an early preview of 3.0 release.

v2.37.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 v2.37.0

🚀 Features

• Add datalist to examples (#3984)

🐛 Bug Fixes

• Circle CI config fix (#4015)
• Make header fixed in modal (#3983)
• Truncates modal to fit content and centers (#3982)

📝 Documentation

• Add redirects for class name docs (#4014)
• Update modal accessibility docs (#3998)

🔨 Maintenance

• Update dependency autoprefixer to v10.3.7 (#3999)
• Update dependency svgo to v2.7.0 (#4009)
• Update build-tools orb to v3 (#4010)
• Update dependency postcss to v8.3.8 (#4000)
• Bump nth-check from 2.0.0 to 2.0.1 (#3993)
• Update all non-major dependencies (#3987)

v2.36.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 v2.36.0

🚀 Features

• Align help text and labels for tick elements (#3965)
• Added accordion variant to align with checkboxes (#3963)
• Move card padding to p-card__inner (#3953)

🐛 Bug Fixes

• Add hover state for uncollpased accordion button (#3973)

🔨 Maintenance

• Update dependency autoprefixer to v10.3.4 (#3969)