From 77eb2e521c4393552c29a54758abeaba9e034e0f Mon Sep 17 00:00:00 2001 From: Gemma Leigh Date: Sat, 18 Jun 2016 16:30:26 +0100 Subject: [PATCH] Add an extra panel to describe how details summary is used - Link to caniuse to show which browsers support the HTML5 details and summary elements - Link to GOV.UK element's details summary polyfill JS - Link to example page with details/summary test cases - Remove the link to the example page which would otherwise be duplicated underneath. --- app/views/guide_typography.html | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/app/views/guide_typography.html b/app/views/guide_typography.html index 9c7d2f1ce..fb8e527ec 100755 --- a/app/views/guide_typography.html +++ b/app/views/guide_typography.html @@ -32,7 +32,7 @@

Contents:

  • Lists
  • Inset text
  • Legal text
    • -
  • Hidden text
    • +
  • Hidden text (progressive disclosure)
  • Examples
    • @@ -200,6 +200,19 @@

    Hidden text (progressive +
    +

    + If you're using the HTML5 details and summary elements, you'll need a polyfill for not-so-modern browsers. +

    +

    + You'll need to ensure that your markup matches the example above. + GOV.UK elements uses this polyfill. +

    +

    + Take a look at example page which demonstrates conditionally revealing information, using the HTML5 details and summary elements. +

    +
    +

    Examples