New in Craft CMS 4.2

New user notifications

The user notifications in the Control Panel have been redesigned. They are now displayed at the bottom left of the browser window and have a clearer and more accessible design.

By default, notifications are displayed for 5 seconds. However, it is now possible to set how long they should be displayed. You can choose between 2 seconds, 5 seconds, 10 seconds, and infinite. The notifications can be removed at any time via a button click. Text is displayed, and additional information, such as a link to the saved element, depending on the context.

Conditional display

It was strange the last weeks that neither the money field introduced in Craft 4 nor the important matrix field had the possibility for conditional display. Since Craft CMS 4.2, referencing money fields and matrix fields in conditions is possible. 

In the Condition Builder, accessibility has also been improved.

Developer Experience

Since Craft CMS 4.0, there was a problem that some templates did not work as desired if the Length filter was used on element queries. 

For example:

    {% if entry.images|length %}
    ...
{% endif %}

Code like this is a bad style but is used in practice. Therefore, support for it has been discontinued.

With Craft CMS 4.2.0, however, element queries can once again be treated as arrays, and consequently, the length filter can be used again as in the example. Additionally, Craft 3.7.50 was released, and the related obsolescence warnings were removed.

Craft for Ukraine

The Craft control panel has been fully translated into Ukrainian with versions 3.7.49 and 4.2.0.

In addition, Pixel & Tonic supports organizations and initiatives that help people in Ukraine with free licenses for Craft Pro. Just fill out the contact form linked here and write details about the organization you want to support and how Craft could help.

Accessibility

There are also some accessibility improvements in Craft 4.2:

• Wrapping of elements in the header element
• Label context menu on edit pages
• ARIA label set on download button to hide additional CSS content
• Set aria-disabled for submit button on BaseElementSelectorModal
• Design icon hidden in front of utilities
• Input fields in modals can be made smaller
• Removed fixed width from selectize and added max-width instead
• Added aria-label to button for new category groups
• Updated all instances of image editor button to use consistent text
• Updated hover/active status for selectize component to improve contrast of secondary text and selectize status display
• Revised the green color of the light button to achieve a 3:1 ratio to the handle color, and also slightly darkened the focus outline

If you want to know all the details, it is best to read the changelog.