CDN links and release log

Keep updated with our Framework updates atom feed.

If you do not have access to the sketch assets and require it please contact Tom Smith or Shivalee Vichhi directly or by using the contact form.

Patch release v.4.16.2

Fixed

  • Issue with styling on pagination component when combined with Coveo.
  • Global nav updated so that instances of country selector do not open with content missing.
  • Issue where components within show more area were not being refreshed on being shown causing drawing errors.
  • Issue where pre-selected tab displayed incorrect content on page load.

No code changes required to components

This is an patch release for v.4.16.1; fixing issues found in the Framework. There are no code changes required to components to upgrade to this release from v.4.16.1.

CDN folder path //cdn.aviva.com/static/core/v.4.16.2/

Previous releases

Patch release v.4.16.1

Fixed

  • Issue where megamenu would not close for internal links.
  • Issue where focus was not being transferred from the masthead to the search box reliably.
  • Contextual help icon did not have a focus state and aria was not being correctly applied.
  • Content below more than one tab within the country selector could be displayed if tabs were rapidly clicked.
  • Issue where preselected tabs were causing the page to scroll on initial page load.
  • Issue where show more link was not shown and the content was truncated when there were multiple paragraphs but the total text length of all the paragraphs was below the text limit.
  • Issue where scrolling is disabled after the modal window has been closed or did not open due to an error.
  • Issue where selected indicator dot on segmented control was pushing text over to the left slightly and could cause odd wrapping when space it tight.

No code changes required to components

This is an patch release for v.4.16.0; fixing issues found in the Framework. There are no code changes required to components to upgrade to this release from v.4.16.0.

CDN folder path //cdn.aviva.com/static/core/v.4.16.1/

Release v.4.16.0

Download v.4.16.0 Sketch assets

Added

  • Sticky CTA bar for placement below in-page navigtation to encourage users through to quote. See sticky CTA bar (v4) for reference.
  • New variant for in-page navigation that allows its use without any icons. See in-page navigation (v4) for reference.

Updated

  • Close icon on notification cards now has a blue underline when in focus to aid accessibility. See global notifications (v4) for reference.
  • Following WCAG 2.5.5 guidelines the primary tabs, section tabs and stand alone checkbox have an increased target size to improve accessibility on touch devices. See primary tabs (v4), section tabs (v4) and checkbox (v4) for reference.
  • Adjustments made to improve screen reader accessibility. Ability to adjust volume using up and down arrows when the video has focus. Volume and mute changes are visually shown over the video. See audio (v4) and video (v4) for reference.
  • Following WCAG 2.5.5 guidelines the linear and non-linear navigation has an increased target size using tertiary buttons to improve accessibility on touch devices. See non-linear navigation (v4) and linear navigation (v4) for reference. The old mark up will continue to be supported for the remainder of Framework version 4.x.x.
  • Following WCAG 2.1 criterion 1.4.3: Contrast (Minimum), font size increases have been made to the following components so that all large-scale text has a contrast ratio of at least 3:1.

  • Following WCAG 2.1 criterion 1.4.1: Use of color, a dot has been added after the text to increase the visual difference between the selected and non-selected state. The padding for each option has also been adjusted slightly to allow for this additional visual indicator. See segmented controls (v4) for reference.
  • Markup changes are aviailable for pagination to improve its accessibility. Support for the current page remaining a link has also been added. The old mark up will continue to be supported for the remainder of Framework version 4.x.x. See pagination (v4) for reference.
  • Small margin added around the standard modal on small screens and the full screen modal at all breakpoints to emphasise the use of a modal and not to confuse with a redirection to another page. See modal (v4) and full screen modal (v4) for reference.

Fixed

  • Issue with card carousel which was preventing wallet add/edit from working correctly.
  • Race condition where animation may not be turned off before component JavaScript runs. This is now run before the initial module scan.
  • Show more component aria not being correctly updated on state change and incorrect spacing when the intro paragraph is shorter than the cut off.
  • Correct line height for the opening times link so that it has the minimum target size.
  • Correct the font size for checkbox multiselect and filter tag options so that they are both 16px.
  • Issue with filter tags not being selectable at mobile.
  • Correction to aria placement and use on predictive search

No code changes required to components

This is an update release to v.4.15.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.15.0.

CDN folder path //cdn.aviva.com/static/core/v.4.16.0/

Release v.4.15.0

Download v.4.15.0 Sketch assets

