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.scss | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'css/reveal.scss') 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