Nijmegen Component Library
You are viewing version 6.3.2 of the library, the latest version is

Changelog

All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog.

Important note: Please make sure to include the correct integrity hash when a CSS or JS file is has changed.

6.3.2 | 2023-11
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): autocomplete
    Change(s): JS
    Description: Modified demo search script to better sanitize input

6.3.1 | 2023-03

changed

  • Component(s): date-picker, input
    Change(s): HTML
    Description: Improved input field validation instructions

6.3.0 | 2023-01
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): cards-filename, cards-news, cards-services, cards-services-no-icon
    Change(s): HTML
    Description: Update titles from paragraphs to h3 headings
  • Component(s): cards-news
    Change(s): HTML
    Description: Updated the order of the HTML elements (card-body and figure) to improve the output of screen readers
  • Component(s): sidenav
    Change(s): HTML, CSS
    Description: Updated sidenav collapsible items with accessibility improvements to enable keyboard navigation. The correct `aria-expanded` and `aria-controls` are added for screen readers.
  • Component(s): carousel
    Change(s): HTML
    Description: Updated the focus order of the Prev/Next buttons in the carousel component to improve accessibility tab order.
  • Component(s): tags, badges
    Change(s): HTML, CSS
    Description: Updated tags & badges components with better visibility of the close button and focus.
  • Component(s): accordion
    Change(s): CSS
    Description: Improved accordion component with better focus when tabbing
  • Component(s): date-picker
    Change(s): HTML, JS
    Description: Added visible feedback to date picker / validation

added

  • Component(s): complex-table
    Change(s): HTML
    Description: Added table scopes to improve screen reader support to complex tables
  • Component(s): tooltips
    Change(s): HTML
    Description: Added aria-labels to add screen reader support to buttons with tooltips
  • Component(s): stepper
    Change(s): HTML
    Description: Added correct autocomplete attributes to the input fields. Make sure to add the correct autocomplete attributes for your usecase, see https://www.w3.org/TR/WCAG21/#input-purposes.
  • Component(s): carousel, progress-bar
    Change(s): HTML
    Description: Added correct aria-labels on carousel and progress-bar components.

removed

  • Component(s): stepper
    Change(s): HTML
    Description: Removed unnecessary strong tags in titles in Stepper component
  • Component(s): anchors
    Change(s): CSS
    Description: Removed the optional class `no-underline` on regular anchors. In older releases this removed the underline from normal links. The reason of removal is to improve accessibility.
  • Component(s): hover-effects
    Change(s): HTML
    Description: Removed options for `light` & `super light` for not meeting the required accessibility standards for contrast. Make sure to update these components.

6.2.4 | 2022-12
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): stepper
    Change(s): JS
    Description: Updated the Stepper scripts to specifically select the direct children. This also makes it possible to use links in the content of the component.

6.2.3 | 2022-08

changed

  • Component(s):
    Description: Added warning to changelog entries when one of the integrity hashes has changed

6.2.2 | 2022-06
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): tooltips
    Change(s): JS, CSS
    Description: Text in tooltips are selectable and the tooltips can be closed with the ESC key.

6.2.1 | 2022-06
Some integrity hashes are changed, check the how to use for the correct hashes

changed

6.2.0 | 2022-04
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): carousel
    Change(s): CSS, JS
    Description: Changed focus and active style of carousel indicators
  • Component(s): switch
    Change(s): HTML, NOTES
    Description: Added aria-hidden to the switch options to make it better accessible for screen reader users
  • Component(s): accordion
    Change(s): HTML
    Description: Changed the role of the accordion headings to make it better accessible

added

  • Component(s): results-advanced
    Description: This new component is based on the search-results. It provides the option to add meta data to a search result item.

6.1.0 | 2022-04
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): carousel
    Change(s): HTML, CSS, JS
    Description: Improve accessibility of indicator buttons

added

  • Component(s): meta-block
    Change(s): HTML, CSS
    Description: component to display meta information on a page.

6.0.1 | 2021-11
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): modals
    Change(s): CSS
    Description: Changed the focus and hover state for the close button

6.0.0 | 2021-09
Some integrity hashes are changed, check the how to use for the correct hashes

