Release notes

Current release


May 22, 2024 release

New release(s):

  • New icon added
    • cicon-circle-radiation
    • cicon-circle-radiation-light
    • cicon-laptop-mobile
    • cicon-laptop-mobile-light 

Bug fix(es):

Card container: Fixed the cards that were broken after the filter was applied.

Updated file(s):

Past releases, 2024


May 1, 2024

Enhancement(s):

  • Do's and Don'ts: 'Equal height' function added 

Bug fix(es):

  • Accordion: Fix the colour contrast on iPhone
  • Inline alert banner: Fix icon alignment

Updated file(s):

  • SCSS files

April 17, 2024

Enhancement(s):

  • Line graph: Add data point "markers" on the line graph component.

Bug fix(es):

  • Accessibility fix for the card component: A simple card is enhanced into a selectable card by adding the class 'block-link' along with the class 'card' on the div. When this combination is present, the 'block-link' class adds styling, and JavaScript will make any div with the classes 'cui' and 'card' function as a block link if it contains either an 'h3' element with an 'a' child or a 'p' element with the class 'card-title' that contains an 'a' child.

Updated file(s):

  • SCSS files
  • coc-card-item.js

April 10, 2024

New release(s):

  • New icon added: 
    • cicon-briefcase-light
    • cicon-newspaper-light
    • cicon-users-line-light
    • cicon-users-line-solid
    • cicon-clipboard-list-light
    • cicon-arrow-up-right-from-square-light
    • cicon-train-tunnel-light
    • cicon-train-tunnel-solid
    • cicon-person-to-door-light
    • cicon-person-to-door-solid
    • cicon-water-light
    • cicon-water-solid
    • cicon-palette-light
    • cicon-palette-solid
    • cicon-grip-lines-vertical-light
    • cicon-grip-lines-vertical-solid
    • cicon-train-track-light
    • cicon-train-track-solid
    • cicon-bridge-light
    • cicon-bridge-solid
    • cicon-escalator-light
    • cicon-escalator-solid
    • cicon-person-walking-light
    • cicon-grip-lines-light
  • Updated file(s):
    • cicon-package.zip

March 20, 2024

Enhancement(s):

Questionnaire:  Add the toggle for the progress container and question number in the configuration.

 

March 13, 2024

New component(s):

    Before and after slider demo added

Bug fix(es):

    Card: Fixed the video play icon not displaying.

Updated file(s):

  • SCSS files

February 28, 2024

Bug fix(es):

    Content block: Fixed the image display issue on Edge.  

Updated file(s):

  • SCSS files

February 21, 2024

Enhancement(s):

  • Global inline notification banner: Limiting the call-to-action links to two.

Bug fix(es):

  • Interactive bar / chart: Update the color to increase the contrast.

Updated file(s):

  • SCSS files

February 14, 2024

Bug fix(es):

  • Timeline:
    • Removed the vertical scrollbar that appeared in the horizontal timeline.   
    •  Remove the swiper buttons in the vertical timeline.
  • Alert banner: 
    • Updated the alignment of the icon and the top header text.
    • Renamed inline notification banner to inline alert banner.

Updated file(s):

  • SCSS files

February 7, 2024

Enhancement(s):

  • Alert banner demo updated: 
    • Add global inline notification banner
    • The colour of the icon display on small alert banner turns to black
  • Timeline demo updated: Remove the swiper buttons

Updated file(s):

  • SCSS files

January 31, 2024

Bug fix(es)

  • Button:
    • Removed the legacy code
    • Fixed the icon alignment
    • Corrected different button sizes
  • CTA block, Block banner, Hero banner, Text on image: Updated primary button HTML markup.
  •  Esri map and Questionnaire: Updated utility button HTML markup.
  • Timeline: Fixed navigation button to allow the current card to be focused.

Updated file(s):

  • SCSS files

January 17, 2024

New release(s):

  • New icon added: cicon-bus-ct

Enhancement(s)

  • Timeline: Make short description optional

Updated file(s):

  • cicon-package.zip

January 10, 2024

Enhancement(s)

  • Grid: Add the visibility toggle to hide the grid on the publish view

Bug fix(es):

  • Card
    • Accessibility fix: Add the card-header-wrapper to wrap up the card title and card context title. 
    • Fixed body text is hidden when changing from heading to paragraph tag
    • Remove the body text required, and update the field label.
  • Questionnaire: Print version fixes

Updated file(s):

  • SCSS files

January 3, 2024

Bug fix(es):

  • Questionnaire: Print version fixes

Updated file(s):

  • SCSS files

Past releases, 2023


December 20, 2023

