From 587d16ceef9e8f11230d6f183b483388075d3609 Mon Sep 17 00:00:00 2001 From: Dhyego Fernando Date: Thu, 10 Mar 2016 13:50:35 -0400 Subject: fix(PDF Export): Mark as important `width`, `height` and add `zoom` properties to fix CSS rules which were overrided by inline styles --- css/print/pdf.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'css') diff --git a/css/print/pdf.css b/css/print/pdf.css index 9ed90d6..e4a1b7d 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -60,8 +60,9 @@ ul, ol, div, p { } .reveal .slides { position: static; - width: 100%; - height: auto; + width: 100% !important; + height: auto !important; + zoom: 1 !important; left: auto; top: auto; @@ -157,4 +158,3 @@ ul, ol, div, p { position: absolute; font-size: 14px; } - -- cgit v1.2.3 From a9566dfbd48741b4566b4bdbe07c1222dd48771f Mon Sep 17 00:00:00 2001 From: Vincent Bernat Date: Thu, 24 Mar 2016 16:23:12 +0100 Subject: make theme "simple" use white titles on dark backgrounds This is similar to what is done in the "white" theme. --- css/theme/simple.css | 3 +++ css/theme/source/simple.scss | 5 +++++ 2 files changed, 8 insertions(+) (limited to 'css') diff --git a/css/theme/simple.css b/css/theme/simple.css index b17fa5c..8b48be1 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -7,6 +7,9 @@ */ @import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700); @import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); +section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 { + color: #fff; } + /********************************************* * GLOBAL STYLES *********************************************/ diff --git a/css/theme/source/simple.scss b/css/theme/source/simple.scss index 84c7d9b..394c9cd 100644 --- a/css/theme/source/simple.scss +++ b/css/theme/source/simple.scss @@ -31,6 +31,11 @@ $linkColor: #00008B; $linkColorHover: lighten( $linkColor, 20% ); $selectionBackgroundColor: rgba(0, 0, 0, 0.99); +section.has-dark-background { + &, h1, h2, h3, h4, h5, h6 { + color: #fff; + } +} // Theme template ------------------------------ -- cgit v1.2.3 From d1a3656108ef0872f2a1179bcb87aa035d60b378 Mon Sep 17 00:00:00 2001 From: Aniqah Mair Date: Wed, 27 Apr 2016 14:50:03 -0400 Subject: Add selection colour for Mozilla Firefox Defines the highlight colour when selecting slide content using Mozilla Firefox to match other browsers, instead of being the default colour. --- css/theme/beige.css | 5 +++++ css/theme/black.css | 5 +++++ css/theme/blood.css | 5 +++++ css/theme/league.css | 5 +++++ css/theme/moon.css | 5 +++++ css/theme/night.css | 5 +++++ css/theme/serif.css | 5 +++++ css/theme/simple.css | 5 +++++ css/theme/sky.css | 5 +++++ css/theme/solarized.css | 5 +++++ css/theme/white.css | 5 +++++ 11 files changed, 55 insertions(+) (limited to 'css') diff --git a/css/theme/beige.css b/css/theme/beige.css index 5bbda4b..7f71dd9 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -29,6 +29,11 @@ body { background: rgba(79, 64, 28, 0.99); text-shadow: none; } +::-moz-selection { + color: #fff; + background: rgba(79, 64, 28, 0.99); + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/black.css b/css/theme/black.css index 511fa79..9228c46 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -25,6 +25,11 @@ body { background: #bee4fd; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #bee4fd; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/blood.css b/css/theme/blood.css index 6fe3d67..2da8d68 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -28,6 +28,11 @@ body { background: #a23; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #a23; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/league.css b/css/theme/league.css index 03c44ce..aa5bee5 100644 --- a/css/theme/league.css +++ b/css/theme/league.css @@ -31,6 +31,11 @@ body { background: #FF5E99; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #FF5E99; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/moon.css b/css/theme/moon.css index 5e5d6e4..5cb1176 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -29,6 +29,11 @@ body { background: #d33682; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #d33682; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/night.css b/css/theme/night.css index a439cdc..cf2c7a7 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -23,6 +23,11 @@ body { background: #e7ad52; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #e7ad52; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/serif.css b/css/theme/serif.css index 40ccb39..bbb9f7e 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -25,6 +25,11 @@ body { background: #26351C; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #26351C; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/simple.css b/css/theme/simple.css index b17fa5c..33809ec 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -25,6 +25,11 @@ body { background: rgba(0, 0, 0, 0.99); text-shadow: none; } +::-moz-selection { + color: #fff; + background: rgba(0, 0, 0, 0.99); + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/sky.css b/css/theme/sky.css index 99f1cfd..202ade8 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -32,6 +32,11 @@ body { background: #134674; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #134674; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/solarized.css b/css/theme/solarized.css index b4d4d4b..44771dc 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -29,6 +29,11 @@ body { background: #d33682; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #d33682; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/white.css b/css/theme/white.css index b10dd0e..16a1d23 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -25,6 +25,11 @@ body { background: #98bdef; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #98bdef; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; -- cgit v1.2.3 From 9b11915c3a409aa456c64e9d386ac15598a4fa6b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 28 Apr 2016 17:07:26 +0200 Subject: fix pdf bg layering, simplify code --- css/print/pdf.css | 14 +++++++------- js/reveal.js | 38 +++++++++----------------------------- 2 files changed, 16 insertions(+), 36 deletions(-) (limited to 'css') diff --git a/css/print/pdf.css b/css/print/pdf.css index 9ed90d6..9ae0dfe 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -82,6 +82,12 @@ ul, ol, div, p { perspective-origin: 50% 50%; } +.reveal .slides .pdf-page { + position: relative; + overflow: hidden; + z-index: 1; +} + .reveal .slides section { page-break-after: always !important; @@ -132,13 +138,7 @@ ul, ol, div, p { top: 0; left: 0; width: 100%; - z-index: -1; -} - -/* All elements should be above the slide-background */ -.reveal section>* { - position: relative; - z-index: 1; + height: 100%; } /* Display slide speaker notes when 'showNotes' is enabled */ diff --git a/js/reveal.js b/js/reveal.js index 628c0b9..47b4f01 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -607,8 +607,7 @@ // Wrap the slide in a page element and hide its overflow // so that no page ever flows onto another var page = document.createElement( 'div' ); - page.className = 'page'; - page.style.overflow = 'hidden'; + page.className = 'pdf-page'; page.style.height = ( pageHeight * numberOfPages ) + 'px'; slide.parentNode.insertBefore( page, slide ); page.appendChild( slide ); @@ -618,14 +617,8 @@ slide.style.top = top + 'px'; slide.style.width = slideWidth + 'px'; - // TODO Backgrounds need to be multiplied when the slide - // stretches over multiple pages - var background = slide.querySelector( '.slide-background' ); - if( background ) { - background.style.width = pageWidth + 'px'; - background.style.height = ( pageHeight * numberOfPages ) + 'px'; - background.style.top = -top + 'px'; - background.style.left = -left + 'px'; + if( slide.slideBackgroundElement ) { + page.insertBefore( slide.slideBackgroundElement, slide ); } // Inject notes if `showNotes` is enabled @@ -653,7 +646,7 @@ numberElement.classList.add( 'slide-number' ); numberElement.classList.add( 'slide-number-pdf' ); numberElement.innerHTML = formatSlideNumber( slideNumberH, '.', slideNumberV ); - background.appendChild( numberElement ); + page.appendChild( numberElement ); } } @@ -733,24 +726,12 @@ // Iterate over all horizontal slides toArray( dom.wrapper.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ).forEach( function( slideh ) { - var backgroundStack; - - if( printMode ) { - backgroundStack = createBackground( slideh, slideh ); - } - else { - backgroundStack = createBackground( slideh, dom.background ); - } + var backgroundStack = createBackground( slideh, dom.background ); // Iterate over all vertical slides toArray( slideh.querySelectorAll( 'section' ) ).forEach( function( slidev ) { - if( printMode ) { - createBackground( slidev, slidev ); - } - else { - createBackground( slidev, backgroundStack ); - } + createBackground( slidev, backgroundStack ); backgroundStack.classList.add( 'stack' ); @@ -846,6 +827,8 @@ slide.classList.remove( 'has-dark-background' ); slide.classList.remove( 'has-light-background' ); + slide.slideBackgroundElement = element; + // If this slide has a background color, add a class that // signals if it is light or dark. If the slide has no background // color, no class will be set @@ -3406,10 +3389,7 @@ if( isPrintingPDF() ) { var slide = getSlide( x, y ); if( slide ) { - var background = slide.querySelector( '.slide-background' ); - if( background && background.parentNode === slide ) { - return background; - } + return slide.slideBackgroundElement; } return undefined; -- cgit v1.2.3 From e2a863405782709e8cd30227f8b1157acc30fa19 Mon Sep 17 00:00:00 2001 From: 黄玄 Date: Mon, 2 May 2016 01:42:11 +0800 Subject: add refused-to-display tips in link-preview-overlay --- css/reveal.scss | 10 ++++++++++ js/reveal.js | 3 +++ 2 files changed, 13 insertions(+) (limited to 'css') diff --git a/css/reveal.scss b/css/reveal.scss index f8d6904..c360fe6 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1229,6 +1229,16 @@ html:-moz-full-screen-ancestor { visibility: visible; } + .reveal .overlay.overlay-preview.loaded .viewport-inner { + position: absolute; + z-index: -1; + left: 0; + top: 60px; + width: 100%; + text-align: center; + letter-spacing: normal; + } + .reveal .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; diff --git a/js/reveal.js b/js/reveal.js index 10c609e..e772516 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1500,6 +1500,9 @@ '
', ' ' ].join(''); -- cgit v1.2.3 From 187114f47224b4628350a6046c6f758bce83f6c1 Mon Sep 17 00:00:00 2001 From: Tiago Garcia Date: Sat, 21 May 2016 11:36:49 -0700 Subject: Removing duplicated "position" property at pdf.css Found that by running css-lint on the code--- css/print/pdf.css | 1 - 1 file changed, 1 deletion(-) (limited to 'css') diff --git a/css/print/pdf.css b/css/print/pdf.css index 9ed90d6..3dc577d 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -86,7 +86,6 @@ ul, ol, div, p { page-break-after: always !important; visibility: visible !important; - position: relative !important; display: block !important; position: relative !important; -- cgit v1.2.3 From 6593ac3d5f83ec49b168d49d7963146e67fd0e79 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 23 May 2016 10:38:46 +0200 Subject: moz selection color in theme template #1575 --- css/theme/template/theme.scss | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'css') diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index 101a567..bcbaf0c 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -22,6 +22,12 @@ body { text-shadow: none; } +::-moz-selection { + color: $selectionColor; + background: $selectionBackgroundColor; + text-shadow: none; +} + .reveal .slides>section, .reveal .slides>section>section { line-height: 1.3; -- cgit v1.2.3 From 3111d3b1ae12af2580cb45a18da208146701a6fd Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 26 May 2016 09:57:19 +0200 Subject: support for 'separate-page' layout for notes in PDF exports #1518 --- README.md | 2 +- css/print/pdf.css | 13 ++++++++++++- js/reveal.js | 21 +++++++++++++++++---- 3 files changed, 30 insertions(+), 6 deletions(-) (limited to 'css') diff --git a/README.md b/README.md index 56dad41..b275846 100644 --- a/README.md +++ b/README.md @@ -890,7 +890,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` config 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). +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 slide. If you'd rather print them on a separate page after the slide, set `showNotes: "separate-page"`. ## Server Side Speaker Notes diff --git a/css/print/pdf.css b/css/print/pdf.css index 406f125..fb56129 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -145,11 +145,22 @@ ul, ol, div, p { display: block; width: 100%; max-height: none; - left: auto; top: auto; + right: auto; + bottom: auto; + left: auto; z-index: 100; } +/* Layout option which makes notes appear on a separate page */ +.reveal .speaker-notes-pdf[data-layout="separate-page"] { + position: relative; + color: inherit; + background-color: transparent; + padding: 20px; + page-break-after: always; +} + /* Display slide numbers when 'slideNumber' is enabled */ .reveal .slide-number-pdf { display: block; diff --git a/js/reveal.js b/js/reveal.js index 656ed10..f43e0aa 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -624,18 +624,31 @@ // Inject notes if `showNotes` is enabled if( config.showNotes ) { + + // Are there notes for this slide? var notes = getSlideNotes( slide ); if( notes ) { + var notesSpacing = 8; + var notesLayout = typeof config.showNotes === 'string' ? config.showNotes : 'inline'; var notesElement = document.createElement( 'div' ); notesElement.classList.add( 'speaker-notes' ); notesElement.classList.add( 'speaker-notes-pdf' ); + notesElement.setAttribute( 'data-layout', notesLayout ); notesElement.innerHTML = notes; - notesElement.style.left = ( notesSpacing - left ) + 'px'; - notesElement.style.bottom = ( notesSpacing - top ) + 'px'; - notesElement.style.width = ( pageWidth - notesSpacing*2 ) + 'px'; - slide.appendChild( notesElement ); + + if( notesLayout === 'separate-page' ) { + page.parentNode.insertBefore( notesElement, page.nextSibling ); + } + else { + notesElement.style.left = ( notesSpacing - left ) + 'px'; + notesElement.style.bottom = ( notesSpacing - top ) + 'px'; + notesElement.style.width = ( pageWidth - notesSpacing*2 ) + 'px'; + slide.appendChild( notesElement ); + } + } + } // Inject slide numbers if `slideNumbers` are enabled -- cgit v1.2.3 From 8162855d23601e66a25ba79dd4013ef416c4f1b4 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 10 Jun 2016 10:58:40 +0200 Subject: increase default font sizes, adjust config defaults for less margings and larger max scale #1605 --- css/theme/beige.css | 2 +- css/theme/black.css | 2 +- css/theme/blood.css | 2 +- css/theme/league.css | 2 +- css/theme/moon.css | 2 +- css/theme/night.css | 2 +- css/theme/serif.css | 2 +- css/theme/simple.css | 2 +- css/theme/sky.css | 2 +- css/theme/solarized.css | 2 +- css/theme/source/black.scss | 2 +- css/theme/source/blood.scss | 1 - css/theme/source/night.scss | 1 - css/theme/source/white.scss | 2 +- css/theme/template/settings.scss | 2 +- css/theme/white.css | 2 +- demo.html | 2 ++ js/reveal.js | 4 ++-- 18 files changed, 18 insertions(+), 18 deletions(-) (limited to 'css') diff --git a/css/theme/beige.css b/css/theme/beige.css index 7f71dd9..7424a05 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -20,7 +20,7 @@ body { .reveal { font-family: "Lato", sans-serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #333; } diff --git a/css/theme/black.css b/css/theme/black.css index 9228c46..96e4fd4 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -16,7 +16,7 @@ body { .reveal { font-family: "Source Sans Pro", Helvetica, sans-serif; - font-size: 38px; + font-size: 42px; font-weight: normal; color: #fff; } diff --git a/css/theme/blood.css b/css/theme/blood.css index 2da8d68..1e0fbaf 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -19,7 +19,7 @@ body { .reveal { font-family: Ubuntu, "sans-serif"; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #eee; } diff --git a/css/theme/league.css b/css/theme/league.css index aa5bee5..63711c3 100644 --- a/css/theme/league.css +++ b/css/theme/league.css @@ -22,7 +22,7 @@ body { .reveal { font-family: "Lato", sans-serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #eee; } diff --git a/css/theme/moon.css b/css/theme/moon.css index 5cb1176..791a4a0 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -20,7 +20,7 @@ body { .reveal { font-family: "Lato", sans-serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #93a1a1; } diff --git a/css/theme/night.css b/css/theme/night.css index cf2c7a7..3db1175 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -14,7 +14,7 @@ body { .reveal { font-family: "Open Sans", sans-serif; - font-size: 30px; + font-size: 40px; font-weight: normal; color: #eee; } diff --git a/css/theme/serif.css b/css/theme/serif.css index bbb9f7e..e9b08c6 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -16,7 +16,7 @@ body { .reveal { font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #000; } diff --git a/css/theme/simple.css b/css/theme/simple.css index cb840d9..f64343e 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -19,7 +19,7 @@ body { .reveal { font-family: "Lato", sans-serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #000; } diff --git a/css/theme/sky.css b/css/theme/sky.css index 202ade8..33689eb 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -23,7 +23,7 @@ body { .reveal { font-family: "Open Sans", sans-serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #333; } diff --git a/css/theme/solarized.css b/css/theme/solarized.css index 44771dc..9bd21aa 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -20,7 +20,7 @@ body { .reveal { font-family: "Lato", sans-serif; - font-size: 36px; + font-size: 40px; font-weight: normal; color: #657b83; } diff --git a/css/theme/source/black.scss b/css/theme/source/black.scss index 5f7f601..84e8d9a 100644 --- a/css/theme/source/black.scss +++ b/css/theme/source/black.scss @@ -21,7 +21,7 @@ $backgroundColor: #222; $mainColor: #fff; $headingColor: #fff; -$mainFontSize: 38px; +$mainFontSize: 42px; $mainFont: 'Source Sans Pro', Helvetica, sans-serif; $headingFont: 'Source Sans Pro', Helvetica, sans-serif; $headingTextShadow: none; diff --git a/css/theme/source/blood.scss b/css/theme/source/blood.scss index d22b53d..4533fc0 100644 --- a/css/theme/source/blood.scss +++ b/css/theme/source/blood.scss @@ -28,7 +28,6 @@ $backgroundColor: $coal; // Main text $mainFont: Ubuntu, 'sans-serif'; -$mainFontSize: 36px; $mainColor: #eee; // Headings diff --git a/css/theme/source/night.scss b/css/theme/source/night.scss index b0cb57f..d49a282 100644 --- a/css/theme/source/night.scss +++ b/css/theme/source/night.scss @@ -27,7 +27,6 @@ $headingTextShadow: none; $headingLetterSpacing: -0.03em; $headingTextTransform: none; $selectionBackgroundColor: #e7ad52; -$mainFontSize: 30px; // Theme template ------------------------------ diff --git a/css/theme/source/white.scss b/css/theme/source/white.scss index 6758ce0..7f06ffd 100644 --- a/css/theme/source/white.scss +++ b/css/theme/source/white.scss @@ -21,7 +21,7 @@ $backgroundColor: #fff; $mainColor: #222; $headingColor: #222; -$mainFontSize: 38px; +$mainFontSize: 42px; $mainFont: 'Source Sans Pro', Helvetica, sans-serif; $headingFont: 'Source Sans Pro', Helvetica, sans-serif; $headingTextShadow: none; diff --git a/css/theme/template/settings.scss b/css/theme/template/settings.scss index ffaac23..63c02cf 100644 --- a/css/theme/template/settings.scss +++ b/css/theme/template/settings.scss @@ -6,7 +6,7 @@ $backgroundColor: #2b2b2b; // Primary/body text $mainFont: 'Lato', sans-serif; -$mainFontSize: 36px; +$mainFontSize: 40px; $mainColor: #eee; // Vertical spacing between blocks of text diff --git a/css/theme/white.css b/css/theme/white.css index 16a1d23..7adc605 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -16,7 +16,7 @@ body { .reveal { font-family: "Source Sans Pro", Helvetica, sans-serif; - font-size: 38px; + font-size: 42px; font-weight: normal; color: #222; } diff --git a/demo.html b/demo.html index 36ad224..632e8d6 100644 --- a/demo.html +++ b/demo.html @@ -391,6 +391,8 @@ Reveal.addEventListener( 'customevent', function() { history: true, center: true, + width: 1000, + transition: 'slide', // none/fade/slide/convex/concave/zoom // More info https://github.com/hakimel/reveal.js#dependencies diff --git a/js/reveal.js b/js/reveal.js index 3de52c5..4999bdb 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -43,11 +43,11 @@ height: 700, // Factor of the display size that should remain empty around the content - margin: 0.1, + margin: 0.04, // Bounds for smallest/largest possible scale to apply to content minScale: 0.2, - maxScale: 1.5, + maxScale: 2.0, // Display controls in the bottom right corner controls: true, -- cgit v1.2.3 From b7e0d9b1c79a475249777d734a9675b1ba03a47a Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 20 Jun 2016 10:27:04 +0200 Subject: fix theme backgrounds in firefox fullscreen mode #1386 --- css/reveal.css | 6 ------ css/reveal.scss | 9 --------- css/theme/beige.css | 20 ++++++++++++++++++++ css/theme/black.css | 8 ++++++++ css/theme/blood.css | 8 ++++++++ css/theme/league.css | 20 ++++++++++++++++++++ css/theme/moon.css | 8 ++++++++ css/theme/night.css | 8 ++++++++ css/theme/serif.css | 8 ++++++++ css/theme/simple.css | 8 ++++++++ css/theme/sky.css | 20 ++++++++++++++++++++ css/theme/solarized.css | 8 ++++++++ css/theme/template/theme.scss | 11 +++++++++++ css/theme/white.css | 8 ++++++++ 14 files changed, 135 insertions(+), 15 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index b203074..778076e 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -47,12 +47,6 @@ body { background-color: #fff; color: #000; } -html:-webkit-full-screen-ancestor { - background-color: inherit; } - -html:-moz-full-screen-ancestor { - background-color: inherit; } - /********************************************* * VIEW FRAGMENTS *********************************************/ diff --git a/css/reveal.scss b/css/reveal.scss index f8d6904..9045428 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -57,15 +57,6 @@ body { color: #000; } -// Ensures that the main background color matches the -// theme in fullscreen mode -html:-webkit-full-screen-ancestor { - background-color: inherit; -} -html:-moz-full-screen-ancestor { - background-color: inherit; -} - /********************************************* * VIEW FRAGMENTS diff --git a/css/theme/beige.css b/css/theme/beige.css index 7424a05..d2caeb8 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -18,6 +18,26 @@ body { background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); background-color: #f7f3de; } +html:-webkit-full-screen-ancestor { + background: #f7f2d3; + background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3)); + background: -webkit-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background-color: #f7f3de; } + +html:-moz-full-screen-ancestor { + background: #f7f2d3; + background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3)); + background: -webkit-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); + background-color: #f7f3de; } + .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/black.css b/css/theme/black.css index 96e4fd4..635a2b1 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -14,6 +14,14 @@ body { background: #222; background-color: #222; } +html:-webkit-full-screen-ancestor { + background: #222; + background-color: #222; } + +html:-moz-full-screen-ancestor { + background: #222; + background-color: #222; } + .reveal { font-family: "Source Sans Pro", Helvetica, sans-serif; font-size: 42px; diff --git a/css/theme/blood.css b/css/theme/blood.css index 1e0fbaf..5a1cee5 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -17,6 +17,14 @@ body { background: #222; background-color: #222; } +html:-webkit-full-screen-ancestor { + background: #222; + background-color: #222; } + +html:-moz-full-screen-ancestor { + background: #222; + background-color: #222; } + .reveal { font-family: Ubuntu, "sans-serif"; font-size: 40px; diff --git a/css/theme/league.css b/css/theme/league.css index 63711c3..6359446 100644 --- a/css/theme/league.css +++ b/css/theme/league.css @@ -20,6 +20,26 @@ body { background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); background-color: #2b2b2b; } +html:-webkit-full-screen-ancestor { + background: #1c1e20; + background: -moz-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #555a5f), color-stop(100%, #1c1e20)); + background: -webkit-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: -o-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: -ms-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background-color: #2b2b2b; } + +html:-moz-full-screen-ancestor { + background: #1c1e20; + background: -moz-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #555a5f), color-stop(100%, #1c1e20)); + background: -webkit-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: -o-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: -ms-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); + background-color: #2b2b2b; } + .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/moon.css b/css/theme/moon.css index 791a4a0..e6831b0 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -18,6 +18,14 @@ body { background: #002b36; background-color: #002b36; } +html:-webkit-full-screen-ancestor { + background: #002b36; + background-color: #002b36; } + +html:-moz-full-screen-ancestor { + background: #002b36; + background-color: #002b36; } + .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/night.css b/css/theme/night.css index 3db1175..6ad1089 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -12,6 +12,14 @@ body { background: #111; background-color: #111; } +html:-webkit-full-screen-ancestor { + background: #111; + background-color: #111; } + +html:-moz-full-screen-ancestor { + background: #111; + background-color: #111; } + .reveal { font-family: "Open Sans", sans-serif; font-size: 40px; diff --git a/css/theme/serif.css b/css/theme/serif.css index e9b08c6..60654ef 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -14,6 +14,14 @@ body { background: #F0F1EB; background-color: #F0F1EB; } +html:-webkit-full-screen-ancestor { + background: #F0F1EB; + background-color: #F0F1EB; } + +html:-moz-full-screen-ancestor { + background: #F0F1EB; + background-color: #F0F1EB; } + .reveal { font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif; font-size: 40px; diff --git a/css/theme/simple.css b/css/theme/simple.css index f64343e..86f6af6 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -17,6 +17,14 @@ body { background: #fff; background-color: #fff; } +html:-webkit-full-screen-ancestor { + background: #fff; + background-color: #fff; } + +html:-moz-full-screen-ancestor { + background: #fff; + background-color: #fff; } + .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/sky.css b/css/theme/sky.css index 33689eb..6ee8cde 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -21,6 +21,26 @@ body { background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); background-color: #f7fbfc; } +html:-webkit-full-screen-ancestor { + background: #add9e4; + background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #add9e4)); + background: -webkit-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background-color: #f7fbfc; } + +html:-moz-full-screen-ancestor { + background: #add9e4; + background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #add9e4)); + background: -webkit-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); + background-color: #f7fbfc; } + .reveal { font-family: "Open Sans", sans-serif; font-size: 40px; diff --git a/css/theme/solarized.css b/css/theme/solarized.css index 9bd21aa..d554ca9 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -18,6 +18,14 @@ body { background: #fdf6e3; background-color: #fdf6e3; } +html:-webkit-full-screen-ancestor { + background: #fdf6e3; + background-color: #fdf6e3; } + +html:-moz-full-screen-ancestor { + background: #fdf6e3; + background-color: #fdf6e3; } + .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index bcbaf0c..8d4b8a7 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -9,6 +9,17 @@ body { background-color: $backgroundColor; } +// Ensures that the main background color matches the +// theme in fullscreen mode +html:-webkit-full-screen-ancestor { + @include bodyBackground(); + background-color: $backgroundColor; +} +html:-moz-full-screen-ancestor { + @include bodyBackground(); + background-color: $backgroundColor; +} + .reveal { font-family: $mainFont; font-size: $mainFontSize; diff --git a/css/theme/white.css b/css/theme/white.css index 7adc605..1048a6e 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -14,6 +14,14 @@ body { background: #fff; background-color: #fff; } +html:-webkit-full-screen-ancestor { + background: #fff; + background-color: #fff; } + +html:-moz-full-screen-ancestor { + background: #fff; + background-color: #fff; } + .reveal { font-family: "Source Sans Pro", Helvetica, sans-serif; font-size: 42px; -- cgit v1.2.3 From ce777e4c4b5517bf2210bc9839909413a48f42fa Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 21 Jun 2016 11:27:24 +0200 Subject: Revert "fix theme backgrounds in firefox fullscreen mode #1386" This reverts commit b7e0d9b1c79a475249777d734a9675b1ba03a47a. --- css/reveal.css | 6 ++++++ css/reveal.scss | 9 +++++++++ css/theme/beige.css | 20 -------------------- css/theme/black.css | 8 -------- css/theme/blood.css | 8 -------- css/theme/league.css | 20 -------------------- css/theme/moon.css | 8 -------- css/theme/night.css | 8 -------- css/theme/serif.css | 8 -------- css/theme/simple.css | 8 -------- css/theme/sky.css | 20 -------------------- css/theme/solarized.css | 8 -------- css/theme/template/theme.scss | 11 ----------- css/theme/white.css | 8 -------- 14 files changed, 15 insertions(+), 135 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index 778076e..b203074 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -47,6 +47,12 @@ body { background-color: #fff; color: #000; } +html:-webkit-full-screen-ancestor { + background-color: inherit; } + +html:-moz-full-screen-ancestor { + background-color: inherit; } + /********************************************* * VIEW FRAGMENTS *********************************************/ diff --git a/css/reveal.scss b/css/reveal.scss index 9045428..f8d6904 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -57,6 +57,15 @@ body { color: #000; } +// Ensures that the main background color matches the +// theme in fullscreen mode +html:-webkit-full-screen-ancestor { + background-color: inherit; +} +html:-moz-full-screen-ancestor { + background-color: inherit; +} + /********************************************* * VIEW FRAGMENTS diff --git a/css/theme/beige.css b/css/theme/beige.css index d2caeb8..7424a05 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -18,26 +18,6 @@ body { background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); background-color: #f7f3de; } -html:-webkit-full-screen-ancestor { - background: #f7f2d3; - background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3)); - background: -webkit-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background-color: #f7f3de; } - -html:-moz-full-screen-ancestor { - background: #f7f2d3; - background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3)); - background: -webkit-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%); - background-color: #f7f3de; } - .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/black.css b/css/theme/black.css index 635a2b1..96e4fd4 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -14,14 +14,6 @@ body { background: #222; background-color: #222; } -html:-webkit-full-screen-ancestor { - background: #222; - background-color: #222; } - -html:-moz-full-screen-ancestor { - background: #222; - background-color: #222; } - .reveal { font-family: "Source Sans Pro", Helvetica, sans-serif; font-size: 42px; diff --git a/css/theme/blood.css b/css/theme/blood.css index 5a1cee5..1e0fbaf 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -17,14 +17,6 @@ body { background: #222; background-color: #222; } -html:-webkit-full-screen-ancestor { - background: #222; - background-color: #222; } - -html:-moz-full-screen-ancestor { - background: #222; - background-color: #222; } - .reveal { font-family: Ubuntu, "sans-serif"; font-size: 40px; diff --git a/css/theme/league.css b/css/theme/league.css index 6359446..63711c3 100644 --- a/css/theme/league.css +++ b/css/theme/league.css @@ -20,26 +20,6 @@ body { background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); background-color: #2b2b2b; } -html:-webkit-full-screen-ancestor { - background: #1c1e20; - background: -moz-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #555a5f), color-stop(100%, #1c1e20)); - background: -webkit-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: -o-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: -ms-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background-color: #2b2b2b; } - -html:-moz-full-screen-ancestor { - background: #1c1e20; - background: -moz-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #555a5f), color-stop(100%, #1c1e20)); - background: -webkit-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: -o-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: -ms-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%); - background-color: #2b2b2b; } - .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/moon.css b/css/theme/moon.css index e6831b0..791a4a0 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -18,14 +18,6 @@ body { background: #002b36; background-color: #002b36; } -html:-webkit-full-screen-ancestor { - background: #002b36; - background-color: #002b36; } - -html:-moz-full-screen-ancestor { - background: #002b36; - background-color: #002b36; } - .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/night.css b/css/theme/night.css index 6ad1089..3db1175 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -12,14 +12,6 @@ body { background: #111; background-color: #111; } -html:-webkit-full-screen-ancestor { - background: #111; - background-color: #111; } - -html:-moz-full-screen-ancestor { - background: #111; - background-color: #111; } - .reveal { font-family: "Open Sans", sans-serif; font-size: 40px; diff --git a/css/theme/serif.css b/css/theme/serif.css index 60654ef..e9b08c6 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -14,14 +14,6 @@ body { background: #F0F1EB; background-color: #F0F1EB; } -html:-webkit-full-screen-ancestor { - background: #F0F1EB; - background-color: #F0F1EB; } - -html:-moz-full-screen-ancestor { - background: #F0F1EB; - background-color: #F0F1EB; } - .reveal { font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif; font-size: 40px; diff --git a/css/theme/simple.css b/css/theme/simple.css index 86f6af6..f64343e 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -17,14 +17,6 @@ body { background: #fff; background-color: #fff; } -html:-webkit-full-screen-ancestor { - background: #fff; - background-color: #fff; } - -html:-moz-full-screen-ancestor { - background: #fff; - background-color: #fff; } - .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/sky.css b/css/theme/sky.css index 6ee8cde..33689eb 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -21,26 +21,6 @@ body { background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); background-color: #f7fbfc; } -html:-webkit-full-screen-ancestor { - background: #add9e4; - background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #add9e4)); - background: -webkit-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background-color: #f7fbfc; } - -html:-moz-full-screen-ancestor { - background: #add9e4; - background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #add9e4)); - background: -webkit-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%); - background-color: #f7fbfc; } - .reveal { font-family: "Open Sans", sans-serif; font-size: 40px; diff --git a/css/theme/solarized.css b/css/theme/solarized.css index d554ca9..9bd21aa 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -18,14 +18,6 @@ body { background: #fdf6e3; background-color: #fdf6e3; } -html:-webkit-full-screen-ancestor { - background: #fdf6e3; - background-color: #fdf6e3; } - -html:-moz-full-screen-ancestor { - background: #fdf6e3; - background-color: #fdf6e3; } - .reveal { font-family: "Lato", sans-serif; font-size: 40px; diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index 8d4b8a7..bcbaf0c 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -9,17 +9,6 @@ body { background-color: $backgroundColor; } -// Ensures that the main background color matches the -// theme in fullscreen mode -html:-webkit-full-screen-ancestor { - @include bodyBackground(); - background-color: $backgroundColor; -} -html:-moz-full-screen-ancestor { - @include bodyBackground(); - background-color: $backgroundColor; -} - .reveal { font-family: $mainFont; font-size: $mainFontSize; diff --git a/css/theme/white.css b/css/theme/white.css index 1048a6e..7adc605 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -14,14 +14,6 @@ body { background: #fff; background-color: #fff; } -html:-webkit-full-screen-ancestor { - background: #fff; - background-color: #fff; } - -html:-moz-full-screen-ancestor { - background: #fff; - background-color: #fff; } - .reveal { font-family: "Source Sans Pro", Helvetica, sans-serif; font-size: 42px; -- cgit v1.2.3 From a12a17b2d7053fad006ae9914309e8fb56c44329 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 21 Jun 2016 11:30:12 +0200 Subject: request fullscreen on documentElement instead of body (#1621 #1624) --- css/reveal.css | 6 ------ css/reveal.scss | 9 --------- js/reveal.js | 4 ++-- 3 files changed, 2 insertions(+), 17 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index b203074..778076e 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -47,12 +47,6 @@ body { background-color: #fff; color: #000; } -html:-webkit-full-screen-ancestor { - background-color: inherit; } - -html:-moz-full-screen-ancestor { - background-color: inherit; } - /********************************************* * VIEW FRAGMENTS *********************************************/ diff --git a/css/reveal.scss b/css/reveal.scss index f8d6904..9045428 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -57,15 +57,6 @@ body { color: #000; } -// Ensures that the main background color matches the -// theme in fullscreen mode -html:-webkit-full-screen-ancestor { - background-color: inherit; -} -html:-moz-full-screen-ancestor { - background-color: inherit; -} - /********************************************* * VIEW FRAGMENTS diff --git a/js/reveal.js b/js/reveal.js index 4999bdb..d8cc4fc 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1980,10 +1980,10 @@ */ function enterFullscreen() { - var element = document.body; + var element = document.documentElement; // Check which implementation is available - var requestMethod = element.requestFullScreen || + var requestMethod = element.requestFullscreen || element.webkitRequestFullscreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || -- cgit v1.2.3 From bc4fc65da475b1234b32c9eb5070138218abff76 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 1 Aug 2016 09:15:34 +0200 Subject: none/fade/slide transitions use flat transform style, prevents blurred content #1002 --- css/reveal.css | 27 +++++++++++++++++++++++---- css/reveal.scss | 12 +++++++++++- 2 files changed, 34 insertions(+), 5 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index 778076e..fae8123 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -341,8 +341,8 @@ body { width: 100%; padding: 20px 0px; z-index: 10; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; + -webkit-transform-style: flat; + transform-style: flat; -webkit-transition: -webkit-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), -webkit-transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } @@ -463,6 +463,11 @@ body { * CONVEX TRANSITION * Aliased 'default' for backwards compatibility *********************************************/ +.reveal .slides section[data-transition=default], +.reveal.default .slides section:not([data-transition]) { + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; } + .reveal .slides > section[data-transition=default].past, .reveal .slides > section[data-transition~=default-out].past, .reveal.default .slides > section:not([data-transition]).past { @@ -487,6 +492,11 @@ body { -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } +.reveal .slides section[data-transition=convex], +.reveal.convex .slides section:not([data-transition]) { + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; } + .reveal .slides > section[data-transition=convex].past, .reveal .slides > section[data-transition~=convex-out].past, .reveal.convex .slides > section:not([data-transition]).past { @@ -514,6 +524,11 @@ body { /********************************************* * CONCAVE TRANSITION *********************************************/ +.reveal .slides section[data-transition=concave], +.reveal.concave .slides section:not([data-transition]) { + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; } + .reveal .slides > section[data-transition=concave].past, .reveal .slides > section[data-transition~=concave-out].past, .reveal.concave .slides > section:not([data-transition]).past { @@ -584,7 +599,9 @@ body { min-height: 700px; -webkit-backface-visibility: hidden; backface-visibility: hidden; - box-sizing: border-box; } + box-sizing: border-box; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; } .reveal.center.cube .slides section { min-height: 0; } @@ -657,7 +674,9 @@ body { .reveal.page .slides section { padding: 30px; min-height: 700px; - box-sizing: border-box; } + box-sizing: border-box; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; } .reveal.page .slides section.past { z-index: 12; } diff --git a/css/reveal.scss b/css/reveal.scss index 9045428..c888a27 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -408,7 +408,7 @@ body { padding: 20px 0px; z-index: 10; - transform-style: preserve-3d; + transform-style: flat; transition: transform-origin 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), transform 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), visibility 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985), @@ -539,6 +539,10 @@ body { *********************************************/ @each $stylename in default, convex { + @include transition-global(#{$stylename}) { + transform-style: preserve-3d; + } + @include transition-horizontal-past(#{$stylename}) { transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } @@ -557,6 +561,10 @@ body { * CONCAVE TRANSITION *********************************************/ +@include transition-global(concave) { + transform-style: preserve-3d; +} + @include transition-horizontal-past(concave) { transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } @@ -607,6 +615,7 @@ body { min-height: 700px; backface-visibility: hidden; box-sizing: border-box; + transform-style: preserve-3d; } .reveal.center.cube .slides section { min-height: 0; @@ -678,6 +687,7 @@ body { padding: 30px; min-height: 700px; box-sizing: border-box; + transform-style: preserve-3d; } .reveal.page .slides section.past { z-index: 12; -- cgit v1.2.3 From 0b9233cf4a1a53297356cbc834c2240a92d20545 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 5 Oct 2016 14:00:40 +0200 Subject: attempt at fixing ff transition bug #1627 --- css/reveal.css | 12 ++++++------ css/reveal.scss | 10 ++++++++-- 2 files changed, 14 insertions(+), 8 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index fae8123..c879c03 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -463,8 +463,8 @@ body { * CONVEX TRANSITION * Aliased 'default' for backwards compatibility *********************************************/ -.reveal .slides section[data-transition=default], -.reveal.default .slides section:not([data-transition]) { +.reveal .slides section[data-transition=default].stack, +.reveal.default .slides section.stack { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } @@ -492,8 +492,8 @@ body { -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } -.reveal .slides section[data-transition=convex], -.reveal.convex .slides section:not([data-transition]) { +.reveal .slides section[data-transition=convex].stack, +.reveal.convex .slides section.stack { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } @@ -524,8 +524,8 @@ body { /********************************************* * CONCAVE TRANSITION *********************************************/ -.reveal .slides section[data-transition=concave], -.reveal.concave .slides section:not([data-transition]) { +.reveal .slides section[data-transition=concave].stack, +.reveal.concave .slides section.stack { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } diff --git a/css/reveal.scss b/css/reveal.scss index c888a27..c5ff05a 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -480,6 +480,12 @@ body { @content; } } +@mixin transition-stack($style) { + .reveal .slides section[data-transition=#{$style}].stack, + .reveal.#{$style} .slides section.stack { + @content; + } +} @mixin transition-horizontal-past($style) { .reveal .slides>section[data-transition=#{$style}].past, .reveal .slides>section[data-transition~=#{$style}-out].past, @@ -539,7 +545,7 @@ body { *********************************************/ @each $stylename in default, convex { - @include transition-global(#{$stylename}) { + @include transition-stack(#{$stylename}) { transform-style: preserve-3d; } @@ -561,7 +567,7 @@ body { * CONCAVE TRANSITION *********************************************/ -@include transition-global(concave) { +@include transition-stack(concave) { transform-style: preserve-3d; } -- cgit v1.2.3 From 7547b893d4421c193974a9e68989cfa20669ac11 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 10 Oct 2016 12:11:27 +0200 Subject: fixes ff overview rendering bug #1649 --- css/reveal.css | 5 ++++- css/reveal.scss | 10 ++++++++++ 2 files changed, 14 insertions(+), 1 deletion(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index c879c03..dbabfcb 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -1001,6 +1001,8 @@ body { perspective-origin: 50% 50%; -webkit-perspective: 700px; perspective: 700px; } + .reveal.overview .slides { + -moz-transform-style: preserve-3d; } .reveal.overview .slides section { height: 100%; top: 0 !important; @@ -1028,7 +1030,8 @@ body { overflow: visible; } .reveal.overview .backgrounds { -webkit-perspective: inherit; - perspective: inherit; } + perspective: inherit; + -moz-transform-style: preserve-3d; } .reveal.overview .backgrounds .slide-background { opacity: 1; visibility: visible; diff --git a/css/reveal.scss b/css/reveal.scss index c5ff05a..f6a37ad 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1028,6 +1028,12 @@ body { perspective-origin: 50% 50%; perspective: 700px; + .slides { + // Fixes overview rendering errors in FF48+, not applied to + // other browsers since it degrades performance + -moz-transform-style: preserve-3d; + } + .slides section { height: 100%; top: 0 !important; @@ -1060,6 +1066,10 @@ body { .backgrounds { perspective: inherit; + + // Fixes overview rendering errors in FF48+, not applied to + // other browsers since it degrades performance + -moz-transform-style: preserve-3d; } .backgrounds .slide-background { -- cgit v1.2.3 From 659822a8b50f501c68204e957df2d99be7693d01 Mon Sep 17 00:00:00 2001 From: christikaes Date: Sun, 30 Oct 2016 11:31:20 -0400 Subject: Hide slide number when in paper or pdf print view --- css/print/paper.css | 5 +++-- css/print/pdf.css | 3 ++- 2 files changed, 5 insertions(+), 3 deletions(-) (limited to 'css') diff --git a/css/print/paper.css b/css/print/paper.css index 6588f48..27d19dd 100644 --- a/css/print/paper.css +++ b/css/print/paper.css @@ -38,7 +38,8 @@ .share-reveal, .state-background, .reveal .progress, - .reveal .backgrounds { + .reveal .backgrounds, + .reveal .slide-number { display: none !important; } @@ -199,4 +200,4 @@ font-size: 0.8em; } -} \ No newline at end of file +} diff --git a/css/print/pdf.css b/css/print/pdf.css index 4bfcddc..e114ca8 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -31,7 +31,8 @@ html { .reveal.overview, .fork-reveal, .share-reveal, -.state-background { +.state-background, +.reveal .slide-number { display: none !important; } -- cgit v1.2.3 From 80e28774dd52e731804a41adfe8d03bd8739851f Mon Sep 17 00:00:00 2001 From: Christi Kaes Date: Sun, 30 Oct 2016 14:11:10 -0400 Subject: Don't remove slide-number in pdf view --- css/print/pdf.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'css') diff --git a/css/print/pdf.css b/css/print/pdf.css index e114ca8..4bfcddc 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -31,8 +31,7 @@ html { .reveal.overview, .fork-reveal, .share-reveal, -.state-background, -.reveal .slide-number { +.state-background { display: none !important; } -- cgit v1.2.3 From f2bd9d297018e1af97ebee147a8824bfb61c2bed Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 13 Dec 2016 16:16:51 +0100 Subject: don't show error message while iframe fades in #1577 --- css/reveal.css | 18 ++++++++++++++++++ css/reveal.scss | 10 +++++++++- js/reveal.js | 2 +- 3 files changed, 28 insertions(+), 2 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index dbabfcb..80c1786 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -1140,6 +1140,7 @@ body { display: inline-block; width: 40px; height: 40px; + line-height: 36px; padding: 0 10px; float: right; opacity: 0.6; @@ -1188,6 +1189,23 @@ body { opacity: 1; visibility: visible; } +.reveal .overlay.overlay-preview.loaded .viewport-inner { + position: absolute; + z-index: -1; + left: 0; + top: 45%; + width: 100%; + text-align: center; + letter-spacing: normal; } + +.reveal .overlay.overlay-preview .x-frame-error { + opacity: 0; + -webkit-transition: opacity 0.3s ease 0.3s; + transition: opacity 0.3s ease 0.3s; } + +.reveal .overlay.overlay-preview.loaded .x-frame-error { + opacity: 1; } + .reveal .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; diff --git a/css/reveal.scss b/css/reveal.scss index 321b3f9..fa7f20d 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1195,6 +1195,7 @@ body { display: inline-block; width: 40px; height: 40px; + line-height: 36px; padding: 0 10px; float: right; opacity: 0.6; @@ -1250,11 +1251,18 @@ body { position: absolute; z-index: -1; left: 0; - top: 60px; + top: 45%; width: 100%; text-align: center; letter-spacing: normal; } + .reveal .overlay.overlay-preview .x-frame-error { + opacity: 0; + transition: opacity 0.3s ease 0.3s; + } + .reveal .overlay.overlay-preview.loaded .x-frame-error { + opacity: 1; + } .reveal .overlay.overlay-preview.loaded .spinner { opacity: 0; diff --git a/js/reveal.js b/js/reveal.js index e9dba2e..7a4bc9e 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1604,7 +1604,7 @@ ' ' ].join(''); -- cgit v1.2.3 From 97bb6e9b584f6b4eee33c91e04e5a40da358b7cd Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 15 Dec 2016 14:06:17 +0100 Subject: fragments inherit visibility to avoid conflicts with parent slide visibility --- css/reveal.css | 18 +++++++++--------- css/reveal.scss | 18 +++++++++--------- 2 files changed, 18 insertions(+), 18 deletions(-) (limited to 'css') diff --git a/css/reveal.css b/css/reveal.css index 80c1786..430dcde 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -57,18 +57,18 @@ body { transition: all .2s ease; } .reveal .slides section .fragment.visible { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.grow { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.grow.visible { -webkit-transform: scale(1.3); transform: scale(1.3); } .reveal .slides section .fragment.shrink { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.shrink.visible { -webkit-transform: scale(0.7); transform: scale(0.7); } @@ -82,21 +82,21 @@ body { .reveal .slides section .fragment.fade-out { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.fade-out.visible { opacity: 0; visibility: hidden; } .reveal .slides section .fragment.semi-fade-out { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.semi-fade-out.visible { opacity: 0.5; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.strike { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.strike.visible { text-decoration: line-through; } @@ -133,7 +133,7 @@ body { visibility: hidden; } .reveal .slides section .fragment.current-visible.current-fragment { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.highlight-red, .reveal .slides section .fragment.highlight-current-red, @@ -142,7 +142,7 @@ body { .reveal .slides section .fragment.highlight-blue, .reveal .slides section .fragment.highlight-current-blue { opacity: 1; - visibility: visible; } + visibility: inherit; } .reveal .slides section .fragment.highlight-red.visible { color: #ff2c2d; } diff --git a/css/reveal.scss b/css/reveal.scss index fa7f20d..22fb3fe 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -69,13 +69,13 @@ body { &.visible { opacity: 1; - visibility: visible; + visibility: inherit; } } .reveal .slides section .fragment.grow { opacity: 1; - visibility: visible; + visibility: inherit; &.visible { transform: scale( 1.3 ); @@ -84,7 +84,7 @@ body { .reveal .slides section .fragment.shrink { opacity: 1; - visibility: visible; + visibility: inherit; &.visible { transform: scale( 0.7 ); @@ -101,7 +101,7 @@ body { .reveal .slides section .fragment.fade-out { opacity: 1; - visibility: visible; + visibility: inherit; &.visible { opacity: 0; @@ -111,17 +111,17 @@ body { .reveal .slides section .fragment.semi-fade-out { opacity: 1; - visibility: visible; + visibility: inherit; &.visible { opacity: 0.5; - visibility: visible; + visibility: inherit; } } .reveal .slides section .fragment.strike { opacity: 1; - visibility: visible; + visibility: inherit; &.visible { text-decoration: line-through; @@ -166,7 +166,7 @@ body { &.current-fragment { opacity: 1; - visibility: visible; + visibility: inherit; } } @@ -177,7 +177,7 @@ body { .reveal .slides section .fragment.highlight-blue, .reveal .slides section .fragment.highlight-current-blue { opacity: 1; - visibility: visible; + visibility: inherit; } .reveal .slides section .fragment.highlight-red.visible { color: #ff2c2d -- cgit v1.2.3