added,removed,changed

  • Component(s): almost all components
    Change(s): CSS
    Description: Remove (almost) all `!importants` from the css file in order to provide cleaner css. In the future the user has more control over their html elements without interference.

5.0.5 | 2021-08
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): navbar
    Change(s): JS
    Description: Added a focus trap to the mobile navbar menu. This is done to prevent keyboard users to focus on items behind the navbar. The navbar mobile menu will also close when you navigate to an item on the same page when you use the .nijmegen-smooth-scroll class.
  • Component(s): navbar
    Change(s): CSS
    Description: Adjusted the focus color and improved the contrasts of the elements
  • Component(s): icon-list
    Description: Addded a visual example of the current icons which are used by Nijmegen
  • Component(s): autocomplete
    Change(s): HTML
    Description: removed the `role="listbox"` attribute from the default template since by default the `ul` is empty. On autocomplete it will add this attribute automatically
  • Component(s): multi-upload, autocomplete, stepper
    Change(s): NOTES
    Description: Added extra information regarding accessibility rules for the action attribute on a form

added

  • Component(s): radio-button
    Description: Added a radio-button component to the library

5.0.4 | 2021-07
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): searchresults-template
    Change(s): NOTES
    Description: Added note about the possibility to add an inline skiplink to skip over facets
  • Component(s): navbar
    Change(s): JS
    Description: The hamburger menu will now close when the Escape key is pressed
  • Component(s): navbar
    Change(s): JS
    Description: When the hamburger menu is open the logo is removed from the tab order
  • Component(s): checkbox
    Change(s): JS, HTML
    Description: Removed the aria-checked attribute since it is not needed for a native checkbox
  • Component(s): switch
    Change(s): JS, HTML
    Description: Removed the aria-checked attribute for the hidden input element since it is not needed for a native checkbox
  • Component(s): pagination
    Change(s): JS, HTML
    Description: Added the role=button and tabindex=-1 when a navigation button is disabled

added

  • Component(s): inline-skiplink
    Change(s): HTML, CSS
    Description: Added an inline skiplink component

5.0.3 | 2021-06
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): facets, facets-advanced, searchresults-template
    Change(s): HTML, CSS
    Description: Changed the facets title to a button so it is keyboard accessible. Changed wrapper from <section> to <nav>.
  • Component(s): facets, facets-advanced
    Change(s): HTML, JS
    Description: Added option to allow the facets to be collapsible on desktop

5.0.2 | 2021-02

changed

  • Component(s):
    Change(s): HTML
    Description: Added an integrity hash to all included scripts (see 'How To Use')
  • Component(s):
    Change(s): HTML
    Description: Added preload links for all fonts to the "How to use" section

5.0.1 | 2020-12
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s):
    Change(s): JS
    Description: Fixed a bug where you couldn't use your keyboard to navigate a link

5.0.0 | 2020-11
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): material design icons
    Change(s): CSS
    Description: Updated material design icons to version 5.8.55
  • Component(s): material design bootstrap (mdb)
    Change(s): CSS
    Description: Updated mdb to version 4.19.1
  • Component(s): time-picker
    Change(s): HTML
    Description: Changed icon after material design icons update
  • Component(s): footer
    Change(s): HTML
    Description: Changed facebook and twitter icons after material design icons update
  • Component(s): navbar
    Change(s): HTML, CSS, JS
    Description: Added a skiplinks to the navbar
  • Component(s): navbar
    Change(s): JS
    Description: Fix navigation with keyboard
  • Component(s): autocomplete
    Change(s): HTML
    Description: Added the aria-atomic=true attribute to the search results announcer

4.0.6 | 2020-09
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): accordion
    Change(s): HTML
    Description: Added missing "data-parent" property to the tab content panels
  • Component(s): navbar
    Change(s): js
    Description: You can navigate the navbar with your keyboard again

4.0.5 | 2020-07
Some integrity hashes are changed, check the how to use for the correct hashes

searchresults-template

  • Component(s): carousel
    Change(s): JS
    Description: Fixed bug where 'trim' was used on an empty result, resulting in a console error

4.0.4 | 2020-06
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): searchresults-template
    Change(s): JS
    Description: Fixed a bug where empty search queries were send to Pandosearch
  • Component(s): searchresults-template, navbar
    Change(s): JS
    Description: Added the "track=false" query parameter to the pandosearch implementation to prevent searches in the component library to show up in the pandosearch metrics.

