darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-07-26 22:58:28 -04:00
Code Issues Packages Projects Releases Wiki Activity

Use HTML5 details element for the service switcher

Browse Source 
The previous service switcher was built purely in Javascript, which meant that,
for the purposes of progressive enhancement, it had to load in the open state.
Setting it to the closed state with Javascript happened a fraction of a second
after page load. This caused an unpleasant flicker as the whole page shifted up
and down as it loaded.

This commit changes the switcher to use the native HTML5 `details` and
`summary` elements[1].

This commit adds a polyfill from GOV.UK Elements for browsers which don’t
support `details`/`summary`.

1. http://html5doctor.com/the-details-and-summary-elements/
This commit is contained in:
Chris Hill-Scott
2016-01-19 11:37:26 +00:00
parent a90f575671
commit a08089a47d
5 changed files with 209 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
gulpfile.babel.js
View File

@@ -34,8 +34,8 @@ gulp.task('javascripts', () => gulp
.src([
paths.npm + 'govuk_frontend_toolkit/javascripts/govuk/modules.js',
paths.npm + 'govuk_frontend_toolkit/javascripts/govuk/selection-buttons.js',
paths.src + 'javascripts/detailsPolyfill.js',
paths.src + 'javascripts/apiKey.js',
paths.src + 'javascripts/dropdown.js',
paths.src + 'javascripts/highlightTags.js',
paths.src + 'javascripts/main.js'
])