New component(s):

  • Disclaimer demo added

Bug fix(es):

  • Questionnaire: Output report as HTML, spacing adjusted on the progress bar

Updated file(s):

  • SCSS files

December 13, 2023

Enhancement(s):

  • Form validation error banner: Icon updated from a triangle with an exclamation mark to a circle with an exclamation mark
  • Secondary navigation: Update the indentation and support additional levels

Bug fix(es):

  • Alert banner colour rollback

Updated file(s):

  • coc.nav.js
  • SCSS files

November 29, 2023

New release(s):

  • New icon added:
    • cicon-triangle-exclamation-solid
    • cicon-circle-exclamation-solid
    • cicon-circle-info-solid
    • cicon-circle-check-solid
    • cicon-briefcase-medical-solid
    • cicon-user-police-tie-solid
    • cicon-square-question-solid
    • cicon-tree-christmas-solid
    • cicon-screwdriver-wrench-solid
    • cicon-person-sign-solid
    • cicon-person-running-solid
    • cicon-flag-pennant-solid
    • cicon-circle-heart-solid
    • cicon-hat-cowboy-side-solid
    • cicon-ellipsis-light
    • cicon-ellipsis-vertical-light
    • cicon-triangle-exclamation-light
    • cicon-circle-exclamation-light
    • cicon-circle-info-light
    • cicon-circle-check-light
    • cicon-wheelchair-light
    • cicon-gear-complex-light
    • cicon-briefcase-medical-light
    • cicon-user-police-tie-light
    • cicon-square-question-light
    • cicon-tree-christmas-light
    • cicon-screwdriver-wrench-light
    • cicon-person-sign-light
    • cicon-person-running-light
    • cicon-flag-pennant-light
    • cicon-circle-heart-light
    • cicon-hat-cowboy-side-light
    • cicon-circle-hashtag-solid
    • cicon-circle-hashtag-light

Enhancement(s):

  • Alert banners:
    • Updated the icon, color and adjust the spacing
    • Add the information option for global banner
    • Add warning and success on the inline banner    
  • Tabs:  Add ID on tabs

Updated file(s):

  • cicon-package.zip

November 15, 2023

Enhancement(s):

  • Card container:  Context title and description text field added 

Bug fix(es):

  • Image viewer: Fixed not showing caption on images that have 'show caption' enabled while paging and images sometimes not being scaled correctly.    

Updated file(s):

  • SCSS files

November 08, 2023

New release(s):

  • New icon added:  
    • cicon-circle-parking-light
    • cicon-scooter
    • cicon-bicycle-light
    • cicon-chevrons-down-light
    • cicon-chevrons-left-light
    • cicon-chevrons-right-light
    • cicon-chevrons-up-light
  • Edge to edge wrapper

Enhancement(s):

  • Accordion: Style updated
    • Only when adding the accordion inside of the ‘Edge to edge wrapper’, the accordion background will be changed to white.

Bug fix(es):

  • Timeline: Navigation buttons function fixed

Updated file(s):

  • cicon-package.zip
  • SCSS files

November 01, 2023

New release(s):

  • New icon added:  
    • cimg-safety-o

Bug fix(es):

  • Image component: Updating osgi config to allow higher resolution images.

Updated file(s):

  • cicon-package.zip

October 18, 2023

New release(s):

  • New icon added:  
    • cicon-solid-database-rotate

Bug fix(es):

  • Mini card height fix
  • Timeline demo fix

Updated file(s):

  • cicon-package.zip

October 12, 2023

New release(s):

  • New icon added:  
    • cicon-cat-solid
    • cicon-clock-solid
    • cicon-search-light
    • cicon-file-pdf-light
    • cicon-file-arrow-down-light
    • cicon-filter-light
    • cicon-bars-light
    • cicon-arrow-up-arrow-down-light
    • cicon-arrow-up-light
    • cicon-arrow-down-light
    • cicon-droplet-light
    • cicon-chevron-left-light
    • cicon-chevron-right-light
    • cicon-chevron-up-light
    • cicon-chevron-down-light
    • cicon-arrow-left-light
    • cicon-arrow-right-light
    • cicon-user-shield-light
    • cicon-user-shield-solid
    • cicon-cart-shopping-light
    • cicon-map-location-dot-light
    • cicon-map-location-dot-solid
    • cicon-location-dot-light
    • cicon-money-check-pen-light
    • cicon-money-check-pen-solid
    • cicon-hand-holding-box-light
    • cicon-hand-holding-box-solid
    • cicon-user-tag-light
    • cicon-user-tag-solid
    • cicon-ctrain-light
    • cicon-ctrain-solid
    • cicon-bus-max-light
    • cicon-bus-max-solid
    • cicon-bus-light
    • cicon-universal-access-light
    • cicon-universal-access-solid
    • cicon-bag-shopping-light
    • cicon-ticket-light
    • cicon-arrows-up-down-light

