Skip to content

2.6.0

Choose a tag to compare

@reatlat reatlat released this 07 Jul 18:08
· 11 commits to main since this release
718180b

Added

  • Per-category hidden flag. Set categories.analytics.hidden: true (or categories.functional, categories.marketing) to remove a consent category from the settings modal. Hidden categories are forced to false (rejected) in the consent state — a visitor can never accept a toggle they cannot see. Essential cannot be hidden; the flag is ignored for it. Also accepted via the data-hide-categories="analytics,marketing" script attribute. Closes #5.

Changed

  • Dynamic button text color via --zest-accent-text. Primary (fill) buttons no longer hardcode #ffffff as their text color. The new --zest-accent-text custom property uses the CSS contrast-color() function (Baseline since April 2026 — Chrome 147+, Safari 26+, Firefox 146+) to let the browser pick black or white text based on the accent color. On older browsers, a JS-computed WCAG luminance fallback ensures readable text everywhere. Light accent colors (yellow, light blue) get dark text automatically; dark accent colors keep white. Override it to force a specific text color.

  • New banner positions: top-left, top-right, center. The position option now accepts seven values. center places the banner dead-center of the viewport (overlay-style, fades in with a subtle scale). top-left / top-right mirror the existing bottom corners. Existing positions are unchanged.

  • Button layout option: row, split, split-modern. New buttonLayout config (default row) controls how buttons are arranged in the banner and modal footer. row is the existing all-in-one-line layout. split puts settings/save on the left and groups accept+reject (primary) on the right. split-modern does the same but makes settings/save the primary button and accept+reject secondary, drawing attention to the preferences action. Also accepted via data-button-layout. New --secondary button class for outlined accent-color buttons.

  • Backdrop blur as pixel value. backdropBlur is now a number in pixels (e.g. 8) instead of a boolean. 0 disables. The pixel value is passed through to backdrop-filter: blur(Npx). Also accepted via data-backdrop-blur="8" (clamped 0-50).

  • Unified --zest-overlay CSS variable. The modal overlay and hard consent wall now share a single --zest-overlay custom property (default rgba(0, 0, 0, 0.5)) for their background color. One variable, one color, everywhere. Override it to match your site's design.

  • Hard consent wall. New hardWall option (default false) renders a full-viewport overlay behind the consent banner that blocks all page interaction until the visitor accepts or rejects. Ensures provable awareness that the visitor saw and decided — useful for compliance-sensitive sites that need 100% decision visibility. Aggressive UX pattern, off by default. The banner becomes aria-modal when the wall is active. Enable via hardWall: true or data-hard-wall="on".

  • reset() now hides the banner before re-showing. Previously reset() could leave a stale banner element in the DOM, causing errors when the wall element was the first child. Fixed.


Bundle sizes (gzip): ~22 KB (all 12 languages) / ~16 KB (single language) / ~14 KB (headless)

All three packages bumped to 2.6.0 (lockstep): @freshjuice/zest, @freshjuice/zest-astro, @freshjuice/zest-eleventy.