SWE v4.2.1

Released on 31 May 2023

🔵 Improvements

Checkbox and Radio - Introduced a custom design across our supported browsers for visual consistency

Detail: Both were previously using browser defaults. Applies only to forms using the qg-forms-v2 class.
What was changed: CSS
Documentation: Forms
Internal ticket reference: QOLDEV-62

Before	After

Cards - Clickable - Improve focus and active states #764, #864

Detail: Wrap entire clickable card with updated focus/active outline style and remove from the enclosed 'a' tag.
What was changed: CSS
Documentation: Cards
Internal ticket reference: QOLDEV-226

Before	After

Lists - Reduce spacing above unordered and ordered lists #685, #885

Detail: The current spacing had slightly too much visual separation from the preceding text, which may disrupt the flow and continuity of the content. Request via Editorial Community of Practice.
What was changed: CSS
Documentation: Lists
Internal ticket reference: QOLDEV-55

Before	After

Banner - Increase contrast of blurb background with text #837

Detail: To achieve a better visual contrast and to meet WCAG 2.1 AAA level compliance we've increased the background opacity of the blurb to 0.65 which gives good results across most images. This also applies to the banner found at the top of the aggregation page template.
What was changed: CSS
Documentation: Banner
Internal ticket reference: QOLDEV-164

Before	After

Topic index page and Franchise landing page - Mobile view (767px and below) - Adjustment to hover, focus and active states #725, #884

Detail: Underline and full-width background colour change added to hover, focus and active states, full-width outline applied to focus and active states.
What was changed: CSS
Documentation: Topic index page, Franchise landing page
Internal ticket reference: QOLDEV-206

Before	After

Buttons - Style changes to hover, focus and active states #667, #669, #674, #715, #855, #876, #680, #860, #699, #861, #877

Detail: Underline added to hover, focus and active states and outline added to focus and active states.
What was changed: CSS
Documentation: Buttons
Internal ticket reference: QOLDEV-34, QOLDEV-35, QOLDEV-37

Before	After

Links - Styles updated in the accordion (#763, #770, #785, #788, #808), alert / page alert / global alert (#681, #789), quick exit (#682, #863, #889, #898) and document download (#765) components.

What was changed: CSS
Documentation: Accordion, Alert, Page alert, Global alert, Quick exit, Document download, Links
Internal ticket reference: QOLDEV-45, QOLDEV-46, QOLDEV-222, QOLDEV-223

Links - Catch-all for when links are incorrectly wrapped in 'u' tag #769

Detail: On browsers that support the :has pseudo-selector, use it to transfer the text decoration from the 'u' tag to the enclosed 'a' tag, allowing the underline to use the standard styling rules. On browsers that can't, exclude standard underline styling inside a 'u' tag to prevent a double underline appearing.
What was changed: CSS
Internal ticket reference: QOLDEV-221

Footer - Set paragraph line-height to meet WCAG minimum requirements of at least 1.5 times the font size #840

What was changed: CSS
Internal ticket reference: QOLDEV-307

Print - Underline added, and focus and active styles improved #846

What was changed: CSS
Documentation: Print
Internal ticket reference: QOLDEV-321

Header - Accessibility - Improvements to landmarks #850

Detail: Added role=”banner” to the head tag. Updated aria-label=”main navigation” to aria-label=”main” as screen reader would say 'main navigation navigation'. Added aria-label=”top” to the nav tag. Removed role='navigation' from Skip to main.
What was changed: HTML
Internal ticket reference: QOLDEV-328

🟡 Fixes

Aggregation page template - Fix to banner link focus and active states #674

Detail: Links in top banner were turning black on focus. Now link colour will remain white and new outline style will be applied.
What was changed: CSS
Internal ticket reference: QOLDEV-44

Footer - Applied 'click-to-call' on all phone numbers at all screen sizes #942

Detail: Phone number was only linked on mobile view (767px and below) and coded in a way that repeated the number twice in Google search results, confusing users.
What was changed: HTML, CSS
Internal ticket reference: QOLDEV-408

Footer - Correct hierarchy of headings #878

Detail: Hidden H2 added to provide semantic order of headings in the footer.
What was changed: HTML
Internal ticket reference: QOLDEV-63

Buttons - Fix appearance of blue primary button when used inside forms with class of qg-forms-v2 #701

Detail: Was appearing as secondary (outline) button instead of the default primary button.
What was changed: CSS
Documentation: Buttons
Internal ticket reference: QOLDEV-76

Section navigation - Re-instated grey background on hover, fixed alignment of focus outline, fixed focus styles for current page nav item #846, #827

What was changed: CSS
Documentation: Section navigation
Internal ticket reference: QOLDEV-294

Aside - Minicart - Applied fix to prevent images displaying at 100% width by default #722

What was changed: CSS
Internal ticket reference: QOLDEV-200

Alerts - Style spans with a role of 'link' as links in alert-danger #868

What was changed: CSS
Internal ticket reference: QOLDEV-343

Header - Apply lighter focus state colour to main navigation links #847

Detail: The lighter focus colour of #00B4FF is just over the WCAG contrast ratio requirement of 3:1.
What was changed: CSS
Internal ticket reference: QOLDEV-314

Header - Removed invalid aria-required and added role='combobox' to the search input #835 #879

Detail: The header search form can still be submitted when empty which means aria-required does not apply. Addition of role='combobox' means screen readers will now announce the dropdown that appears when the user interacts with the input box.
What was changed: HTML, scripts
Internal ticket reference: QOLDEV-301

Header - Qld Gov logo - Apply light focus outline colour and fix inconsistent focus outline in Safari and FireFox #854, #871

What was changed: CSS
Internal ticket reference: QOLDEV-331, QOLDEV-322

Thanks to all who contributed to this release.