v3.1.0 release notes

What's New

Changes That Break Things

As always, be on the lookout for broken layouts and functionality when upgrading, and test thoroughly.

  • Old page top script section to split jQuery version to support release of jQuery 2.0 dropping support for oldIE.

    v3.0:

    <script src="../dist/js/jquery.min.js"></script>
    <!--[if lte IE 8]>
    <script src="../dist/js/polyfills/html5shiv-min.js"></script>
    <link rel="stylesheet" href="../dist/grids/css/util-ie-min.css" />
    <link rel="stylesheet" href="../dist/js/css/pe-ap-ie-min.css" />
    <link rel="stylesheet" href="../dist/theme-gcwu-fegc/css/theme-ie-min.css" />
    <![endif]-->
    <!--[if gt IE 8]><!-->
    <link rel="stylesheet" href="../dist/grids/css/util-min.css" />
    <link rel="stylesheet" href="../dist/js/css/pe-ap-min.css" />
    <link rel="stylesheet" href="../dist/theme-gcwu-fegc/css/theme-min.css" />
    <!--<![endif]-->

    v3.1:

    <!--[if lte IE 8]>
    <script src="../dist/js/jquery-ie.min.js"></script>
    <script src="../dist/js/polyfills/html5shiv-min.js"></script>
    <link rel="stylesheet" href="../dist/grids/css/util-ie-min.css" />
    <link rel="stylesheet" href="../dist/js/css/pe-ap-ie-min.css" />
    <link rel="stylesheet" href="../dist/theme-gcwu-fegc/css/theme-ie-min.css" />
    <noscript><link rel="stylesheet" href="../dist/theme-gcwu-fegc/css/theme-ns-ie-min.css" /></noscript>
    <![endif]-->
    <!--[if gt IE 8]><!-->
    <script src="../dist/js/jquery.min.js"></script>
    <link rel="stylesheet" href="../dist/grids/css/util-min.css" />
    <link rel="stylesheet" href="../dist/js/css/pe-ap-min.css" />
    <link rel="stylesheet" href="../dist/theme-gcwu-fegc/css/theme-min.css" />
    <noscript><link rel="stylesheet" href="../dist/theme-gcwu-fegc/css/theme-ns-min.css" /></noscript>
    <!--<![endif]-->
  • jQuery Mobile and pe-ap.js split into IE and non-IE versions at page bottom

    v3.0:

    <!-- ScriptsStart -->
    <script src="../dist/theme-gcwu-fegc/js/theme-min.js"></script>
    <script src="../dist/js/settings.js"></script>
    <script src="../dist/js/pe-ap-min.js"></script>
    <!-- ScriptsEnd -->

    v3.1:

    <!-- ScriptsStart -->
    <script src="../dist/js/settings.js"></script>
    <!--[if lte IE 8]>
    <script src="../dist/theme-gcwu-fegc/js/theme-ie-min.js"></script>
    <script src="../dist/js/pe-ap-ie-min.js"></script>
    <script src="../dist/js/jquerymobile/jquery.mobile-ie.min.js"></script>
    <![endif]-->
    <!--[if gt IE 8]><!-->
    <script src="../dist/theme-gcwu-fegc/js/theme-min.js"></script>
    <script src="../dist/js/pe-ap-min.js"></script>
    <script src="../dist/js/jquerymobile/jquery.mobile.min.js"></script>
    <!--<![endif]-->
    <!-- ScriptsEnd -->
  • Multi-column class names now use real numbers instead of written ones in the Grids system (e.g. "column-two" is now "column-2"). To upgrade these classes you can find and replace the following classes:
    v3.0 v3.1
    column-two column-2
    column-three column-3
    column-four column-4
  • Slideout tab now uses text instead of images. See the Slideout migration instructions.
  • Federal Identity Program elements are now SVG-based with an image fallback. The fallback has changed from GIF to PNG.

    v3.0:

    <div id="gcwu-sig">
      <div id="gcwu-sig-in">
        <div id="gcwu-sig-eng" title="Government of Canada">
          <img src="../../dist/theme-gcwu-fegc/images/sig-eng.gif" width="214" height="20" alt="Government of Canada" />
        </div>
      </div>
    </div>

    v3.1:

    <div id="gcwu-sig">
      <div id="gcwu-sig-in">
        <object data="../../dist/theme-gcwu-fegc/images/sig-eng.svg" role="img" tabindex="-1" aria-label="Government of Canada" type="image/svg+xml">
          <img src="../../dist/theme-gcwu-fegc/images/sig-eng.png" alt="Government of Canada" />
        </object>
      </div>
    </div>

    v3.0:

    <div id="gcwu-wmms">
      <div id="gcwu-wmms-in">
        <div id="gcwu-wmms-fip" title="Symbol of the Government of Canada">
          <img src="../dist/theme-gcwu-fegc/images/wmms.gif" width="126" height="30" alt="Symbol of the Government of Canada" />
        </div>
      </div>
    </div>

    v3.1:

    <div id="gcwu-wmms">
      <div id="gcwu-wmms-in">
        <object data="../dist/theme-gcwu-fegc/images/wmms.svg" role="img" tabindex="-1" aria-label="Symbol of the Government of Canada" type="image/svg+xml">
          <img src="../dist/theme-gcwu-fegc/images/wmms.png" alt="Symbol of the Government of Canada" />
        </object>
      </div>
    </div>

Improved Performance

  • jQuery Mobile integrated with desktop view
  • Upgraded to newer versions of JQuery Mobile, jQuery, and others

Look and Feel

  • Mobile view redesign
  • Small, medium and large screen support
  • Two new generic themes (WET and Base themes)
  • Improved Multimedia Player UI

New Features

  • Geomap
  • Responsive Images
  • Expand/Collapse All
  • Table enhancement (sorting and filtering of tables)
  • Design guide
  • Improved Tabbed Interface
  • Improved Charts and Graphs

Compatibility

  • New polyfill for Meter
  • Improved Slideout Tab

Internationalization and Localization

  • Localization for 33 languages
  • Slideout Tab is now i18n-compliant

Details

Number of commits: 3452

List of commits