diff options
| author | Hakim El Hattab <hakim.elhattab@gmail.com> | 2016-01-08 10:39:02 +0100 |
|---|---|---|
| committer | Hakim El Hattab <hakim.elhattab@gmail.com> | 2016-01-08 10:39:02 +0100 |
| commit | 76faeccd3e50026037ddb13497fd244e52ac51fd (patch) | |
| tree | c4188293d187417991b1dc457153361b669f4250 | |
| parent | 3bb7cf528cfaa224b5b7c6fedacec2468eb951c3 (diff) | |
| parent | 2909440fde651af3a2477d0b569d3b43ba64ca6e (diff) | |
| download | fosdem-2018-presentation-76faeccd3e50026037ddb13497fd244e52ac51fd.tar fosdem-2018-presentation-76faeccd3e50026037ddb13497fd244e52ac51fd.tar.gz | |
Merge branch 'fragments' of https://github.com/kewitz/reveal.js into dev
| -rw-r--r-- | css/reveal.css | 20 | ||||
| -rw-r--r-- | css/reveal.scss | 34 | ||||
| -rw-r--r-- | index.html | 1 |
3 files changed, 53 insertions, 2 deletions
diff --git a/css/reveal.css b/css/reveal.css index 9739291..4530584 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -110,6 +110,26 @@ html:-moz-full-screen-ancestor { .reveal .slides section .fragment.strike.visible { text-decoration: line-through; } +.reveal .slides section .fragment.fade-up { + transform: translate(0, 20%); } + .reveal .slides section .fragment.fade-up.visible { + transform: translate(0, 0); } + +.reveal .slides section .fragment.fade-down { + transform: translate(0, -20%); } + .reveal .slides section .fragment.fade-down.visible { + transform: translate(0, 0); } + +.reveal .slides section .fragment.fade-right { + transform: translate(-20%, 0); } + .reveal .slides section .fragment.fade-right.visible { + transform: translate(0, 0); } + +.reveal .slides section .fragment.fade-left { + transform: translate(20%, 0); } + .reveal .slides section .fragment.fade-left.visible { + transform: translate(0, 0); } + .reveal .slides section .fragment.current-visible { opacity: 0; visibility: hidden; } diff --git a/css/reveal.scss b/css/reveal.scss index eb600ac..5a66671 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -137,6 +137,38 @@ html:-moz-full-screen-ancestor { } } +.reveal .slides section .fragment.fade-up { + transform: translate(0, 20%); + + &.visible { + transform: translate(0, 0); + } +} + +.reveal .slides section .fragment.fade-down { + transform: translate(0, -20%); + + &.visible { + transform: translate(0, 0); + } +} + +.reveal .slides section .fragment.fade-right { + transform: translate(-20%, 0); + + &.visible { + transform: translate(0, 0); + } +} + +.reveal .slides section .fragment.fade-left { + transform: translate(20%, 0); + + &.visible { + transform: translate(0, 0); + } +} + .reveal .slides section .fragment.current-visible { opacity: 0; visibility: hidden; @@ -1375,5 +1407,3 @@ html:-moz-full-screen-ancestor { .zoomed .reveal .roll span:after { visibility: hidden; } - - @@ -139,6 +139,7 @@ <p class="fragment grow">grow</p> <p class="fragment shrink">shrink</p> <p class="fragment fade-out">fade-out</p> + <p class="fragment fade-up">fade-up (also down, left and right!)</p> <p class="fragment current-visible">current-visible</p> <p class="fragment highlight-red">highlight-red</p> <p class="fragment highlight-blue">highlight-blue</p> |