Added reference color swatches for every shade in the ACSS dashboard (Edit Shades dropdown)
Added HSL reference values for main colors in the ACSS dashboard (Edit Shades dropdown)
Added Hue inputs for all color shades for ultimate fine tuning of shades (Edit Shades dropdown)
Variables for color partials (all colors)
—{color}-hex (references the hex code for the color)
—{color}-hsl(references the hsl value string for the color)
Especially valuable when creating custom transparencies… background-color:hsl(var(—primary-hsl) / .22) = your primary color at 22% opacity.
—{color}-rgb (references the rgb value string for the color)
—{color}-h (references the hue value for the color)
—{color}-s (references the saturation value for the color)
—{color}-l (references the lightness value for the color)
—{color}-r (references the “r” value for the color)
—{color}-g (references the “g” value for the color)
—{color}-b (references the “b” value for the color)
Admin Bar height variable
var(—admin-bar-height) to replace the obnoxious clown show WP default variable that nobody can ever remember: var(--wp-admin--admin-bar--height)
Set text line lengths for every text size.
You can now control the line length for every text size.
Set line height for every text size.
You can now control the default line height for every text size.
Boxed Layout Setting
Under “Viewport” you can now choose to enable a boxed layout for your website.
Website background color is now in this panel (was previously in the typography tab).
Set the website background color and device/browser background color separately.
Set a boxed layout width
Define a box shadow for your boxed layout
Set a top margin for your boxed layout (if you want a more 3 dimensional boxed layout effect)
Define borders for your boxed layout (width, color, style).
Offset Page Content Automatically
New toggle under Additional Styling > Header Styling called “Offset Page Content Automatically.”
Automatically offset your page content when using a sticky or fixed header.
Also offsets the initial “add element” controls in Bricks’ canvas (so you can still interact with them).
.form—light now works to style Bricks’ native search form.
.form—light now works to style Oxygen’s native search form.
New ‘Help Text’ styling in WS Form Integration (Beta)
Pro Mode
Turns off all but the most important framework classes. Retains all variables. Lightens the framework load by around 50%. Designed for advanced users who mostly use custom classes and variables.
When Pro Mode is activated, and unused buttons and colors are turned off, the framework is up to 85% lighter.
Doesn’t remove classes from the auto-suggest / builder database yet. We’re working on a way to do that safely.
Enhancement
Turning off parts of the framework will now only turn off classes associated with that part of the framework. Variables will still work, allowing advanced users to lighten the framework by disabling classes while still using those parts of the framework via variables.
Consolidated “Text Styling” into the main Text panel in Typography
Consolidated “Heading Styling” into the main Headings panel in Typography
Moved “Fix Paragraph & Spacing” option to Options panel
var(—header-height) now auto scales down through all breakpoint values so you don’t have to reference the breakpoint variables in your custom code.
Fix
Fixed issues with var/calc expansion expanding links, aspect ratios, and breaking pseudo element colon spacing in CSS, etc
Fixed an issue with scroll offsets not respecting the breakpoint values
Object fit classes now work when images are wrapped in <figure> tags
Fixed —btn-width missing a unit on the value.
Fixed fatal error when activating the plugin via WP CLI
Bricks Form Integration (Beta)
Fixed Checkbox alignements
Fixed File Upload button style
WS Form Integration (Beta)
Fixed Input border style not working
Fixed wrong Input Phone field padding
Fixed Placeholder text color + text opacity not working
Fixed Range Slider background colors
Fixed Checkboxes + Radios background color
Fixed Radios border color not working
Fixed Submit button border style
Fixed checkbox label color
Fixed Datetime picker gets Action color (not supported in Firefox)
Added var(—paragraph-spacing) and var(—heading-spacing). These reference the paragraph and heading spacing values for users with the “fix paragraph and heading spacing” turned on so they can easily reference these values when writing custom CSS.
Support for overlapping grid rows with .row-start— and .row-end—
12 available rows at each breakpoint.
Added the ability to customize the selection/highlight color for your website (Additional Styles Tab). This is not set by default, so you’ll need to set it in order to see your preferred selection styling.
Background selection color
Text selection color
Alternate selection background color
Alternate text selection color
Alternate colors are activated via .selection—alt class. Useful for sections where the background color is the same as the current selection color.
Enhancements
New Action palette will preload in Bricks.
Required fields in WSForm now inherit the new action color instead of the old primary color.
.h— classes will now inherit heading line height preference from ACSS dashboard.
“Fix paragraphs and headings” now applies to Text and HTML form fields.
Paragraph and heading line lengths in the ACSS dashboard are now set to 100% by default. Users will have to manually change these to a “ch” unit to get the desired effect (highly recommended for best UX & readability).
Fixes
Fixed an issue where ACSS wasn’t recognizing the Lite version of WSForm.
Fixed an issue where .breakout—full could cause some content alignment issues.
Border width inputs now work on Forms.
Border width now affects Signature field.
Custom heading scales now work as expected.
Fixed “click an item to add it to canvas” message in bricks being affected by ACSS’ paragraph max-width setting.
Fixed checkbox labels not responding to option label font-weight changes.