Added

  • Following WCAG 2.4.4: Link Purpose (In Context) guidelines, show more links now have an additional data field available for use where a descriptive link is required, for example where there is very little text or an object/image/chart/table or list begins the content so there is nothing to interpret the purpose of the link. See show more (v4) for reference.
  • A new form row group has been added to allow pairs of linked form elements to sit side by side within forms. See form row group (v4) for reference.

Updated

  • jQuery dependency removed from masthead (v4). The functionality and markup of the connected components has not been affected.
  • Increase link target size on the mega menu, the country selector and site switcher to improve cross device usability. See masthead (v4) for reference.
  • Increase link target size on the modal close link to improve cross device usability. See modal (v4) and full screen modal (v4) for reference.
  • Wayfinder links now have a minimum width of 44px to improve cross device usability. See wayfinder (v4) for reference.
  • New modifier class added to data replay to over-ride default data column widths and stack data at tablet and mobile. See data replay (v4) for reference.
  • Recommended addition of an aria label on the country selector link within the masthead to aid understanding of where the link is going. See masthead (v4) for reference.
  • Increase link target size on the show more/show less and read more links to improve cross device usability. See frequently asked questions panel (v4), Frequently asked questions panel - right hand side variant (v4) and Help utility section (v4) for reference.
  • On tab selection focus is now tranferred directly to the content the tab is associated with to aid accessibility.

Fixed

  • Contextual help wrapping text onto another line when not required in Chrome.
  • Show more link not always being shown when there is no introductory paragraph to cut down.

Deprecated

  • Portal extension that includes the customer portal product roundels and headers has now been deprecated.
  • Results filter has been deprecated and replaced by the filter tags / results display (v4).

No code changes required to components

This is an update release to v.4.14.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.14.0.

CDN folder path //cdn.aviva.com/static/core/v.4.15.0/

Patch release v.4.14.1

Fixed

  • Issue where the background colour behind the section titles on the megamenu at desktop and tablet were picking up the hover and focus background colours from the mobile view.
  • JavaScript error occuring in IE11 on the search menu being opened more than once consecutively.

No code changes required to components

This is an patch release for v.4.14.0; fixing issues found in the Framework. There are no code changes required to components to upgrade to this release from v.4.14.0.

CDN folder path //cdn.aviva.com/static/core/v.4.14.1/

Release v.4.14.0

Download v.4.14.0 Sketch assets

Added

  • Shallow tertiary button variant added to be used with lists of links to avoid excessive white space and physical length of each list. See button (v4) for reference.
  • Shallow tertiary button list variant added to be used with lists of links to provide a larger than standard hit target but avoid excessive white space and physical length of each list. See lists (v4) for reference.
  • New form affix used as a prompt for user authentication when inputting incomplete policy numbers, values or sensitive data. Adds context for what information is required to be entered. See form affix (v4) for reference.

Updated

  • Video and audio now display a loading indicator while the media is loading/buffering. See audio (v4) and video (v4) for reference.
  • jQuery dependency removed from checkbox multiselect (v4) and segmented controls (v4). The functionality and markup of the connected components has not been affected.
  • Update to how JavaScript components calculate the current breakpoint to improve overall page performance. Change has meant that a function that would take around 35ms to run now take 0.25ms to run.
  • All SVGs have been re-optimised to ensure they are as small as possible.
  • Following WCAG2.1 criterion 1.4.12: Text Spacing, mark up changes are available to the single segmented doughnut chart to correctly space text should a user stylesheet over-ride be applied. The old mark up will continue to be supported for the remainder of Framework version 4.x.x. See doughnut charts (v4) for reference.
  • Additional checks added to prevent JavaScript errors from data-module attributes being left blank.
  • Slider and slider range updated to support and use the new form affix component. See slider (v4) and slider range (v4) for reference.
  • Following WCAG 2.1 guidelines, semantic headings have been added to the footer and to groups of links within the footer. Previously groups of links within the footer were headed by wording within a paragraph which will continue to be supported for the remainder of Framework version 4.x.x. See footer (v4) for reference.
  • Following WCAG 2.1 guidelines, mark up changes are available for form fields with multiple label elements. Multiple label elements are not widely supported in assistive technologies. The old mark up will continue to be supported for the remainder of Framework version 4.x.x. See the following pages for reference:

  • Following WCAG 2.1 guidelines, mark up changes are available to the Wayfinder to ensure the chevron separator is hidden from assistive technologies using aria-hidden="true". The old mark up will continue to be supported for the remainder of Framework version 4.x.x. See Wayfinder (v4) for reference.
  • Removed Adobe analytics tracking code from the audio and video player to prevent JavaScript errors occuring when the Media module is not present.
  • SVG placeholder images have been added for use to improve page performance via lower file sizes. See lazy loading (v4) for references.