4.0.3 | 2020-06
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): button--primary
    Change(s): CSS
    Description: Fixed the contrast ratio of a link styled as a button when focussed
  • Component(s): lists
    Change(s): CSS
    Description: Fixed the numbering for ordered lists on safari
  • Component(s): navbar
    Change(s): JS, HTML
    Description: Replaced the native mdb smooth-scroll with a custom nijmegen-smooth-scroll

4.0.2 | 2020-05

changed

4.0.1 | 2020-05
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): stepper
    Change(s): CSS, JS
    Description: Fixed the compatibility with IE11
  • Component(s): lightbox
    Change(s): JS
    Description: Fixed the way the lightbox-ui is fetched

4.0.0 | 2020-04

changed

  • Component(s):
    Change(s): IMPLEMENTATION
    Description: From this version every new version gets its own URL. That means that a consumer of the library can decide when to switch to a new version.

    Please read the "How to use" and "Versioning" sections in the documentation for more details.

3.3.1 | 2020-02
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): lists
    Change(s): css
    Description: (Re)added the styling for the ordered list

3.3.0 | 2020-02
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): searchresults-template
    Change(s): JS, HTML
    Description: Removed the `pandosearch.showFacets()` to fix duplicate calls to pandosearch
  • Component(s): autocomplete
    Change(s): JS
    Description: Fixed a bug that send empty autocomplete search requests

3.2.1 | 2020-02
Some integrity hashes are changed, check the how to use for the correct hashes

changed

  • Component(s): navbar
    Change(s): CSS
    Description: Fixed wrong position of placeholder in IE11

3.2.0 | 2019-12
Some integrity hashes are changed, check the how to use for the correct hashes

changed

3.1.0 | 2019-11

changed

  • Component(s):
    Description: Every deploy to release will create a new version on the changelog page

3.0.0 | 2019-08
Some integrity hashes are changed, check the how to use for the correct hashes

added

  • Component(s): facets-advanced
    Description: Advanced facets with collapsible groups and checkboxes
  • Component(s): pills
    Description: Added the pills component
  • Component(s): tabs--pills
    Description: Added an example to the tabs with the pills component

