v0.3.0

Breaking: the @use path has changed. src/base is gone. Load Sassy from src instead:

// before (0.2.0)
@use "sassy/src/base" as sassy

// now
@use "sassy/src" as sassy

Configuration with with (...) works as before, except that $sassy-debug is gone. It did nothing, so remove it. If you load individual files inside src/base, they have moved to the numbered folders (0-core to 5-theme), for example src/base/_22-display.sass is now src/4-utilities/_430-display.sass.

Added

• Components (src/2-components): buttons (%bf-btn, with colour, outline and size variants), navigation (base, pills, underline and vertical), cards, tabs, tooltips and modal dialogs.
• Collapsible navigation. %bf-nav-toggle is the menu button and %bf-nav-collapse-{breakpoint} is the menu it opens. Below the breakpoint the open menu is a panel over the content that wipes down and up in CSS; from the breakpoint it is an ordinary part of the page. Panel colours, shadow and speed are set with --sassy-nav-collapse-*.
• sassy.js, an optional script for tabs, tooltips (with a positioning fallback where CSS anchor positioning is missing), command / commandfor buttons in older browsers, and collapsible navigation. It finds elements by ARIA role and standard attributes, never by class name.
• Forms (src/1-forms): validation states, input groups, floating labels, range and file inputs, and selects.
• A samples site, published to GitHub Pages, with a page for each layer. Every example shows its Sass, HTML and compiled CSS.
• Worked examples for each layer in docs/, and an "Is it for you?" section in the README.
• The project logo, in logo/ (light and dark, SVG and PNG).
• A Check workflow that compiles Sassy, checks that the CSS shown in the README and docs is what Sassy outputs, and builds the samples site.

Changed

• Modal dialogs stop the page behind them scrolling, and opening one no longer scrolls the page to the top.
• Breaking: colour custom properties take any CSS colour (hex, rgb(), oklch(), a named colour or another custom property) instead of space-separated R G B values, and sassy.colour() returns an oklch() colour. A value such as --sassy-theme-primary: 13 148 136 must become rgb(13 148 136) or #0d9488.
• The colour palette is updated to Tailwind 4.3, in oklch(), so shade values differ. It adds the neutrals mauve, olive, mist and taupe, and shade 950. Sassy now needs Dart Sass 1.79 or later.
• The source is reorganised into numbered folders (0-core to 5-theme) and files (_NNN-name). The numbers are the output order.
• Components are rendered after forms, with buttons first among them.
• The Check and Pages workflows use the native Dart Sass release, which is faster than the npm package.

Removed

• Coloured shadow placeholders: %bf-shadow-{colour}-{shade}-{0-3} and %bf-shadow-{theme}-{0-3}. Use %bf-shadow-{0-3} and set --sassy-shadow-colour for a site, a section or one element, for example --sassy-shadow-colour: var(--sassy-theme-primary).
• src/base, replaced by src and its numbered folders. See the note at the top of this release for the new @use path.

v0.2.0

What's Changed

• Cascade fixes by @bfren in #1
• Adding additional utility classes by @bfren in #2
• Adding initial form classes to base src by @bfren in #3
• Prefix fix by @bfren in #4
• Sassy variables by @bfren in #5

Full Changelog: https://github.com/bfren/sassy/commits/v0.2.0

v0.1.0

Initial Release

Full Changelog: https://github.com/bfren/sassy/commits/v0.1.0