Fixed

  • Issue where IE9 was getting the styled media player controls that would not have worked correctly, rather than using the native player.
  • Focus not being transferred to relevant section on in-page navigation link selection.

Deprecated

  • Textbox with symbol or acronym is now deprecated and replaced with form affix (v4).

No code changes required to components

This is an update release to v.4.13.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.13.0.

CDN folder path //cdn.aviva.com/static/core/v.4.14.0/

Release v.4.13.0

Download v.4.13.0 Sketch assets

Added

  • New global option added to the country selection pages and country selector on the masthead/main navigation with optional domain language indicators. See country selection (v4) and masthead (v4) for reference.

Updated

  • Removal of PNG single segment chart image fallbacks and replaced with SVG version to improve page performance. See doughnut chart (v4) for reference.
  • Ability to automatically set the maximum end date on selection of the start date to X day, X months or X years after the start date was added to the date range. See date range (v4) for reference.
  • Segmented radio controls can again be used for 2-5 options for short character length selectable Boolean content. See segmented controls (v4) for reference.
  • Contextual help when used for form explanatory text can now have customisabled accessibile text included. See contextual help (v4) for reference.
  • Styling for the slider and slider range form fields has been updated significantly to improve usability of the component by display the text or dropdown inputs along side the slider allowing easier entry for all users. Two new variants have also been added for where vertical space is a particular premium. See slider (v4) and slider range (v4) for reference.
  • jQuery dependency removed from slider (v4), slider range (v4), audio (v4) and video (v4). The functionality and markup of the connected components has not been affected.
  • Country selector and masthead updated to follow new design spacing.

No code changes required to components

This is an update release to v.4.12.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.12.0.

CDN folder path //cdn.aviva.com/static/core/v.4.13.0/

Release v.4.12.0

Download v.4.12.0 Sketch assets

Added

  • Full width promo cards with full bleed images available to highlight promotional offers. See promo cards with imagery (v4) for reference.
  • Timeline to provide customers with a view of the overall process for claim resolution and clarity on where their claim sits within this process. See timeline (v4) for reference.
  • Optional 'now playing' video card variant for use within a card block that has been included with the video component. See video (v4) for reference.