changed

  • Component(s): navbar-primary, navbar-white
    Description: Added the new autocomplete component to the navbar and it now uses Pandosearch
  • Component(s): searchresults-template
    Description: Usage of the new search components (autocomplete, facets, results) and implemented Pandosearch
  • Component(s): default-template, forminputs-template
    Description: Now makes use of Pandosearch for the autocomplete in the navbar
  • Component(s): navbar
    Description: The mobile navbar is moved from the hamburger menu to the navbar
  • Component(s): accordion
    Description: Made the accordion component more accessible
  • Component(s): button-horizontal-collapse
    Description: Made horizontal collapsing button more accessible
  • Component(s): footer
    Description: Make footer more accessible
  • Component(s): alerts
    Description: Made close button more accessible
  • Component(s): input
    Description: The input element has now screen reader friendly feedback
  • Component(s): select
    Description: Add more contrasting focus color
  • Component(s): navbar-primary, navbar-white
    Description: Changed the way menu items look on hover and various small accessibility changes
  • Component(s): autocomplete
    Description: Improved accessibility
  • Component(s): carousel
    Description: Improved accessibility
  • Component(s): forminputs-template
    Description: Added the changed input element to this overview
  • Component(s): input
    Description: Change p in example to div
  • Component(s): select
    Description: Improved accessibility for the select component
  • Component(s): progressbar
    Description: Added better example
  • Component(s): navbar-primary
    Description: Added missing alt attribute
  • Component(s): sidenav
    Description: Moved div outside of ul
  • Component(s): timepicker
    Description: Made inputs self-closing
  • Component(s): autocomplete
    Change(s): JS, CSS, HTML
    Description: Added option to show section headers
  • Component(s): navbar-primary
    Change(s): HTML, JS
    Description: Added section headers to the pandosearch autocomplete results
  • Component(s): searchresults-template
    Description: Added reference to the pagination component
  • Component(s): cards-filename, cards-services, cards-services-no-icon, cards-news
    Change(s): CSS, HTML
    Description: Added underline to read-more link
  • Component(s): no-title-link, title-link
    Change(s): CSS, HTML
    Description: Added underline to links
  • Component(s): facets
    Description: Fixed active-icon in edge
  • Component(s): autocomplete
    Change(s): JS
    Description: Fixed issues with IE11
  • Component(s): navbar-primary
    Change(s): CSS
    Description: Some styling changes for the clear input button
  • Component(s): autocomplete
    Change(s): CSS, HTML, JS
    Description: Added a clear input button and fixed some small issues with the headers
  • Component(s): facets, facets-advanced
    Change(s): CSS, JS
    Description: Hide “filter results” bar when there are no facets
  • Component(s): stepper
    Change(s): HTML, JS
    Description: Use correct step status labels (aria-label was preventing the screenreader to read the rest of the step contents)
  • Component(s): listing
    Change(s): CSS
    Description: Removed extra focus border on title
  • Component(s): searchresults-template
    Change(s): JS
    Description: It is possible to sort facets
  • Component(s): searchresults-template
    Change(s): JS
    Description: The search results will show the description instead of the body
  • Component(s): autocomplete
    Change(s): JS
    Description: Increase timeout so the click event will fire before closing the dropdown
  • Component(s): autocomplete
    Change(s): HTML, JS
    Description: Opening and closing the autocomplete is now more robust
  • Component(s): stepper
    Change(s): HTML
    Description: Changed classes so it works with the new mdbootstrap version
  • Component(s): autocomplete
    Change(s): CSS
    Description: Break long items on word
  • Component(s): navbar-primary
    Change(s): JS
    Description: Close the mobile menu when clicked outside or when smooth scroll is enabled and clicked on an item
  • Component(s): autocomplete
    Change(s): JS[]
    Description: Improved the way the autocomplete results are closed when clicked outside
  • Component(s): date-picker
    Change(s): JS
    Description: Improved accessibility by removing buttons from the picker from the tabindex
  • Component(s): pagination
    Change(s): HTML
    Description: Improved accessibility changing the aria-labels for page landmarks
  • Component(s): facets-advanced
    Change(s): HTML
    Description: Improved accessibility by removing the region role
  • Component(s): tabs
    Change(s): CSS, HTML
    Description: Improved accessibility by changing from the list to just divs
  • Component(s): tags
    Change(s): HTML
    Description: Improved accessibility by adding a label to the button
  • Component(s): autocomplete
    Change(s): HTML
    Description: Improved accessibility by adding role and aria-hidden
  • Component(s): carousel
    Change(s): JS
    Description: Improved readability of script and change native DOM manipulation for jQuery
  • Component(s): date-picker
    Change(s): HTML, CSS, JS
    Description: Improved screen-reader support
  • Component(s): autocomplete
    Change(s): CSS
    Description: Add highlight on focus and hover
  • Component(s): inline-text-elements
    Change(s): CSS, HTML
    Description: Removed underline element and used styling instead
  • Component(s): hover-effects
    Change(s): HTML
    Description: Add dummy alt tag
  • Component(s): popover
    Change(s): HTML
    Description: Use h1 element in the example
  • Component(s): facets
    Change(s): CSS
    Description: Add default color so every heading can be used
  • Component(s): complex-table, normal-table
    Change(s): CSS, HTML
    Description: Added caption to improve accessibility
  • Component(s): default-template, searchresults-template
    Description: Added navbar scripts on the CL
  • Component(s): navbar-primary
    Change(s): HTML, JS
    Description: Added some extra scripts to make closing the autocomplete results possible
  • Component(s): autocomplete
    Change(s): JS
    Description: Also close the searchbar on mobile when clicked outside
  • Component(s): autocomplete
    Change(s): JS
    Description: Added method to change the icon of the autocomplete based on whether the input field is empty or not
  • Component(s): searchresults-template
    Change(s): JS
    Description: Changed pandosearch example script so it will change the icon of the autocomplete
  • Component(s): navbar
    Change(s): CSS, HTML
    Description: The HTML and CSS for the primary and white navbar is now the same (except colors)
  • Component(s): carousel
    Change(s): JS
    Description: Removed pause on hover because it interfered with the pause button
  • Component(s): navbar
    Change(s): JS
    Description: Added script to detect scrolling on the navbar with ie11