Updated file(s):

  • cicon-package.zip

October 4, 2023

New release(s):

  • New icon added:  
    • cicon-syringe-regular
    • cicon-face-hand-over-mouth
    • cicon-head-side-cough-slash
    • cicon-spray-can-solid
    • cicon-arrows-left-right-light
    • cicon-arrow-right-arrow-left-light

Enhancement(s):

  • Card: Rounded edges update on card
  • Tab: 
    • Updating tab component to have ID's based on the title of each tab,
    • Automatically opening tabs on load based on location hash

Updated file(s):

  • SCSS files
  • cicon-package.zip

September 21, 2023

New release(s):

  • New icon added:  
    • cicon-clipboard-user

Enhancement(s):

  • The form input border colour was updated from #b7b9bb to  #939599

Updated file(s):

  • cicon-package.zip

September 11, 2023

Enhancement(s):

Card:  Add the 'Background size' option on authoring mode when choosing the mini card SVG image.

August 24, 2023

Enhancement(s):

Card set: Add the option to display horizontal card on mobile

Update file(s)

August 16, 2023

Enhancement(s):

Twitter icon updated 

Update file(s)

  • cicon-package.zip

August 9, 2023

Update file(s)

  • SCSS files ( Wrap division operations inside a calc() expression )

July 13, 2023

Enhancements(s)

Content Block: Added video support and duration block display in the component

June 28, 2023

Bug fix(es):

Card: Authoring view card layout fix

Timeline: Code cleanup and date format fix

Updated file(s):

  • SCSS files

June 21, 2023

New component (s):

Timeline: Web components are interactive UI elements that organize chronological information on web pages.

Updated file(s):

  • SCSS files

June 7, 2023

Bug fix(es):

  • Image viewer gallery: Broken filter fixed

Updated file(s):

  • SCSS files

May 17, 2023

Enhancement(s):

  • Hero banner:
    • Add the context title field to the standard option
    • Standardize the description field across the standard and adaptable options
  • List:
    • Adjust the spacing under the ordered and unordered list
  • Footer:
    • Add the 'Additional resources' heading above the privacy policy section             

Updated file(s):

  • SCSS files

May 11, 2023

Enhancement(s):

  • Card set and card slider:
    • Heading option added
    • Enables switching between heading tag and paragraph tag for card title

Updated file(s):

  • SCSS files

May 4, 2023

New release(s):

  • New icon added:
    • cicon-dumbbell-solid

Updated file(s):

  • cicon-package.zip

April 28, 2023

New release(s):

  • New icons added:
    • cicon-bike-rack
    • cicon-stage
    • cicon-dumbbell-in
    •  cicon-laptop-arrow-down-solid
    • cicon-trophy-star-solid
    • cicon-octagon-exclamation-solid

Updated file(s):

  • cicon-package.zip

April 19, 2023

Enhancement(s):

  • Heading demo regroup
  • Breadcrumb demo: single-level display added
  • Wordmark demo: New layout options added
  • Primary navigation demo: Complex curated dropdowns added  
  • Accordion demo: Heading options added

Updated file(s):

  • SCSS files

March 22, 2023

New release(s):

  • New icons added
    • cicon-map-pen
    • cicon-people-group-solid
    • cicon-chart-mixed-solid
    • cicon-arrows-turn-to-dots-solid
    • cicon-helmet-safety-solid
    • cicon-hand-heart-solid
    • cicon-hammer-solid
    • cicon-sack-dollar-solid
    • cicon-cash-register-solid
  • New SVGS added
    • cimg-person-vaping-o
    • cimg-vape-hand-o
    • cimg-vape-o

Updated file(s):

  • SCSS files
  • cicon-package.zip

March 15,2023

Enhancement(s):

  • The YouTube video can be started and stopped at a specific time across different components.

March 8, 2023

Bug fix(es):

  • Table V2: Fixed a bug that would make some links disappear inside the table.

Enhancement(s):

  • Block banner: Add the 'Start' and 'End' options on video setup
  • Do`s and dont`s block: Add the addition label.

 

March 1, 2023

Enhancement(s):

  • Alert banner: Update the colour based on the semantic colour palette.

Updated file(s)

  • SCSS files

 

February 22, 2023

