diff --git a/css/reveal.css b/css/reveal.css index 1b9651b581784dacb648f6d5c1320b45d0bac4db..05d9646cc852d7f159aa6b0ef3ccc39adc888e64 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -39,22 +39,18 @@ body { opacity: 1; visibility: inherit; } .reveal .slides section .fragment.grow.visible { - -webkit-transform: scale(1.3); - transform: scale(1.3); } + transform: scale(1.3); } .reveal .slides section .fragment.shrink { opacity: 1; visibility: inherit; } .reveal .slides section .fragment.shrink.visible { - -webkit-transform: scale(0.7); - transform: scale(0.7); } + transform: scale(0.7); } .reveal .slides section .fragment.zoom-in { - -webkit-transform: scale(0.1); - transform: scale(0.1); } + transform: scale(0.1); } .reveal .slides section .fragment.zoom-in.visible { - -webkit-transform: none; - transform: none; } + transform: none; } .reveal .slides section .fragment.fade-out { opacity: 1; @@ -77,32 +73,24 @@ body { text-decoration: line-through; } .reveal .slides section .fragment.fade-up { - -webkit-transform: translate(0, 20%); - transform: translate(0, 20%); } + transform: translate(0, 20%); } .reveal .slides section .fragment.fade-up.visible { - -webkit-transform: translate(0, 0); - transform: translate(0, 0); } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-down { - -webkit-transform: translate(0, -20%); - transform: translate(0, -20%); } + transform: translate(0, -20%); } .reveal .slides section .fragment.fade-down.visible { - -webkit-transform: translate(0, 0); - transform: translate(0, 0); } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-right { - -webkit-transform: translate(-20%, 0); - transform: translate(-20%, 0); } + transform: translate(-20%, 0); } .reveal .slides section .fragment.fade-right.visible { - -webkit-transform: translate(0, 0); - transform: translate(0, 0); } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-left { - -webkit-transform: translate(20%, 0); - transform: translate(20%, 0); } + transform: translate(20%, 0); } .reveal .slides section .fragment.fade-left.visible { - -webkit-transform: translate(0, 0); - transform: translate(0, 0); } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-in-then-out, .reveal .slides section .fragment.current-visible { @@ -177,48 +165,21 @@ body { /********************************************* * CONTROLS *********************************************/ -@-webkit-keyframes bounce-right { - 0%, 10%, 25%, 40%, 50% { - -webkit-transform: translateX(0); - transform: translateX(0); } - 20% { - -webkit-transform: translateX(10px); - transform: translateX(10px); } - 30% { - -webkit-transform: translateX(-5px); - transform: translateX(-5px); } } @keyframes bounce-right { 0%, 10%, 25%, 40%, 50% { - -webkit-transform: translateX(0); - transform: translateX(0); } - 20% { - -webkit-transform: translateX(10px); - transform: translateX(10px); } - 30% { - -webkit-transform: translateX(-5px); - transform: translateX(-5px); } } - -@-webkit-keyframes bounce-down { - 0%, 10%, 25%, 40%, 50% { - -webkit-transform: translateY(0); - transform: translateY(0); } + transform: translateX(0); } 20% { - -webkit-transform: translateY(10px); - transform: translateY(10px); } + transform: translateX(10px); } 30% { - -webkit-transform: translateY(-5px); - transform: translateY(-5px); } } + transform: translateX(-5px); } } @keyframes bounce-down { 0%, 10%, 25%, 40%, 50% { - -webkit-transform: translateY(0); - transform: translateY(0); } + transform: translateY(0); } 20% { - -webkit-transform: translateY(10px); - transform: translateY(10px); } + transform: translateY(10px); } 30% { - -webkit-transform: translateY(-5px); - transform: translateY(-5px); } } + transform: translateY(-5px); } } .reveal .controls { display: none; @@ -239,9 +200,7 @@ body { outline: 0; cursor: pointer; color: currentColor; - -webkit-transform: scale(0.9999); - transform: scale(0.9999); - transition: color 0.2s ease, opacity 0.2s ease, -webkit-transform 0.2s ease; + transform: scale(0.9999); transition: color 0.2s ease, opacity 0.2s ease, transform 0.2s ease; z-index: 2; pointer-events: auto; @@ -261,66 +220,50 @@ body { border-radius: 0.25em; background-color: currentColor; transition: all 0.15s ease, background-color 0.8s ease; - -webkit-transform-origin: 0.2em 50%; - transform-origin: 0.2em 50%; + transform-origin: 0.2em 50%; will-change: transform; } .reveal .controls .controls-arrow { position: relative; width: 3.6em; height: 3.6em; } .reveal .controls .controls-arrow:before { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(45deg); - transform: translateX(0.5em) translateY(1.55em) rotate(45deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(45deg); } .reveal .controls .controls-arrow:after { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); - transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); } .reveal .controls .controls-arrow:hover:before { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(40deg); - transform: translateX(0.5em) translateY(1.55em) rotate(40deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(40deg); } .reveal .controls .controls-arrow:hover:after { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-40deg); - transform: translateX(0.5em) translateY(1.55em) rotate(-40deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(-40deg); } .reveal .controls .controls-arrow:active:before { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(36deg); - transform: translateX(0.5em) translateY(1.55em) rotate(36deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(36deg); } .reveal .controls .controls-arrow:active:after { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-36deg); - transform: translateX(0.5em) translateY(1.55em) rotate(-36deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(-36deg); } .reveal .controls .navigate-left { right: 6.4em; bottom: 3.2em; - -webkit-transform: translateX(-10px); - transform: translateX(-10px); } + transform: translateX(-10px); } .reveal .controls .navigate-right { right: 0; bottom: 3.2em; - -webkit-transform: translateX(10px); - transform: translateX(10px); } + transform: translateX(10px); } .reveal .controls .navigate-right .controls-arrow { - -webkit-transform: rotate(180deg); - transform: rotate(180deg); } + transform: rotate(180deg); } .reveal .controls .navigate-right.highlight { - -webkit-animation: bounce-right 2s 50 both ease-out; - animation: bounce-right 2s 50 both ease-out; } + animation: bounce-right 2s 50 both ease-out; } .reveal .controls .navigate-up { right: 3.2em; bottom: 6.4em; - -webkit-transform: translateY(-10px); - transform: translateY(-10px); } + transform: translateY(-10px); } .reveal .controls .navigate-up .controls-arrow { - -webkit-transform: rotate(90deg); - transform: rotate(90deg); } + transform: rotate(90deg); } .reveal .controls .navigate-down { right: 3.2em; bottom: 0; - -webkit-transform: translateY(10px); - transform: translateY(10px); } + transform: translateY(10px); } .reveal .controls .navigate-down .controls-arrow { - -webkit-transform: rotate(-90deg); - transform: rotate(-90deg); } + transform: rotate(-90deg); } .reveal .controls .navigate-down.highlight { - -webkit-animation: bounce-down 2s 50 both ease-out; - animation: bounce-down 2s 50 both ease-out; } + animation: bounce-down 2s 50 both ease-out; } .reveal .controls[data-controls-back-arrows="faded"] .navigate-left.enabled, .reveal .controls[data-controls-back-arrows="faded"] .navigate-up.enabled { opacity: 0.3; } @@ -335,8 +278,7 @@ body { visibility: visible; opacity: 0.9; cursor: pointer; - -webkit-transform: none; - transform: none; } + transform: none; } .reveal .controls .enabled.fragmented { opacity: 0.5; } .reveal .controls .enabled:hover, @@ -373,13 +315,11 @@ body { .reveal.no-hover .controls .controls-arrow:hover:before, .reveal.no-hover .controls .controls-arrow:active:before { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(45deg); - transform: translateX(0.5em) translateY(1.55em) rotate(45deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(45deg); } .reveal.no-hover .controls .controls-arrow:hover:after, .reveal.no-hover .controls .controls-arrow:active:after { - -webkit-transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); - transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); } + transform: translateX(0.5em) translateY(1.55em) rotate(-45deg); } @media screen and (min-width: 500px) { .reveal .controls[data-controls-layout="edges"] { @@ -469,8 +409,7 @@ body { width: 100%; height: 100%; overflow: hidden; - -ms-touch-action: pinch-zoom; - touch-action: pinch-zoom; } + touch-action: pinch-zoom; } .reveal .slides { position: absolute; @@ -485,14 +424,11 @@ body { overflow: visible; z-index: 1; text-align: center; - -webkit-perspective: 600px; - perspective: 600px; - -webkit-perspective-origin: 50% 40%; - perspective-origin: 50% 40%; } + perspective: 600px; + perspective-origin: 50% 40%; } .reveal .slides > section { - -webkit-perspective: 600px; - perspective: 600px; } + perspective: 600px; } .reveal .slides > section, .reveal .slides > section > section { @@ -502,9 +438,7 @@ body { padding: 20px 0px; pointer-events: auto; z-index: 10; - -webkit-transform-style: flat; - transform-style: flat; - 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); + transform-style: flat; 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); } /* Global transition speed settings */ @@ -569,60 +503,50 @@ body { * Aliased 'linear' for backwards compatibility *********************************************/ .reveal.slide section { - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; } .reveal .slides > section[data-transition=slide].past, .reveal .slides > section[data-transition~=slide-out].past, .reveal.slide .slides > section:not([data-transition]).past { - -webkit-transform: translate(-150%, 0); - transform: translate(-150%, 0); } + transform: translate(-150%, 0); } .reveal .slides > section[data-transition=slide].future, .reveal .slides > section[data-transition~=slide-in].future, .reveal.slide .slides > section:not([data-transition]).future { - -webkit-transform: translate(150%, 0); - transform: translate(150%, 0); } + transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=slide].past, .reveal .slides > section > section[data-transition~=slide-out].past, .reveal.slide .slides > section > section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - transform: translate(0, -150%); } + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=slide].future, .reveal .slides > section > section[data-transition~=slide-in].future, .reveal.slide .slides > section > section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - transform: translate(0, 150%); } + transform: translate(0, 150%); } .reveal.linear section { - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; } .reveal .slides > section[data-transition=linear].past, .reveal .slides > section[data-transition~=linear-out].past, .reveal.linear .slides > section:not([data-transition]).past { - -webkit-transform: translate(-150%, 0); - transform: translate(-150%, 0); } + transform: translate(-150%, 0); } .reveal .slides > section[data-transition=linear].future, .reveal .slides > section[data-transition~=linear-in].future, .reveal.linear .slides > section:not([data-transition]).future { - -webkit-transform: translate(150%, 0); - transform: translate(150%, 0); } + transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=linear].past, .reveal .slides > section > section[data-transition~=linear-out].past, .reveal.linear .slides > section > section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - transform: translate(0, -150%); } + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=linear].future, .reveal .slides > section > section[data-transition~=linear-in].future, .reveal.linear .slides > section > section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - transform: translate(0, 150%); } + transform: translate(0, 150%); } /********************************************* * CONVEX TRANSITION @@ -630,93 +554,78 @@ body { *********************************************/ .reveal .slides section[data-transition=default].stack, .reveal.default .slides section.stack { - -webkit-transform-style: preserve-3d; - 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 { - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=default].future, .reveal .slides > section[data-transition~=default-in].future, .reveal.default .slides > section:not([data-transition]).future { - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=default].past, .reveal .slides > section > section[data-transition~=default-out].past, .reveal.default .slides > section > section:not([data-transition]).past { - -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); - 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 > section[data-transition=default].future, .reveal .slides > section > section[data-transition~=default-in].future, .reveal.default .slides > section > section:not([data-transition]).future { - -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); - 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].stack, .reveal.convex .slides section.stack { - -webkit-transform-style: preserve-3d; - 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 { - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=convex].future, .reveal .slides > section[data-transition~=convex-in].future, .reveal.convex .slides > section:not([data-transition]).future { - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=convex].past, .reveal .slides > section > section[data-transition~=convex-out].past, .reveal.convex .slides > section > section:not([data-transition]).past { - -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); - 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 > section[data-transition=convex].future, .reveal .slides > section > section[data-transition~=convex-in].future, .reveal.convex .slides > section > section:not([data-transition]).future { - -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); - transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } + transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } /********************************************* * CONCAVE TRANSITION *********************************************/ .reveal .slides section[data-transition=concave].stack, .reveal.concave .slides section.stack { - -webkit-transform-style: preserve-3d; - 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 { - -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=concave].future, .reveal .slides > section[data-transition~=concave-in].future, .reveal.concave .slides > section:not([data-transition]).future { - -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=concave].past, .reveal .slides > section > section[data-transition~=concave-out].past, .reveal.concave .slides > section > section:not([data-transition]).past { - -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); - transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } + transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } .reveal .slides > section > section[data-transition=concave].future, .reveal .slides > section > section[data-transition~=concave-in].future, .reveal.concave .slides > section > section:not([data-transition]).future { - -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); - transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } + transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } /********************************************* * ZOOM TRANSITION @@ -729,27 +638,23 @@ body { .reveal .slides > section[data-transition~=zoom-out].past, .reveal.zoom .slides > section:not([data-transition]).past { visibility: hidden; - -webkit-transform: scale(16); - transform: scale(16); } + transform: scale(16); } .reveal .slides > section[data-transition=zoom].future, .reveal .slides > section[data-transition~=zoom-in].future, .reveal.zoom .slides > section:not([data-transition]).future { visibility: hidden; - -webkit-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } .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: scale(16); - 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: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } /********************************************* * CUBE TRANSITION @@ -759,17 +664,14 @@ body { * future version. *********************************************/ .reveal.cube .slides { - -webkit-perspective: 1300px; - perspective: 1300px; } + perspective: 1300px; } .reveal.cube .slides section { padding: 30px; min-height: 700px; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; + backface-visibility: hidden; box-sizing: border-box; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; } + transform-style: preserve-3d; } .reveal.center.cube .slides section { min-height: 0; } @@ -784,8 +686,7 @@ body { top: 0; background: rgba(0, 0, 0, 0.1); border-radius: 4px; - -webkit-transform: translateZ(-20px); - transform: translateZ(-20px); } + transform: translateZ(-20px); } .reveal.cube .slides section:not(.stack):after { content: ''; @@ -799,36 +700,27 @@ body { z-index: 1; border-radius: 4px; box-shadow: 0px 95px 25px rgba(0, 0, 0, 0.2); - -webkit-transform: translateZ(-90px) rotateX(65deg); - transform: translateZ(-90px) rotateX(65deg); } + transform: translateZ(-90px) rotateX(65deg); } .reveal.cube .slides > section.stack { padding: 0; background: none; } .reveal.cube .slides > section.past { - -webkit-transform-origin: 100% 0%; - transform-origin: 100% 0%; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); - transform: translate3d(-100%, 0, 0) rotateY(-90deg); } + transform-origin: 100% 0%; + transform: translate3d(-100%, 0, 0) rotateY(-90deg); } .reveal.cube .slides > section.future { - -webkit-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg); - transform: translate3d(100%, 0, 0) rotateY(90deg); } + transform-origin: 0% 0%; + transform: translate3d(100%, 0, 0) rotateY(90deg); } .reveal.cube .slides > section > section.past { - -webkit-transform-origin: 0% 100%; - transform-origin: 0% 100%; - -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg); - transform: translate3d(0, -100%, 0) rotateX(90deg); } + transform-origin: 0% 100%; + transform: translate3d(0, -100%, 0) rotateX(90deg); } .reveal.cube .slides > section > section.future { - -webkit-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); - transform: translate3d(0, 100%, 0) rotateX(-90deg); } + transform-origin: 0% 0%; + transform: translate3d(0, 100%, 0) rotateX(-90deg); } /********************************************* * PAGE TRANSITION @@ -838,17 +730,14 @@ body { * future version. *********************************************/ .reveal.page .slides { - -webkit-perspective-origin: 0% 50%; - perspective-origin: 0% 50%; - -webkit-perspective: 3000px; - perspective: 3000px; } + perspective-origin: 0% 50%; + perspective: 3000px; } .reveal.page .slides section { padding: 30px; min-height: 700px; box-sizing: border-box; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; } + transform-style: preserve-3d; } .reveal.page .slides section.past { z-index: 12; } @@ -862,8 +751,7 @@ body { left: 0; top: 0; background: rgba(0, 0, 0, 0.1); - -webkit-transform: translateZ(-20px); - transform: translateZ(-20px); } + transform: translateZ(-20px); } .reveal.page .slides section:not(.stack):after { content: ''; @@ -884,28 +772,20 @@ body { background: none; } .reveal.page .slides > section.past { - -webkit-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); - transform: translate3d(-40%, 0, 0) rotateY(-80deg); } + transform-origin: 0% 0%; + transform: translate3d(-40%, 0, 0) rotateY(-80deg); } .reveal.page .slides > section.future { - -webkit-transform-origin: 100% 0%; - transform-origin: 100% 0%; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); } + transform-origin: 100% 0%; + transform: translate3d(0, 0, 0); } .reveal.page .slides > section > section.past { - -webkit-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg); - transform: translate3d(0, -40%, 0) rotateX(80deg); } + transform-origin: 0% 0%; + transform: translate3d(0, -40%, 0) rotateX(80deg); } .reveal.page .slides > section > section.future { - -webkit-transform-origin: 0% 100%; - transform-origin: 0% 100%; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); } + transform-origin: 0% 100%; + transform: translate3d(0, 0, 0); } /********************************************* * FADE TRANSITION @@ -913,8 +793,7 @@ body { .reveal .slides section[data-transition=fade], .reveal.fade .slides section:not([data-transition]), .reveal.fade .slides > section > section:not([data-transition]) { - -webkit-transform: none; - transform: none; + transform: none; transition: opacity 0.5s; } .reveal.fade.overview .slides section, @@ -926,8 +805,7 @@ body { *********************************************/ .reveal .slides section[data-transition=none], .reveal.none .slides section:not([data-transition]) { - -webkit-transform: none; - transform: none; + transform: none; transition: none; } /********************************************* @@ -996,8 +874,7 @@ body { left: 0; margin: 10vh 0; margin: 70px 0; - -webkit-transform: none; - transform: none; } + transform: none; } .reveal .no-transition, .reveal .no-transition * { @@ -1012,8 +889,7 @@ body { height: 100%; top: 0; left: 0; - -webkit-perspective: 600px; - perspective: 600px; } + perspective: 600px; } .reveal .slide-background { display: none; @@ -1055,12 +931,10 @@ body { max-height: none; top: 0; left: 0; - -o-object-fit: cover; - object-fit: cover; } + object-fit: cover; } .reveal .slide-background[data-background-size="contain"] video { - -o-object-fit: contain; - object-fit: contain; } + object-fit: contain; } /* Immediate transition style */ .reveal[data-background-transition=none] > .backgrounds .slide-background, @@ -1071,78 +945,65 @@ body { .reveal[data-background-transition=slide] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=slide] { opacity: 1; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; } .reveal[data-background-transition=slide] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=slide] { - -webkit-transform: translate(-100%, 0); - transform: translate(-100%, 0); } + transform: translate(-100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=slide] { - -webkit-transform: translate(100%, 0); - transform: translate(100%, 0); } + transform: translate(100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=slide] { - -webkit-transform: translate(0, -100%); - transform: translate(0, -100%); } + transform: translate(0, -100%); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=slide] { - -webkit-transform: translate(0, 100%); - transform: translate(0, 100%); } + transform: translate(0, 100%); } /* Convex */ .reveal[data-background-transition=convex] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } + transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } + transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } /* Concave */ .reveal[data-background-transition=concave] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } + transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } + transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } /* Zoom */ .reveal[data-background-transition=zoom] > .backgrounds .slide-background, @@ -1153,29 +1014,25 @@ body { .reveal > .backgrounds .slide-background.past[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(16); - transform: scale(16); } + transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(16); - transform: scale(16); } + transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } /* Global transition speed settings */ .reveal[data-transition-speed="fast"] > .backgrounds .slide-background { @@ -1188,10 +1045,8 @@ body { * OVERVIEW *********************************************/ .reveal.overview { - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; - -webkit-perspective: 700px; - perspective: 700px; } + perspective-origin: 50% 50%; + perspective: 700px; } .reveal.overview .slides { -moz-transform-style: preserve-3d; } .reveal.overview .slides section { @@ -1219,8 +1074,7 @@ body { outline: none; overflow: visible; } .reveal.overview .backgrounds { - -webkit-perspective: inherit; - perspective: inherit; + perspective: inherit; -moz-transform-style: preserve-3d; } .reveal.overview .backgrounds .slide-background { opacity: 1; @@ -1346,8 +1200,6 @@ body { .reveal > .overlay .viewport { position: absolute; - display: -webkit-box; - display: -ms-flexbox; display: flex; top: 40px; right: 0; @@ -1387,8 +1239,7 @@ body { .reveal > .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; - -webkit-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } .reveal > .overlay.overlay-help .viewport { overflow: auto; @@ -1464,10 +1315,8 @@ body { line-height: 1.2; overflow: hidden; vertical-align: top; - -webkit-perspective: 400px; - perspective: 400px; - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; } + perspective: 400px; + perspective-origin: 50% 50%; } .reveal .roll:hover { background: none; @@ -1479,17 +1328,13 @@ body { padding: 0 2px; pointer-events: none; transition: all 400ms ease; - -webkit-transform-origin: 50% 0%; - transform-origin: 50% 0%; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + transform-origin: 50% 0%; + transform-style: preserve-3d; + backface-visibility: hidden; } .reveal .roll:hover span { background: rgba(0, 0, 0, 0.5); - -webkit-transform: translate3d(0px, 0px, -45px) rotateX(90deg); - transform: translate3d(0px, 0px, -45px) rotateX(90deg); } + transform: translate3d(0px, 0px, -45px) rotateX(90deg); } .reveal .roll span:after { content: attr(data-title); @@ -1498,12 +1343,9 @@ body { left: 0; top: 0; padding: 0 2px; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - -webkit-transform-origin: 50% 0%; - transform-origin: 50% 0%; - -webkit-transform: translate3d(0px, 110%, 0px) rotateX(-90deg); - transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } + backface-visibility: hidden; + transform-origin: 50% 0%; + transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } /********************************************* * SPEAKER NOTES @@ -1584,8 +1426,7 @@ body { .zoomed .reveal *, .zoomed .reveal *:before, .zoomed .reveal *:after { - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; } + backface-visibility: visible !important; } .zoomed .reveal .progress, .zoomed .reveal .controls { diff --git a/css/theme/irstea.css b/css/theme/irstea.css index d81b1684a5028b878275fd64593521ba2c69bb8c..1f041b7f2407e3344c8191704a5ba64a371c9145 100644 --- a/css/theme/irstea.css +++ b/css/theme/irstea.css @@ -295,23 +295,24 @@ body { font-variant: small-caps; color: #9293a1; } .reveal .slides section p { - margin-top: 0.75em; } + margin: 0.5em 0; } .reveal .slides section ul { list-style: none; color: #5f7a3c; - margin: 0.2em 0; } + margin: 0; } .reveal .slides section ul li { - margin-top: 0.75em; } + margin-top: 0.5em; + list-style: disc outside; } .reveal .slides section ul ul { color: #444444; list-style: none; - margin-left: 1.5em; } + margin-left: 1em; } .reveal .slides section ul ul li { - margin-top: 0.3em; } + margin-top: 0.25em; + list-style: square outside; } .reveal .slides section ul ul ul { color: #003a80; - list-style: square inside; - margin-left: 1.5em; } + margin-left: 1em; } @media print { .reveal .slides section .fragment.fade-out { visibility: hidden !important; } } diff --git a/css/theme/source/irstea.scss b/css/theme/source/irstea.scss index 477f50cb00b11db3e618e1b6d3a83bbe41553e4c..8d53ff35a064a70e51d221dd1cb8bbd95b3244cc 100644 --- a/css/theme/source/irstea.scss +++ b/css/theme/source/irstea.scss @@ -79,31 +79,32 @@ $selectionColor: #fff; } p { - margin-top: 0.75em; + margin: 0.5em 0; } color: $marine; ul { list-style: none; color: $olive; - margin: 0.2em 0; + margin: 0; li { - margin-top: 0.75em; + margin-top: 0.5em; + list-style: disc outside; } ul { color: $gris; list-style: none; - margin-left: 1.5em; + margin-left: 1em; li { - margin-top: 0.3em; + margin-top: 0.25em; + list-style: square outside; } ul { color: $marine; - list-style: square inside; - margin-left: 1.5em; + margin-left: 1em; } } }