diff options
| -rw-r--r-- | README.md | 4 | ||||
| -rw-r--r-- | css/reveal.css | 48 | ||||
| -rw-r--r-- | css/reveal.scss | 48 | ||||
| -rw-r--r-- | js/reveal.js | 7 |
4 files changed, 53 insertions, 54 deletions
@@ -175,7 +175,7 @@ We use [marked](https://github.com/chjj/marked) to parse Markdown. To customise ```javascript Reveal.initialize({ // Options which are passed into marked - // See https://github.com/chjj/marked#options-1 + // See https://marked.js.org/#/USING_ADVANCED.md#options markdown: { smartypants: true } @@ -1049,7 +1049,7 @@ This will only display in the notes window. Notes are only visible to the speaker inside of the speaker view. If you wish to share your notes with others you can initialize reveal.js with the `showNotes` configuration value set to `true`. Notes will appear along the bottom of the presentations. -When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). By default, notes are printed in a semi-transparent box on top of the slide. If you'd rather print them on a separate page after the slide, set `showNotes: "separate-page"`. +When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). By default, notes are printed in a box on top of the slide. If you'd rather print them on a separate page, after the slide, set `showNotes: "separate-page"`. #### Speaker notes clock and timers diff --git a/css/reveal.css b/css/reveal.css index eda311e..f4f8b88 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -1294,9 +1294,9 @@ body { transition-duration: 1200ms; } /********************************************* - * LINK PREVIEW OVERLAY + * OVERLAY FOR LINK PREVIEWS AND HELP *********************************************/ -.reveal .overlay { +.reveal > .overlay { position: absolute; top: 0; left: 0; @@ -1308,11 +1308,11 @@ body { visibility: hidden; transition: all 0.3s ease; } -.reveal .overlay.visible { +.reveal > .overlay.visible { opacity: 1; visibility: visible; } -.reveal .overlay .spinner { +.reveal > .overlay .spinner { position: absolute; display: block; top: 50%; @@ -1326,7 +1326,7 @@ body { opacity: 0.6; transition: all 0.3s ease; } -.reveal .overlay header { +.reveal > .overlay header { position: absolute; left: 0; top: 0; @@ -1335,7 +1335,7 @@ body { z-index: 2; border-bottom: 1px solid #222; } -.reveal .overlay header a { +.reveal > .overlay header a { display: inline-block; width: 40px; height: 40px; @@ -1345,10 +1345,10 @@ body { opacity: 0.6; box-sizing: border-box; } -.reveal .overlay header a:hover { +.reveal > .overlay header a:hover { opacity: 1; } -.reveal .overlay header a .icon { +.reveal > .overlay header a .icon { display: inline-block; width: 20px; height: 20px; @@ -1356,13 +1356,13 @@ body { background-size: 100%; background-repeat: no-repeat; } -.reveal .overlay header a.close .icon { +.reveal > .overlay header a.close .icon { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABkklEQVRYR8WX4VHDMAxG6wnoJrABZQPYBCaBTWAD2g1gE5gg6OOsXuxIlr40d81dfrSJ9V4c2VLK7spHuTJ/5wpM07QXuXc5X0opX2tEJcadjHuV80li/FgxTIEK/5QBCICBD6xEhSMGHgQPgBgLiYVAB1dpSqKDawxTohFw4JSEA3clzgIBPCURwE2JucBR7rhPJJv5OpJwDX+SfDjgx1wACQeJG1aChP9K/IMmdZ8DtESV1WyP3Bt4MwM6sj4NMxMYiqUWHQu4KYA/SYkIjOsm3BXYWMKFDwU2khjCQ4ELJUJ4SmClRArOCmSXGuKma0fYD5CbzHxFpCSGAhfAVSSUGDUk2BWZaff2g6GE15BsBQ9nwmpIGDiyHQddwNTMKkbZaf9fajXQca1EX44puJZUsnY0ObGmITE3GVLCbEhQUjGVt146j6oasWN+49Vph2w1pZ5EansNZqKBm1txbU57iRRcZ86RWMDdWtBJUHBHwoQPi1GV+JCbntmvok7iTX4/Up9mgyTc/FJYDTcndgH/AA5A/CHsyEkVAAAAAElFTkSuQmCC); } -.reveal .overlay header a.external .icon { +.reveal > .overlay header a.external .icon { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAcElEQVRYR+2WSQoAIQwEzf8f7XiOMkUQxUPlGkM3hVmiQfQR9GYnH1SsAQlI4DiBqkCMoNb9y2e90IAEJPAcgdznU9+engMaeJ7Azh5Y1U67gAho4DqBqmB1buAf0MB1AlVBek83ZPkmJMGc1wAR+AAqod/B97TRpQAAAABJRU5ErkJggg==); } -.reveal .overlay .viewport { +.reveal > .overlay .viewport { position: absolute; display: -webkit-box; display: -ms-flexbox; @@ -1372,7 +1372,7 @@ body { bottom: 0; left: 0; } -.reveal .overlay.overlay-preview .viewport iframe { +.reveal > .overlay.overlay-preview .viewport iframe { width: 100%; height: 100%; max-width: 100%; @@ -1382,11 +1382,11 @@ body { visibility: hidden; transition: all 0.3s ease; } -.reveal .overlay.overlay-preview.loaded .viewport iframe { +.reveal > .overlay.overlay-preview.loaded .viewport iframe { opacity: 1; visibility: visible; } -.reveal .overlay.overlay-preview.loaded .viewport-inner { +.reveal > .overlay.overlay-preview.loaded .viewport-inner { position: absolute; z-index: -1; left: 0; @@ -1395,46 +1395,46 @@ body { text-align: center; letter-spacing: normal; } -.reveal .overlay.overlay-preview .x-frame-error { +.reveal > .overlay.overlay-preview .x-frame-error { opacity: 0; transition: opacity 0.3s ease 0.3s; } -.reveal .overlay.overlay-preview.loaded .x-frame-error { +.reveal > .overlay.overlay-preview.loaded .x-frame-error { opacity: 1; } -.reveal .overlay.overlay-preview.loaded .spinner { +.reveal > .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; -webkit-transform: scale(0.2); transform: scale(0.2); } -.reveal .overlay.overlay-help .viewport { +.reveal > .overlay.overlay-help .viewport { overflow: auto; color: #fff; } -.reveal .overlay.overlay-help .viewport .viewport-inner { +.reveal > .overlay.overlay-help .viewport .viewport-inner { width: 600px; margin: auto; padding: 20px 20px 80px 20px; text-align: center; letter-spacing: normal; } -.reveal .overlay.overlay-help .viewport .viewport-inner .title { +.reveal > .overlay.overlay-help .viewport .viewport-inner .title { font-size: 20px; } -.reveal .overlay.overlay-help .viewport .viewport-inner table { +.reveal > .overlay.overlay-help .viewport .viewport-inner table { border: 1px solid #fff; border-collapse: collapse; font-size: 16px; } -.reveal .overlay.overlay-help .viewport .viewport-inner table th, -.reveal .overlay.overlay-help .viewport .viewport-inner table td { +.reveal > .overlay.overlay-help .viewport .viewport-inner table th, +.reveal > .overlay.overlay-help .viewport .viewport-inner table td { width: 200px; padding: 14px; border: 1px solid #fff; vertical-align: middle; } -.reveal .overlay.overlay-help .viewport .viewport-inner table th { +.reveal > .overlay.overlay-help .viewport .viewport-inner table th { padding-top: 20px; padding-bottom: 20px; } diff --git a/css/reveal.scss b/css/reveal.scss index e6608d4..c82a297 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1416,10 +1416,10 @@ $controlsArrowAngleActive: 36deg; /********************************************* - * LINK PREVIEW OVERLAY + * OVERLAY FOR LINK PREVIEWS AND HELP *********************************************/ -.reveal .overlay { +.reveal > .overlay { position: absolute; top: 0; left: 0; @@ -1431,12 +1431,12 @@ $controlsArrowAngleActive: 36deg; visibility: hidden; transition: all 0.3s ease; } - .reveal .overlay.visible { + .reveal > .overlay.visible { opacity: 1; visibility: visible; } - .reveal .overlay .spinner { + .reveal > .overlay .spinner { position: absolute; display: block; top: 50%; @@ -1452,7 +1452,7 @@ $controlsArrowAngleActive: 36deg; transition: all 0.3s ease; } - .reveal .overlay header { + .reveal > .overlay header { position: absolute; left: 0; top: 0; @@ -1461,7 +1461,7 @@ $controlsArrowAngleActive: 36deg; z-index: 2; border-bottom: 1px solid #222; } - .reveal .overlay header a { + .reveal > .overlay header a { display: inline-block; width: 40px; height: 40px; @@ -1472,10 +1472,10 @@ $controlsArrowAngleActive: 36deg; box-sizing: border-box; } - .reveal .overlay header a:hover { + .reveal > .overlay header a:hover { opacity: 1; } - .reveal .overlay header a .icon { + .reveal > .overlay header a .icon { display: inline-block; width: 20px; height: 20px; @@ -1484,14 +1484,14 @@ $controlsArrowAngleActive: 36deg; background-size: 100%; background-repeat: no-repeat; } - .reveal .overlay header a.close .icon { + .reveal > .overlay header a.close .icon { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABkklEQVRYR8WX4VHDMAxG6wnoJrABZQPYBCaBTWAD2g1gE5gg6OOsXuxIlr40d81dfrSJ9V4c2VLK7spHuTJ/5wpM07QXuXc5X0opX2tEJcadjHuV80li/FgxTIEK/5QBCICBD6xEhSMGHgQPgBgLiYVAB1dpSqKDawxTohFw4JSEA3clzgIBPCURwE2JucBR7rhPJJv5OpJwDX+SfDjgx1wACQeJG1aChP9K/IMmdZ8DtESV1WyP3Bt4MwM6sj4NMxMYiqUWHQu4KYA/SYkIjOsm3BXYWMKFDwU2khjCQ4ELJUJ4SmClRArOCmSXGuKma0fYD5CbzHxFpCSGAhfAVSSUGDUk2BWZaff2g6GE15BsBQ9nwmpIGDiyHQddwNTMKkbZaf9fajXQca1EX44puJZUsnY0ObGmITE3GVLCbEhQUjGVt146j6oasWN+49Vph2w1pZ5EansNZqKBm1txbU57iRRcZ86RWMDdWtBJUHBHwoQPi1GV+JCbntmvok7iTX4/Up9mgyTc/FJYDTcndgH/AA5A/CHsyEkVAAAAAElFTkSuQmCC); } - .reveal .overlay header a.external .icon { + .reveal > .overlay header a.external .icon { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAcElEQVRYR+2WSQoAIQwEzf8f7XiOMkUQxUPlGkM3hVmiQfQR9GYnH1SsAQlI4DiBqkCMoNb9y2e90IAEJPAcgdznU9+engMaeJ7Azh5Y1U67gAho4DqBqmB1buAf0MB1AlVBek83ZPkmJMGc1wAR+AAqod/B97TRpQAAAABJRU5ErkJggg==); } - .reveal .overlay .viewport { + .reveal > .overlay .viewport { position: absolute; display: flex; top: 40px; @@ -1500,7 +1500,7 @@ $controlsArrowAngleActive: 36deg; left: 0; } - .reveal .overlay.overlay-preview .viewport iframe { + .reveal > .overlay.overlay-preview .viewport iframe { width: 100%; height: 100%; max-width: 100%; @@ -1512,12 +1512,12 @@ $controlsArrowAngleActive: 36deg; transition: all 0.3s ease; } - .reveal .overlay.overlay-preview.loaded .viewport iframe { + .reveal > .overlay.overlay-preview.loaded .viewport iframe { opacity: 1; visibility: visible; } - .reveal .overlay.overlay-preview.loaded .viewport-inner { + .reveal > .overlay.overlay-preview.loaded .viewport-inner { position: absolute; z-index: -1; left: 0; @@ -1526,26 +1526,26 @@ $controlsArrowAngleActive: 36deg; text-align: center; letter-spacing: normal; } - .reveal .overlay.overlay-preview .x-frame-error { + .reveal > .overlay.overlay-preview .x-frame-error { opacity: 0; transition: opacity 0.3s ease 0.3s; } - .reveal .overlay.overlay-preview.loaded .x-frame-error { + .reveal > .overlay.overlay-preview.loaded .x-frame-error { opacity: 1; } - .reveal .overlay.overlay-preview.loaded .spinner { + .reveal > .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; transform: scale(0.2); } - .reveal .overlay.overlay-help .viewport { + .reveal > .overlay.overlay-help .viewport { overflow: auto; color: #fff; } - .reveal .overlay.overlay-help .viewport .viewport-inner { + .reveal > .overlay.overlay-help .viewport .viewport-inner { width: 600px; margin: auto; padding: 20px 20px 80px 20px; @@ -1553,25 +1553,25 @@ $controlsArrowAngleActive: 36deg; letter-spacing: normal; } - .reveal .overlay.overlay-help .viewport .viewport-inner .title { + .reveal > .overlay.overlay-help .viewport .viewport-inner .title { font-size: 20px; } - .reveal .overlay.overlay-help .viewport .viewport-inner table { + .reveal > .overlay.overlay-help .viewport .viewport-inner table { border: 1px solid #fff; border-collapse: collapse; font-size: 16px; } - .reveal .overlay.overlay-help .viewport .viewport-inner table th, - .reveal .overlay.overlay-help .viewport .viewport-inner table td { + .reveal > .overlay.overlay-help .viewport .viewport-inner table th, + .reveal > .overlay.overlay-help .viewport .viewport-inner table td { width: 200px; padding: 14px; border: 1px solid #fff; vertical-align: middle; } - .reveal .overlay.overlay-help .viewport .viewport-inner table th { + .reveal > .overlay.overlay-help .viewport .viewport-inner table th { padding-top: 20px; padding-bottom: 20px; } diff --git a/js/reveal.js b/js/reveal.js index 3c31b97..b071cc3 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -593,8 +593,7 @@ dom.speakerNotes.setAttribute( 'tabindex', '0' ); // Overlay graphic which is displayed during the paused mode - dom.pauseOverlay = createSingletonNode( dom.wrapper, 'div', 'pause-overlay', '<button class="resume-button">Resume presentation</button>' ); - dom.resumeButton = dom.pauseOverlay.querySelector( '.resume-button' ); + dom.pauseOverlay = createSingletonNode( dom.wrapper, 'div', 'pause-overlay', config.controls ? '<button class="resume-button">Resume presentation</button>' : null ); dom.wrapper.setAttribute( 'role', 'application' ); @@ -1299,7 +1298,7 @@ dom.progress.addEventListener( 'click', onProgressClicked, false ); } - dom.resumeButton.addEventListener( 'click', resume, false ); + dom.pauseOverlay.addEventListener( 'click', resume, false ); if( config.focusBodyOnPageVisibilityChange ) { var visibilityChange; @@ -1364,7 +1363,7 @@ dom.wrapper.removeEventListener( 'touchmove', onTouchMove, false ); dom.wrapper.removeEventListener( 'touchend', onTouchEnd, false ); - dom.resumeButton.removeEventListener( 'click', resume, false ); + dom.pauseOverlay.removeEventListener( 'click', resume, false ); if ( config.progress && dom.progress ) { dom.progress.removeEventListener( 'click', onProgressClicked, false ); |