Enhancement(s):

  • Semantic colour palette updated:
    • CSS class  ‘coc-secondary-red ‘ updated to  ‘coc-danger ‘ and  ‘coc-error ‘
    • CSS class  ‘coc-secondary-blue-access ‘ updated to  ‘coc-information ‘
    • New CSS classes added:  ‘coc-caution ‘,  ‘coc-success’

Updated file(s)

  • SCSS files

 

February 15, 2023

Bug fix(es):

  • Modal: modal window height fix with long contents

Updated file(s)

  • SCSS files
  • coc.modal.js

 

February 8, 2023

Enhancement(s):

  • Image: Add the caption and caption alignment options
  • Image viewer - Single image: Add cation alignment options
  • Modal demo: Removed the 'Enable full screen on mobile' option

Updated file(s)

  • SCSS files

 

February 2, 2023

Bug fix(es):

  • Vertical tab: Spacing between components
  • Modal: Modal window position

Updated file(s)

  • SCSS files

 

January 18, 2023

Bug fix(es):

  • Vertical tab: Height of the content area
  • Modal: Modal window position

Updated file(s)

  • SCSS files

 

January 12, 2023

Bug fix(es):

  • Modal: Fullscreen display

Updated file(s)

  • SCSS files

 

January 5, 2023

Bug fix(es):

  • Card container - scrolling: authoring card width reset
  • Modal: Close modal clicking above and below on backdrop

Updated file(s)

  • SCSS files

 

Past releases, 2022


December 22, 2022

Enhancement(s):

  • The animation library version updated
    • GSAP 2.0.1 to GSAP 3.11.3
    • scrollMagic updated from 2.0.5 to 2.0.7

Bug fix(es):

  • Card container - scrolling: Refresh card set on resizing browser window 

Updated file(s)

  • coc.animations.js

December 14, 2022

New release(s):

  • Icon library updated: cicon-person-skating-solid added 

Component enhancement(s):

  • Tabs: Vertical layout option added
  • Service line bar chat: Remove link for single service line

Bug fix(es):

  • Tab accessibility fix: Add the missing aria-selected attribute 

Updated file(s)

  • SCSS files
  • cicon-package.zip
  • coc-accordion-tabs.js

 

December 07, 2022

New release(s):

  • New SVGS added
    • cimg-hand-saying-stop
    • cimg-cannabis-marijuana-leaf
    • cimg-respectful-workplace-policy-people
    • cimg-weigh-scale        

Component enhancement(s):

  • Mega nav: Add a "context phrase" to the single-level dropdown mega nav drawer

Updated file(s)

  • SCSS files
  • cicon-package.zip

 

November 30, 2022

Component enhancement(s)

  • Icon with label: Allow to add SVG image

Custom component enhancement(s):

  • Service lines and budgets bar chart: Extended component, content types, lists and single service line filter

Bug fix(es)

  • Tooltip demo accessiblity fix
  • Bar graph does not support multiple layouts on same page

 

November 23, 2022

Custom component enhancement(s):

  • Horizontal bar graph: Add the layout option to display the label to the left or label above
  • Service lines and budgets bar chart:
    • refactor and optimize the code so that the component is reusable
    • enable sorting by value
    • enable order of the bars
    • resolve the delimiter issues with the data
    • data bar style update to help visualized if the value becomes 0

Updated file(s)

  • SCSS files

November 17, 2022

Custom component bug fix(es)

  • Horizontal bar graph data display fixed

November 3, 2022

Custom component(s)

  • Horizontal bar graph
  • Service plan and budget bar chart

Bug fix(es)

Table: Fixed the RTE link to an asset and makes it relative.

Updated file(s)

  • SCSS files

October 12, 2022

Enhancement(s)

Content block with image: Additional button option added.

Bug fix(es)

Utility navigation menu fixes on the header

Updated file(s)

  • SCSS files

October 5, 2022

Bug fix(es)

Link button: Demo fix

September 28, 2022

Enhancement(s)

Header: New configuration options added

  • With utility menu and related links
  • With single level mega menu
  • With curated mega menu

September 2, 2022

Enhancement(s)

Footer: Expand on footer functionality,  group links layout added

Updated file(s)

  • SCSS files

August 31, 2022

Bug Fixes(s)

Icon only button: Fixed the bug with the icon not displaying correctly

Page Indexing: Fixed the bug where Design System pages were showing in Calgary.ca search results 

Enhancement(s)

Mega Menu: Added proof of concepts for single level mega nav and curated mega nav content

Removal(s)

Parallax Scrolling: Removed the Parallax scrolling component from the design system

Updated file(s)

  • SCSS files

August 25, 2022

August 25, 2022 release

Enhancement(s)

Traffic line icons: Updated the colour values of the traffic line icons

