diff --git a/css/reveal.css b/css/reveal.css index 9f2089e23c8996fd2391450f520ce29010840a56..eda311e8db3b296defe405ffca11b7c466a68f66 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -964,6 +964,21 @@ body { z-index: 100; transition: all 1s ease; } +.reveal .pause-overlay .resume-button { + position: absolute; + bottom: 20px; + right: 20px; + color: #ccc; + border-radius: 2px; + padding: 6px 14px; + border: 2px solid #ccc; + font-size: 16px; + background: transparent; + cursor: pointer; } + .reveal .pause-overlay .resume-button:hover { + color: #fff; + border-color: #fff; } + .reveal.paused .pause-overlay { visibility: visible; opacity: 1; } diff --git a/css/reveal.scss b/css/reveal.scss index 1fff346b31c7ed4574b25a5e059dcca4a0c70575..e6608d4e7ade8f20db34a68b51cd07e5a95d8c90 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1034,6 +1034,25 @@ $controlsArrowAngleActive: 36deg; z-index: 100; transition: all 1s ease; } + +.reveal .pause-overlay .resume-button { + position: absolute; + bottom: 20px; + right: 20px; + color: #ccc; + border-radius: 2px; + padding: 6px 14px; + border: 2px solid #ccc; + font-size: 16px; + background: transparent; + cursor: pointer; + + &:hover { + color: #fff; + border-color: #fff; + } +} + .reveal.paused .pause-overlay { visibility: visible; opacity: 1; diff --git a/js/reveal.js b/js/reveal.js index 93ed446b26d72a242cff7b244f39f3a3412afd72..103fa820e79495f9abce8329f3502f424b378715 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -593,7 +593,8 @@ dom.speakerNotes.setAttribute( 'tabindex', '0' ); // Overlay graphic which is displayed during the paused mode - createSingletonNode( dom.wrapper, 'div', 'pause-overlay', null ); + dom.pauseOverlay = createSingletonNode( dom.wrapper, 'div', 'pause-overlay', '<button class="resume-button">Resume presentation</button>' ); + dom.resumeButton = dom.pauseOverlay.querySelector( '.resume-button' ); dom.wrapper.setAttribute( 'role', 'application' ); @@ -1298,6 +1299,8 @@ dom.progress.addEventListener( 'click', onProgressClicked, false ); } + dom.resumeButton.addEventListener( 'click', resume, false ); + if( config.focusBodyOnPageVisibilityChange ) { var visibilityChange; @@ -1361,6 +1364,8 @@ dom.wrapper.removeEventListener( 'touchmove', onTouchMove, false ); dom.wrapper.removeEventListener( 'touchend', onTouchEnd, false ); + dom.resumeButton.removeEventListener( 'click', resume, false ); + if ( config.progress && dom.progress ) { dom.progress.removeEventListener( 'click', onProgressClicked, false ); }