From a61a372b5215fbdf1fa3bab5a4c21ca511bfbe07 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 16 Oct 2014 12:19:20 +0200 Subject: use nesting for fragment styles --- css/reveal.scss | 54 +++++++++++++++++++++++++++++++----------------------- 1 file changed, 31 insertions(+), 23 deletions(-) (limited to 'css/reveal.scss') diff --git a/css/reveal.scss b/css/reveal.scss index 0d1fb82..b07643b 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -78,69 +78,84 @@ body { opacity: 0; visibility: hidden; transition: all .2s ease; -} - .reveal .slides section .fragment.visible { + + &.visible { opacity: 1; visibility: visible; } +} .reveal .slides section .fragment.grow { opacity: 1; visibility: visible; -} - .reveal .slides section .fragment.grow.visible { + + &.visible { transform: scale( 1.3 ); } +} .reveal .slides section .fragment.shrink { opacity: 1; visibility: visible; -} - .reveal .slides section .fragment.shrink.visible { + + &.visible { transform: scale( 0.7 ); } +} .reveal .slides section .fragment.zoom-in { transform: scale( 0.1 ); -} - .reveal .slides section .fragment.zoom-in.visible { + &.visible { transform: scale( 1 ); } +} .reveal .slides section .fragment.roll-in { transform: rotateX( 90deg ); -} - .reveal .slides section .fragment.roll-in.visible { + + &.visible { transform: rotateX( 0 ); } +} .reveal .slides section .fragment.fade-out { opacity: 1; visibility: visible; -} - .reveal .slides section .fragment.fade-out.visible { + + &.visible { opacity: 0; visibility: hidden; } +} .reveal .slides section .fragment.semi-fade-out { opacity: 1; visibility: visible; -} - .reveal .slides section .fragment.semi-fade-out.visible { + + &.visible { opacity: 0.5; visibility: visible; } +} + +.reveal .slides section .fragment.strike { + opacity: 1; + + &.visible { + text-decoration: line-through; + } +} .reveal .slides section .fragment.current-visible { opacity: 0; visibility: hidden; -} - .reveal .slides section .fragment.current-visible.current-fragment { + + &.current-fragment { opacity: 1; visibility: visible; } +} .reveal .slides section .fragment.highlight-red, .reveal .slides section .fragment.highlight-current-red, @@ -171,13 +186,6 @@ body { color: #1b91ff; } -.reveal .slides section .fragment.strike { - opacity: 1; -} - .reveal .slides section .fragment.strike.visible { - text-decoration: line-through; - } - /********************************************* * DEFAULT ELEMENT STYLES -- cgit v1.2.3