Updated file(s)

  • SCSS files

August 10, 2022

Bug fix(es)

Data display: The side-scrolling fix

Table: The side-scrolling on the table demo fix

The linear footer:  Did not Permit links without extensions .html fix

Video: YouTube Videos were not displaying correctly fix

Enhancement(s)

Data display

  1. Allow the data display component to display on the 'content block' component ( Without image layout )
  2. New options for the table display:
    • Table width: Default, 100% width
    • Table text alignment: Center, Top

Updated file(s)

  • SCSS files

July 28, 2022

Bug fix(es)

Video: Typo and  JS error fix

Enhancement(s)

Video: Add Wistia and Webcast

Form button: Remove the 'Mega' button and add the 'Disabled' and 'Icon only' buttons

Table: Add SVG illustrations to the table

SVG Library: Demo updated to include all the new SVGs

July 20, 2022

Bug fix(es)

Marketing banner: Accessibility fix

Updated file(s)

  • SCSS files

July 7, 2022

Bug fix(es)

Adaptable banner: Text colour fix on mobile

Updated file(s)

  • SCSS files

June 29, 2022

New release(s)

Do`s and dont`s block: uses simple and matched visual elements and list view to advise rules in a particular situation.

New icons added:

  • cicon-store-solid
  • cicon-restroom-solid
  • cicon-glass-water-droplet-solid
  • cicon-campground-solid
  • cicon-person-circle-question-solid

Bug fix(es)

Design system colour component: Spacing fix on CPS brand page

Enhancement(s)

Image: Provide authoring control for the image to be 100% on the small screen

Updated file(s)

  • SCSS files
  • cicon-package.zip

June 22, 2022

New release(s)

New SVG images added

Bug fix(es)

Application card: Fixed the card layout when the 'status' is hidden

Slogan banner - without text: Fixed the mobile image display 

Enhancement(s)

Text on image: Removed the scroll bar on the content body

Updated file(s)

  • SCSS files

June 1, 2022

New release(s)

Application card: Used to summarize items in a list that share similar information properties (and should only be used for items that would be intended for a list).

Enhancement(s)

Modal: added sliding modal

Updated file(s)

  • SCSS files
  • coc-modal-sliding.js

May 18, 2022

Enhancement(s)

Marketing block: added video option

Updated file(s)

  • SCSS files

May 11, 2022

Enhancement(s)

Adaptable Hero Banner: Add the white text option

Updated file(s)

  • SCSS files

May 4, 2022

Enhancement(s)

Background image block: Component level policy updated to allow the video component

Secondary navigation: Demo updated

Bug fix(es)

<pre> tag: Font family update to "Open Sans"

Updated file(s)

  • coc.nav.js
  • SCSS files

April 27, 2022

Bug fix(es)

Secondary navigation: Add the `active` class to the appropriate menu list item.

Updated file(s)

  • coc.nav.js

April 26, 2022 HOT-FIX

Bug fix(es)

White background overlay does not appear on various components

  • Hero banner - standard
  • Block banner
  • Background image block

Data display: Button style fix

Updated package(s)

  • SCSS files

April 20, 2022

Enhancement(s)

Marketing block:

  • added column widths option
  • added the image height option

Updated package(s)

  • SCSS files:
    • renamed following output files:
      • 'coc-styles.css' to 'coc-styles-designSystem-bundle.css'
      • 'coc-styles-cps.css' to 'coc-styles-designSystem-cps-bundle.css'
      • 'coc-styles-election.css' to 'coc-styles-designSystem-election-bundle.css'
    • removed 'coc-styles-form.css': form style included inside of the new output files

April 13, 2022

Bug fix(es)

  • cicon-kiwi-bird-solid
  • cicon-crow-solid
  • cicon-dove-solid
  • cicon-feather-pointed-solid
  • cicon-feather-solid

Updated package(s)

  • cicon-package.zip

April 06, 2022

New release(s)

New icons added:

  • cicon-kiwi-bird-solid
  • cicon-crow-solid
  • cicon-dove-solid
  • cicon-feather-pointed-solid
  • cicon-feather-solid

Enhancement(s)

Horizontal rule:

  • added option to remove the top space

Marketing banner:

  • added "contain" option for the background image
  • added option to remove border
  • set up max-width on the subtitle line length to match the standard paragraph line length

March 30, 2022

New release(s)

New icons added:

  • cicon-menu-open
  • cicon-menu-collapse

March 16, 2022

New release(s)

Marketing banner component

Enhancement(s)

Primary navigation component:

  • added functionality to close sub navigation when user clicks off the menu to prevent layering issues with other links.