Responsive design update

This update notice applies to these downloads:

Created 6.26pm Wed 16 Jan 2013

Responsive design (version 4) for ANU branded sites was released in November 2012. A number of Drupal downloads on this site have been updated to support the new release. To enable responsive design for your Drupal site, follow these steps.

  1. Update the Acton theme to 7.x-2.0-beta6.
  2. Update these modules:
    • Acton Profile to 7.x-1.0-beta8
    • (If applicable) Acton Layouts to 7.x-1.3
    • (If applicable) ANU Feature Rotator to 7.x-1.0-beta1.
  3. Run module updates (by visiting http://yoursite.anu.edu.au/update.php, assuming your site runs in http://yoursite.anu.edu.au/).
  4. Edit the site profile. Under Settings, from the Style version dropdown list, select Version 4 (responsive design). Note that most existing styling should still work if staying in version 3 (see compatibility notes below).

When switching to responsive design, it is highly recommended that you check your entire site to make sure all pages appear suitable at all window sizes. Be sure to read the responsive design rules in the Web Style Guide to fix site elements as appropriate. When you are satisfied with the updates to your site, email webstyle@anu.edu.au with the name or ID of your site to indicate that your site has been updated to version 4 styles.

Responsive design is only available on Drupal 7.

Compatibility

Depending on how your site overrides CSS styles on nested grids, the following style changes may require additional adjustments to your site:

  • The regions Content top, Content and Content bottom no longer have the class doublewide applied to the region wrapper. Instead, the doublewide class is applied to each block in those regions. If Acton Layouts is used and the Main page content is a panel display, the doublewide class is not applied to that block (since the layout itself will contain doublewide regions).
  • The ANU mixed 9 layout (anu_layout_2) now outputs the right column first within document flow. The appearance remains the same, but when collapsing it will first display as floating right and then full-width on small screens.
  • Due to the layout styling of the responsive design update, nested grids (eg doublenarrow inside doublewide) will no longer have the correct dimensions and margins. Page designs relying on this behaviour should replace nested grid classes with width classes when switching to version 4.
  • The About this site link in the site footer is updated without support for version 3. If you are using this link, please switch to version 4 and fix your site as necessary to accommodate responsive design. Otherwise, the About this site link will not display properly.
  • Downloads under Acton content do not support responsive design yet.

Demo

An example site has been set up to demonstrate the functionality enabled by this responsive update.

Updated:  19 November 2017/Responsible Officer:  CMBE & CPMS Web Admin/Page Contact:  CMBE & CPMS Web Admin