1
1
document . addEventListener ( 'DOMContentLoaded' , function ( ) {
2
2
3
3
// Make tables responsive by wrapping them in a div and making them scrollable
4
- const tables = document . querySelectorAll ( 'table.docutils' ) ;
4
+ const tables = document . querySelectorAll ( 'table.docutils' )
5
5
tables . forEach ( function ( table ) {
6
6
table . outerHTML = '<div class="responsive-table__container">' + table . outerHTML + '</div>'
7
- } ) ;
7
+ } )
8
8
9
- const togglerInput = document . querySelector ( '.toggler__input' ) ;
10
- const togglerLabel = document . querySelector ( '.toggler__label' ) ;
11
- const sideMenu = document . querySelector ( '.menu-wrapper' ) ;
9
+ const togglerInput = document . querySelector ( '.toggler__input' )
10
+ const togglerLabel = document . querySelector ( '.toggler__label' )
11
+ const sideMenu = document . querySelector ( '.menu-wrapper' )
12
12
const menuItems = document . querySelectorAll ( '.menu' )
13
- const doc = document . querySelector ( '.document' ) ;
14
- const body = document . querySelector ( 'body' ) ;
13
+ const doc = document . querySelector ( '.document' )
14
+ const body = document . querySelector ( 'body' )
15
15
16
16
function closeMenu ( ) {
17
- togglerInput . checked = false ;
18
- sideMenu . setAttribute ( "aria-expanded" , 'false' ) ;
19
- sideMenu . setAttribute ( 'aria-hidden' , 'true' ) ;
20
- togglerLabel . setAttribute ( 'aria-pressed' , 'false' ) ;
21
- body . style . overflow = 'visible' ;
17
+ togglerInput . checked = false
18
+ sideMenu . setAttribute ( "aria-expanded" , 'false' )
19
+ sideMenu . setAttribute ( 'aria-hidden' , 'true' )
20
+ togglerLabel . setAttribute ( 'aria-pressed' , 'false' )
21
+ body . style . overflow = 'visible'
22
22
}
23
23
function openMenu ( ) {
24
- togglerInput . checked = true ;
25
- sideMenu . setAttribute ( "aria-expanded" , 'true' ) ;
26
- sideMenu . setAttribute ( 'aria-hidden' , 'false' ) ;
27
- togglerLabel . setAttribute ( 'aria-pressed' , 'true' ) ;
28
- body . style . overflow = 'hidden' ;
24
+ togglerInput . checked = true
25
+ sideMenu . setAttribute ( "aria-expanded" , 'true' )
26
+ sideMenu . setAttribute ( 'aria-hidden' , 'false' )
27
+ togglerLabel . setAttribute ( 'aria-pressed' , 'true' )
28
+ body . style . overflow = 'hidden'
29
29
}
30
30
31
31
// Close menu when link on the sideMenu is clicked
32
32
sideMenu . addEventListener ( 'click' , function ( event ) {
33
- let target = event . target ;
34
- if ( target . tagName . toLowerCase ( ) !== 'a' ) return ;
35
- closeMenu ( ) ;
33
+ let target = event . target
34
+ if ( target . tagName . toLowerCase ( ) !== 'a' ) return
35
+ closeMenu ( )
36
36
} )
37
37
// Add accessibility data when sideMenu is opened/closed
38
38
togglerInput . addEventListener ( 'change' , function ( e ) {
39
- togglerInput . checked ? openMenu ( ) : closeMenu ( ) ;
40
- } ) ;
39
+ togglerInput . checked ? openMenu ( ) : closeMenu ( )
40
+ } )
41
41
// Make sideMenu links tabbable only when visible
42
42
for ( let menuItem of menuItems ) {
43
43
if ( togglerInput . checked ) {
44
- menuItem . setAttribute ( 'tabindex' , '0' ) ;
44
+ menuItem . setAttribute ( 'tabindex' , '0' )
45
45
} else {
46
- menuItem . setAttribute ( 'tabindex' , '-1' ) ;
46
+ menuItem . setAttribute ( 'tabindex' , '-1' )
47
47
}
48
48
}
49
49
// Close sideMenu when document body is clicked
50
50
doc . addEventListener ( 'click' , function ( ) {
51
51
if ( togglerInput . checked ) {
52
- closeMenu ( ) ;
52
+ closeMenu ( )
53
53
}
54
54
} )
55
55
} )
0 commit comments