Browse Source

zoom transition now uses zooming for vertical transitions, too

Hakim El Hattab 5 years ago
parent
commit
2d57981261
2 changed files with 9 additions and 7 deletions
  1. 6 5
      css/reveal.css
  2. 3 2
      css/reveal.scss

+ 6 - 5
css/reveal.css

@@ -524,7 +524,8 @@ body {
 .reveal .slides > section.stack {
   padding-top: 0;
   padding-bottom: 0;
-  pointer-events: none; }
+  pointer-events: none;
+  height: 100%; }
 
 .reveal .slides > section.present,
 .reveal .slides > section > section.present {
@@ -741,14 +742,14 @@ body {
 .reveal .slides > section > section[data-transition=zoom].past,
 .reveal .slides > section > section[data-transition~=zoom-out].past,
 .reveal.zoom .slides > section > section:not([data-transition]).past {
-  -webkit-transform: translate(0, -150%);
-          transform: translate(0, -150%); }
+  -webkit-transform: scale(16);
+          transform: scale(16); }
 
 .reveal .slides > section > section[data-transition=zoom].future,
 .reveal .slides > section > section[data-transition~=zoom-in].future,
 .reveal.zoom .slides > section > section:not([data-transition]).future {
-  -webkit-transform: translate(0, 150%);
-          transform: translate(0, 150%); }
+  -webkit-transform: scale(0.2);
+          transform: scale(0.2); }
 
 /*********************************************
  * CUBE TRANSITION

+ 3 - 2
css/reveal.scss

@@ -627,6 +627,7 @@ $controlsArrowAngleActive: 36deg;
 	padding-top: 0;
 	padding-bottom: 0;
 	pointer-events: none;
+	height: 100%;
 }
 
 .reveal .slides>section.present,
@@ -801,10 +802,10 @@ $controlsArrowAngleActive: 36deg;
 	transform: scale(0.2);
 }
 @include transition-vertical-past(zoom) {
-	transform: translate(0, -150%);
+	transform: scale(16);
 }
 @include transition-vertical-future(zoom) {
-	transform: translate(0, 150%);
+	transform: scale(0.2);
 }