Updated

  • Tertiary cards can now be used on a lightest grey (#F9F9F9) as well as white (#FFF) backgrounds. See tertiary card (v4) for reference.
  • Locale settings loading method has been adjusted to ensure that they are loaded before any JavaScript modules run. See locale settings (v4) guide for updated implementation guide.
  • CORS support added to Framework files being included using RequireJS. All files now have a crossorigin attribute set to enable proper error reporting. The crossorigin attribute is also included in the base template to ensure all framework script files have it. See the base template (v4) and CORS on RequireJS modules guide (v4) for reference
  • With how to generate lighter and darker shades of accent colours being documented and 25% lighter and darker shades of all accent colours being generated for use in designs all colour tints (lighter or darker of original accent colours) have been updated to match the colours generated using the new method. The majority of colours there is negligible difference to the eye, but the darker shades of light accent colours in particular are now no longer muddy in appearance. See colour style guide (v4) for reference.
  • Improved screen reader support with the new date and date range components.
  • Check added to prevent RequireJS attempting to load a JavaScript file when the data-module attribute is left blank.
  • Ability to override default locale settings on the checkbox multiselect component so alternative text can be used on individual checkbox multiselects within a single page. See checkbox multiselect (v4) for reference.
  • Removal of PNG image fallbacks to improve page performance.

Fixed

  • Issue with show more where if text was shorter than the limit the show more/less link would still display.
  • Fix for error occurring within the date range component in IE11.
  • Major adjustments to how auto-formatting of text inputs is achieved. Formatting is now delayed for a time after typing has ceased as well as input blur to help prevent the characters getting input in the wrong order when users type quickly. Date, Date range, Credit card input within wallet and memorable date input have all been adjusted.
  • Object-fit code not correctly setting the minimum height on the images to maintain aspect ratio.
  • Use of flexbox causing country selector to display incorrectly when site switcher was not present.
  • Modal failing to load content in when no id was provided for selecting an element from within the target page. The body of the page being loaded in will now be placed within the modal if no/invalid element selection is made.
  • Fix for flexbox issue with the story deck in Chrome 75+, where the images were becoming overly tall.
  • Fix for non-JS display of doughnut and pie charts where the fallback image and and text displayed within the doughnut was not displayed.
  • Fix for IE11 preventing click through on inline images when placed inside form labels.
  • Progressive disclosure will now maintain row/additional content area opacity (eg. disabled form row) when fading in as part of a disclosure area. Previously all rows/additional content areas would be made fully opaque when revealed.

No code changes required to components

This is an update release to v.4.11.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.11.0.

CDN folder path //cdn.aviva.com/static/core/v.4.12.0/

Release v.4.11.0

Download v.4.11.0 Sketch assets

Added

  • New assumptions organism to help alert customers to the key assumptions used in generating their quote so that they understand what the policy parameters are and have the option to accept or reject these assumptions. See form assumptions (v4) for reference.
  • New horizontal value bar organism added as a simple visual indicator to depict quantities of an amount or attribute remaining. Enables recognition of any limits in place and amounts remaining. Basic, Complex and Comprehensive lockups to maximise impact and flexibility. See horizontal value bar (v4) for reference.

Updated

  • Include ability to hide the header close button and disable close when the user clicks/taps outside of a modal to allow for scenarios where the user is required to make a choice before proceeding. See modal (v4) for reference.
  • Ability to change the name of the cookie dropped by the cookie policy (v4) component and consiquenally the name of the cookie picked up by the accessibility settings (v4) component. See cookie policy (v4) for reference.
  • Documentation included for a number of components showing how to ensure link text is fully accessible, and WCAG 2.5.3 compliant, by visually hiding supporting text after the visual text.
  • jQuery dependency removed from doughnut chart (v4) and pie chart (v4). The functionality and markup of the connected components has not been affected.
  • Character default and hardstop limits used for the show more component have been increased to reduce the loss of meaning of the truncated text when used within different locations. See show more (v4) for reference.

Fixed

  • Prevent users from being able to tab around the page behind a modal that has close disabled if the user clicks/taps outside of the modal.
  • Prevent Modernizr being loading a second time by requireJS when a component has it as a dependancy.
  • Fix colours on the transparent button when used on a teal background.
  • Accessibility improvements for the latest date and date range fields when using a keyboard.
  • Ensure the change event is fired when the date fields are updated post selection from the date picker when using the new date and date range components.
  • Dougnut chart updated to ensure that the chart maintains a square ratio with no cropping, and that they display consistently when initially hidden within show/hides, FAQ panels, tabs and so on.
  • FAQ Panel: Narrow variant chevron now animates correctly, and standard variant now uses standard show more component within it rather than a specific customised version.
  • Contextual help with hidden text icon now reliably displays within the containing area.

No code changes required to components

This is an update release to v.4.10.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.10.0.

CDN folder path //cdn.aviva.com/static/core/v.4.11.0/

Release v.4.10.0

Download v.4.10.0 Sketch assets

Added

  • New utility class to prevent wrapping of text that contains spaces. See utility classes (v4) for reference.
  • New section feature banners can be used to signpost key content and act as a visual device to add variation to a page layout. See section feature banner (v4) for reference.
  • New columns with dividers provide the option to separate the columns of content with dividing lines. These can also be used within tertiary cards. See columns with dividers (v4) for reference.

Updated

  • The cookie policy message styling has been updated to reflect styling changes made to the Aviva.com cookie policy. The ability to fix the cookie policy message to the bottom of the viewport has also added to increase the prominance of the cookie message. A hidden heading for the cookie policy should now also be included to improve accessiblity by providing better context for the message and also to make it more discoverable by screen reader users. See cookie policy (v4) for reference.
  • jQuery dependency removed from scrollable comparison table (v4). The functionality and markup of the connected components has not been affected.
  • Pictorial checkboxes and radios buttons can now only be displayed in 2 columns at desktop to prevent issues with text overflowing due to lack of space.
  • Hyperlinks are no longer for use in heading 0 and heading 1. See headings (v4) for reference.
  • Hyperlinks when used in headings, on dark accents, now match our standard text hyperlink pattern on dark accents with a dotted underline which appears solid on hover/focus. See headings (v4) for reference.

Fixed

  • Issue with contextual help where large amounts of copy were not being placed within a modal, when used within a form.

No code changes required to components

This is an update release to v.4.9.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.9.0.

CDN folder path //cdn.aviva.com/static/core/v.4.10.0/

Release v.4.9.0

Download v.4.9.0 Sketch assets

Added

Updated

Deprecated

  • Date and date range fields using the native date field should no longer be used. These have been replaced by new date and date range components that use plain text fields and offer JavaScript powered date selection for all browser/device users. This is to solve issues users were having using the native date pickers, causing increased error rates within form journeys.

Fixed

  • Correct issues with using tables on different accent colours and the stackable by column table incorrectly placing content under the wrong table heading at mobile.
  • Predictive search adjusted to further improve accessaiblity by the use of additional aria and roles.
  • Prevent multiple mega menu content being displayed due to rapid activation of masthead links.
  • Prevent content being lost due to rapid activation of a modal window links.
  • Prevent a visual only element being read out by screen-readers on the segmented controls.
  • Support of u-margin--none ensuring that when used the margins are negated correctly for the element.
  • Scroll show/hide content back into view if show/hide is behaving as an accordian and closing another section causes the section being opened to scroll off the top of the screen.
  • Window no longer gets scrolled back to the top of the page when modal window is opened.
  • Links that open modal windows that contain additional markup ie. Tertiary buttons can now be accessed using a mouse over any part of the link.
  • Aria correctly applied to the linear navigation code at all screen sizes.
  • Correct spacing below button groups when used within the primary tab heading area.
  • Correct issues with the filter tags / results display component when switching between breakpoints, missing aria, missing hover/focus states on elements when the filter options were placed in a modal window.

No code changes required to components

This is an update release to v.4.8.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.8.0.

CDN folder path //cdn.aviva.com/static/core/v.4.9.0/

Release v.4.8.0

Download v.4.8.0 Sketch assets

Added

Updated

  • Masthead logged in menu now supports the addition of a last logged in date and time. See masthead (v4) for reference.
  • Added enhanced support for screenreaders when using the textarea with character count. The character limit will now be announced on focus and an announcement will also be made when the character limit is reached. See textarea (v4) for reference.
  • Aria alert for assistive technologies added to cookie policy JavaScript to highlight the cookie settings have been saved on closure of the cookie policy message. See cookie policy (v4) for reference.
  • Styling of the progress bar has been adjusted so that if being used within a single page application, when the step is updated the bar will transition nicely to the next step. See progress bar (v4) for reference.
  • Notification card styles Updated. See global notifications (v4) for reference.

Fixed

  • Spacing within button groups

No code changes required to components

This is an update release to v.4.7.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.7.0.

CDN folder path //cdn.aviva.com/static/core/v.4.8.0/

Release v.4.7.0

Download v.4.7.0 Sketch assets

Added

  • Ability for user with vistibular disorders to turn all animations/motion off across an entire site. The ability to disable all motion is a requirement for WCAG 2.3.3. See accessibility settings (v4) for reference.
  • Textual links in the footer. See footer (v4) for reference.
  • Pie charts have been included into the Framework. See pie chart (v4) for reference.
  • Filter tags and results display toggles have been added to offer the option to filter search results based on checkbox multiselect set. The results can then be displayed in groups of defined sizes, which can then be toggled between list and grid view. Filter tags and results display are documented together, but can be used independently of each other. Additional button styles for the filters, view-list and view-grid have been added to supplement this organism. See filter tags / results display (v4) for reference.

Updated

Fixed

  • Fix for display error with the multiselect element after options at the bottom of a long list have been selected.
  • Fix for incorrect aria tags used in country selection.

No code changes required to components

This is an update release to v.4.6.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.6.0.

CDN folder path //cdn.aviva.com/static/core/v.4.7.0/

Release v.4.6.0

Download v.4.6.0 Sketch assets

Added

  • Shallow hero banner to provide a condensed version of the hero banner that can be used with or without a background image. See shallow hero banner (v4) for reference.
  • New contextual help component to display tooltips or modals with additional supporting information. See contextual help (v4) for reference.
  • Stackable tables by row or column at mobile. See tables (v4) for reference.
  • Stored cards allows users to view their payment cards via wallet on Aviva websites. See wallet - stored cards (v4) for reference.
  • Add / edit / remove card features allow users to add, edit and remove their payment cards via wallet on Aviva websites. See wallet - add card (v4), wallet - edit card (v4) and wallet - remove card (v4) for reference.
  • Pictorial checkboxes are now available as a checkbox variant. See checkbox (v4) for reference.
  • Simple yes/no toggle switch based on checkboxes. See checkbox toggle (v4) for reference.
  • Highcharts and Highstock 7.0.2 is now available for use. See core JavaScript files (v4) for reference.
  • Radio singlecard select - New select cards have images at the bottom with the label at the top. Images are not shown in mobile, when there are more than 4 cards in tablet view and when there are more than 6 in desktop view. These have replaced the segmented controls in Wallet. See radio singlecard select (v4) for reference. See wallet (v4) to see it implemented in a wallet.

Updated

  • Selection of payment types in wallet can now be made via pictorial radio buttons rather than segemnted controls. See wallet (v4) for reference.
  • Call us panel can now include contact address, email and generic text. See call us panel (v4) for reference.
  • Styling of the comparison tables has been updated to align with the latest styling used with the stackable tables now available. See tables (v4) for reference.
  • Font size of text within checkboxes has been increased from 16px to 18px to improve accessibility. See checkbox (v4) for reference.
  • JavaScript styled scrollbars have now been removed from Framework components and replaced with CSS-styled native scrollbars. This has been done to fix the many issues that have been seen with the JavaScript scrollbars, including showing a scrollbar when one wasn't required, showing two scrollbars (native and JavaScript) and more. Please note that the CSS styling currently only apears in Safari and Chrome, so will fall back to the default browser styling elsewhere.
  • Primary tabs are now no longer limited to only containing the wayfinder and an H1 within the shaded area. They are now able to have the addtion of an H2 or H3, group of CTAs, a short bit of copy and a notification card. See primary tabs (v4) for reference.
  • New update settings method for the date input and date range fields has been added to remove the requirement for jQuery. Old method has been deprecated. See date input (v4) and date range (v4) for reference.
  • Old (deprecated) contextual help component renamed as 'blue help bar' to avoid confusion with new contextual help component. See blue help bar (v4) for reference.
  • jQuery dependency removed from date input (v4), file upload (v4), plus/minus number textbox (v4), credit card input (v4), notification cards (v4) and cookie policy (v4). The functionality and markup of the connected components has not been affected.

Fixed

  • Font size inconsistencies between the radio and checkbox cards. Styles now aligned.
  • Issues in older browsers with using date and date range with some locales (Polish being one).
  • FAQ panels not sized correctly when placed within sections that are not visible on initial page load ie. within a tab.
  • Accessibility issues with the frequently asked questions panel - right hand side variant have been addressed with heading for each faq item and appropriate aria being added.
  • Adjustments to a number of components that would update the url to aid in maintaining state post page refresh. These will now only do so if there is either no fragments or the fragment does not contain any special characters. This should help with compatability with some application that use the fragement to maintain state.
  • Adjustment to non-linear navigation css to prevent Chrome drawing bug where the underline was not always visible for links on the bottom row of the component. Fix also applied for displaying the arrow on dark accent colours.

No code changes required to components

This is an update release to v.4.5.2; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.5.2.

There have been style changes to the tables and we would recommend extra care is taken when upgrading to this release to check the display of any tables that you have within your pages, especially if any components have been built based on the tables.

CDN folder path //cdn.aviva.com/static/core/v.4.6.0/

Patch release v.4.5.2

Fixed

  • Fix for browser performance issues found when using lazy loading on large pages, causing slow image replacement, slow scrolling, page not redrawing (going white).

No code changes required to components

This is an patch release for v.4.5.0; fixing issues found in the Framework. There are no code changes required to components to upgrade to this release from v.4.5.1.

CDN folder path //cdn.aviva.com/static/core/v.4.5.2/

Patch release v.4.5.1

Fixed

  • Code change to tabs, show/hide, opening times and contextual help to prevent JavaScript error if the fragment within a link url contains special characters.
  • Code change to prevent race condition with lazy loading when looking for the class js-objectfit-polyfill, used for older browser support.

No code changes required to components

This is an patch release to v.4.5.0; fixing issues found in the Framework. There are no code changes required to components to upgrade to this release from v.4.5.0.

CDN folder path //cdn.aviva.com/static/core/v.4.5.1/

Release v.4.5.0

Download v.4.5.0 Sketch assets

Added

Updated

  • Card carousel can now be disabled at different breakpoints if required. This was added to be used in conjunction with the checkbox multicard select and radio singlecard select so that at small screens the page would not become excessively long. See card carousel (v4) for reference.
  • Data layout modifier introduced to reset data item font to a smaller size. See data layout (v4) for reference.
  • Data layout modifier introduced to provide a four column data layout with the first column at double width. See data layout (v4) for reference.
  • Lazy loading can now support polyfills for object-fit. See lazy loading (v4) for reference.

Fixed

  • Style fix for the checkbox multiselect card (basic variant) with non-JavaScript where when the card is checked and has focus the background is partially green.
  • Code changes to stand-alone global navigation to ensure that it will work independantly.
  • Correction to styling of the full screen modal at mobile where the background behind the close link was not full width.
  • Fix for setting/value update functions not working or not working correctly on the date and data range components.
  • Fix for race condition with use of Modernizr within component JavaScript.

No code changes required to components

This is an update release to v.4.4.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.4.0.

CDN folder path //cdn.aviva.com/static/core/v.4.5.0/

Patch release v.4.4.1

Fixed

  • Minor correction to JavaScript file for primary tabs to stop additional quote mark appearing in URLs in static variant. See primary tabs (v4) for reference.

No code changes required to components

This is an patch release for v.4.4.0; fixing issues found in the Framework. There are no code changes required to components to upgrade to this release from v.4.4.0.

CDN folder path //cdn.aviva.com/static/core/v.4.4.1/

Release v.4.4.0

Download v.4.4.0 Sketch assets

Added

Updated

  • Data layout can now be used on a selection of dark accent colours. See data layout (v4) for reference.
  • Primary tabs can now be used with a selection of dark and light accent colours. See primary tabs (v4) for reference.
  • H1 + H2 group has been added and widths of the headings are now restricted in accordance to the updated usage rules. See heading group (v4) for reference.

No code changes required to components

This is an update release to v.4.3.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.3.0.

CDN folder path //cdn.aviva.com/static/core/v.4.4.0/

Release v.4.3.0

Download v.4.3.0 Sketch assets

Added

  • Lazy loading of images, both inline and background, is now available. This has been tested for compatability with all card types, figures, and hero banners. See lazy loading (v4) for reference.
  • Page structure examples, with PDF downloads for visual reference and working examples highlighting element spacing. See page structure (v4) for reference.
  • Form introduction addition, including revised form rules and form structure examples, with PDF download for visual reference and working example highlighting element spacing. See form introduction (v4) for reference.
  • Local theming documentation added to offer instruction on how to create colour variations of the Framework for our clients/customers, but use the same markup and UX. See local theme (v4) for reference.

Updated

  • The masthead now has the option to direct link to pages rather than use a mega dropdown. This is for use on microsites that do not require the mega dropdown functionality. See masthead (v4) for reference.

No code changes required to components

This is an update release to v.4.2.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.2.0.

CDN folder path //cdn.aviva.com/static/core/v.4.3.0/

Release v.4.2.0

Download v.4.2.0 Sketch assets

Added

  • New radio options for selecting an mutually exclusive option from a small list of 2-8 options. See radio options (v4) for reference.
  • New example form template available. See single page form template (v4) for reference.
  • New example login / register form templates available, including global login, confirmation page and further information page. See login / register form templates (v4) for reference.
  • New partner theme available for the Framework offering a light grey and white version of the masthead. See partner theme (v4) for reference.

Updated

  • Segmented control usage guidelines have been updated to limit their use from 2-5 to 2-3 options following the addition of radio options. See segmented controls (v4) for reference.
  • Payment option images have been updated to clean up some of the logos and also provide SVG versions of all the options. These image updates have also been applied to the payment card field used within the wallet. See payment options (v4) for reference.

No code changes required to components

This is an update release to v.4.1.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.1.0.

CDN folder path //cdn.aviva.com/static/core/v.4.2.0/

Release v.4.1.0

Download v.4.1.0 Sketch assets

Added

  • Additional variants for multi-segment doughnut charts, including right-aligned titles, and left justified titles with fixed indents. See doughnut charts (v4) for reference.
  • New customer portal roundels replacing the old customer portal product tabs. See customer portal product roundels (v4) for reference.
  • New data replay component to lay out data for ease of scanning. May be used to play information back to user that has already been entered. See Data replay (v4) for reference.

Deprecated

No code changes required to components

This is an update release to v.4.0.0; adding new components, functionality/variants to current components and minor style adjustments. There are no code changes required to components to upgrade to this release from v.4.0.0.

CDN folder path //cdn.aviva.com/static/core/v.4.1.0/

Release v.4.0.0 (BHANGBHANGDUC)

Download v.4.0.0 Sketch assets

Added

Updated

  • JavaScript vendor libraries, including jQuery, have been updated to the latest versions to ensure latest security fixes are available. See code changes required to update from the previous release (moving from v.3.4.0 to v.4.0.0) (v4) for more information.
  • Code changes for tertiary buttons with icons to align them with Aviva Standards. See buttons (v4) for reference.
  • Code changes for full bleed cards to align them with Aviva Standards. See editorial cards (v4) for reference.
  • Code changes for heading groups to align them with Aviva Standards. See heading groups (v4) for reference.
  • Code changes for plus/minus number textbox to align with other JavaScript-enabled components. See plus/minus number textbox (v4) for reference.
  • Code changes for segmented controls to allow the use of inline sprite images. See segmented controls (v4) for reference.
  • All stylesheets have been moved and some have been renamed in readiness for a selection of Aviva Themes being available for use. Note this also affects the stand-alone global navigation components. See the base template (v4) and stand-alone global navigation (v4) pages for reference.
  • Some components have been split out from the Framework core into their own extension files to enable teams to load only what is required to help with page optimisation. See component categorisation (v4) for reference.
  • The utility classes u-margin--bottom-none and u-margin--top-none have been improved to ensure consistency when applied to any component.
  • Form labels updated to represent a heading 3 with a font of 20px regular and line height of 28px to meet current design standards.
  • Heading 1 at tablet screen size updated with a font size of 36px and line height of 46px so that it meets current design standards and is more visually appealing. See Headings (v4) for reference.
  • Corrections to call us panel spacing. See call us panel (v4) for reference.
  • Call us panel right aligned heading changed to represent heading 2. See Call us panel (v4) for reference.
  • Social link list has been updated to improve usability and accessibility by increasing the hit target of each of the links. See social links list (v4) for reference.
  • Footer spacing has been updated to improve usability and accessibility by increasing the hit target of each of the links. See footer (v4) for reference.
  • Masthead markup has been update in readiness for style changes to improve accessibility. This change also allows for support for and of the icons available with tertiary buttons to be used within the mega dropdowns. See masthead (v4) for reference.
  • Spacing above and below a number of components has been updated to aid in simplifying spacing within templates and maintain consistency. For further details on what has changed see the v.4.0.0 code changes.
  • Spacing changes made to elements within forms. See form (v4) for reference.
  • Code changes made to unwrap legend tags from within span tags, resulting in right-floated links to drop below their labels. See code changes for general information and requirements, and Explanatory text (v4) for specific details regarding floated links.

Deprecated

  • Contextual help has been replace by the call us panel. See call us panel (v4) for reference.

Removed

  • Ability to override card accent colour setting. See accent colours (v4) for reference.
  • Cirrus, Delta, Solo and Switch payment options have been removed as the cards are no longer in circulation.
  • FAQ list for use within the contextual help component - FAQs can no longer be placed within the contextual help component, but should be displayed using the FAQ panel (v4).
  • Large font size for ordered lists; former small font size version now default. See lists (v4) for reference.
  • Agent profile card and agent call back card, including associated specialism link styles; no direct replacement.
  • Right-aligned information icon for buttons; replaced by the left-aligned version. See buttons (v4) for reference.
  • Left-aligned link icon styles; replaced by right-aligned link icon styles, updated icons and/or tertiary buttons. See links (v4) for reference.
  • Breadcrumb; replaced by wayfinder (v4).
  • Heading with dividing line; replaced with keyline dividers (v4) and tertiary buttons (v4).
  • Divider utility class; replaced by keyline dividers (v4).
  • Promo modal and promo modal with hero; no replacement.
  • The auto-jump functionality for textbox groups has been removed.

With the release of v.4.0.0 all beta versions (v.2.1.0 and earlier) of the Framework are no longer supported. This means there will no longer be any bug fixes applied to these versions. Please move to a production release as soon as possible.

Code changes required

This is a major release; modifying current components as well as adding new components, functionality/variants to current components, a range of style adjustments and security updates.

See detailed breakdown of code changes required to update from the previous release (moving from v.3.4.0 to v.4.0.0).

CDN folder path //cdn.aviva.com/static/core/v.4.0.0/

View logs for earlier releases