Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Andrew Seales
Kubernetes Presentation
Commits
6d93ce57
Commit
6d93ce57
authored
Oct 06, 2015
by
Hakim El Hattab
Browse files
rebuild css
parent
01c55d4c
Changes
12
Hide whitespace changes
Inline
Side-by-side
css/reveal.css
View file @
6d93ce57
...
...
@@ -8,7 +8,19 @@
/*********************************************
* RESET STYLES
*********************************************/
html
,
body
,
.reveal
div
,
.reveal
span
,
.reveal
applet
,
.reveal
object
,
.reveal
iframe
,
.reveal
h1
,
.reveal
h2
,
.reveal
h3
,
.reveal
h4
,
.reveal
h5
,
.reveal
h6
,
.reveal
p
,
.reveal
blockquote
,
.reveal
pre
,
.reveal
a
,
.reveal
abbr
,
.reveal
acronym
,
.reveal
address
,
.reveal
big
,
.reveal
cite
,
.reveal
code
,
.reveal
del
,
.reveal
dfn
,
.reveal
em
,
.reveal
img
,
.reveal
ins
,
.reveal
kbd
,
.reveal
q
,
.reveal
s
,
.reveal
samp
,
.reveal
small
,
.reveal
strike
,
.reveal
strong
,
.reveal
sub
,
.reveal
sup
,
.reveal
tt
,
.reveal
var
,
.reveal
b
,
.reveal
u
,
.reveal
center
,
.reveal
dl
,
.reveal
dt
,
.reveal
dd
,
.reveal
ol
,
.reveal
ul
,
.reveal
li
,
.reveal
fieldset
,
.reveal
form
,
.reveal
label
,
.reveal
legend
,
.reveal
table
,
.reveal
caption
,
.reveal
tbody
,
.reveal
tfoot
,
.reveal
thead
,
.reveal
tr
,
.reveal
th
,
.reveal
td
,
.reveal
article
,
.reveal
aside
,
.reveal
canvas
,
.reveal
details
,
.reveal
embed
,
.reveal
figure
,
.reveal
figcaption
,
.reveal
footer
,
.reveal
header
,
.reveal
hgroup
,
.reveal
menu
,
.reveal
nav
,
.reveal
output
,
.reveal
ruby
,
.reveal
section
,
.reveal
summary
,
.reveal
time
,
.reveal
mark
,
.reveal
audio
,
video
{
html
,
body
,
.reveal
div
,
.reveal
span
,
.reveal
applet
,
.reveal
object
,
.reveal
iframe
,
.reveal
h1
,
.reveal
h2
,
.reveal
h3
,
.reveal
h4
,
.reveal
h5
,
.reveal
h6
,
.reveal
p
,
.reveal
blockquote
,
.reveal
pre
,
.reveal
a
,
.reveal
abbr
,
.reveal
acronym
,
.reveal
address
,
.reveal
big
,
.reveal
cite
,
.reveal
code
,
.reveal
del
,
.reveal
dfn
,
.reveal
em
,
.reveal
img
,
.reveal
ins
,
.reveal
kbd
,
.reveal
q
,
.reveal
s
,
.reveal
samp
,
.reveal
small
,
.reveal
strike
,
.reveal
strong
,
.reveal
sub
,
.reveal
sup
,
.reveal
tt
,
.reveal
var
,
.reveal
b
,
.reveal
u
,
.reveal
center
,
.reveal
dl
,
.reveal
dt
,
.reveal
dd
,
.reveal
ol
,
.reveal
ul
,
.reveal
li
,
.reveal
fieldset
,
.reveal
form
,
.reveal
label
,
.reveal
legend
,
.reveal
table
,
.reveal
caption
,
.reveal
tbody
,
.reveal
tfoot
,
.reveal
thead
,
.reveal
tr
,
.reveal
th
,
.reveal
td
,
.reveal
article
,
.reveal
aside
,
.reveal
canvas
,
.reveal
details
,
.reveal
embed
,
.reveal
figure
,
.reveal
figcaption
,
.reveal
footer
,
.reveal
header
,
.reveal
hgroup
,
.reveal
menu
,
.reveal
nav
,
.reveal
output
,
.reveal
ruby
,
.reveal
section
,
.reveal
summary
,
.reveal
time
,
.reveal
mark
,
.reveal
audio
,
video
{
margin
:
0
;
padding
:
0
;
border
:
0
;
...
...
@@ -16,13 +28,15 @@ html, body, .reveal div, .reveal span, .reveal applet, .reveal object, .reveal i
font
:
inherit
;
vertical-align
:
baseline
;
}
.reveal
article
,
.reveal
aside
,
.reveal
details
,
.reveal
figcaption
,
.reveal
figure
,
.reveal
footer
,
.reveal
header
,
.reveal
hgroup
,
.reveal
menu
,
.reveal
nav
,
.reveal
section
{
.reveal
article
,
.reveal
aside
,
.reveal
details
,
.reveal
figcaption
,
.reveal
figure
,
.reveal
footer
,
.reveal
header
,
.reveal
hgroup
,
.reveal
menu
,
.reveal
nav
,
.reveal
section
{
display
:
block
;
}
/*********************************************
* GLOBAL STYLES
*********************************************/
html
,
body
{
html
,
body
{
width
:
100%
;
height
:
100%
;
overflow
:
hidden
;
}
...
...
@@ -39,8 +53,7 @@ body {
.reveal
.slides
section
.fragment
{
opacity
:
0
;
visibility
:
hidden
;
-webkit-transition
:
all
0.2s
ease
;
transition
:
all
0.2s
ease
;
}
transition
:
all
0.2s
ease
;
}
.reveal
.slides
section
.fragment.visible
{
opacity
:
1
;
visibility
:
visible
;
}
...
...
@@ -49,26 +62,18 @@ body {
opacity
:
1
;
visibility
:
visible
;
}
.reveal
.slides
section
.fragment.grow.visible
{
-webkit-transform
:
scale
(
1.3
);
-ms-transform
:
scale
(
1.3
);
transform
:
scale
(
1.3
);
}
transform
:
scale
(
1.3
);
}
.reveal
.slides
section
.fragment.shrink
{
opacity
:
1
;
visibility
:
visible
;
}
.reveal
.slides
section
.fragment.shrink.visible
{
-webkit-transform
:
scale
(
0.7
);
-ms-transform
:
scale
(
0.7
);
transform
:
scale
(
0.7
);
}
transform
:
scale
(
0.7
);
}
.reveal
.slides
section
.fragment.zoom-in
{
-webkit-transform
:
scale
(
0.1
);
-ms-transform
:
scale
(
0.1
);
transform
:
scale
(
0.1
);
}
transform
:
scale
(
0.1
);
}
.reveal
.slides
section
.fragment.zoom-in.visible
{
-webkit-transform
:
none
;
-ms-transform
:
none
;
transform
:
none
;
}
transform
:
none
;
}
.reveal
.slides
section
.fragment.fade-out
{
opacity
:
1
;
...
...
@@ -97,7 +102,12 @@ body {
opacity
:
1
;
visibility
:
visible
;
}
.reveal
.slides
section
.fragment.highlight-red
,
.reveal
.slides
section
.fragment.highlight-current-red
,
.reveal
.slides
section
.fragment.highlight-green
,
.reveal
.slides
section
.fragment.highlight-current-green
,
.reveal
.slides
section
.fragment.highlight-blue
,
.reveal
.slides
section
.fragment.highlight-current-blue
{
.reveal
.slides
section
.fragment.highlight-red
,
.reveal
.slides
section
.fragment.highlight-current-red
,
.reveal
.slides
section
.fragment.highlight-green
,
.reveal
.slides
section
.fragment.highlight-current-green
,
.reveal
.slides
section
.fragment.highlight-blue
,
.reveal
.slides
section
.fragment.highlight-current-blue
{
opacity
:
1
;
visibility
:
visible
;
}
...
...
@@ -141,8 +151,7 @@ body {
.reveal
pre
.stretch
code
{
height
:
100%
;
max-height
:
100%
;
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
}
box-sizing
:
border-box
;
}
/*********************************************
* CONTROLS
...
...
@@ -165,13 +174,10 @@ body {
height
:
0
;
background-color
:
transparent
;
border
:
12px
solid
transparent
;
-webkit-transform
:
scale
(
0.9999
);
-ms-transform
:
scale
(
0.9999
);
transform
:
scale
(
0.9999
);
-webkit-transition
:
all
0.2s
ease
;
transition
:
all
0.2s
ease
;
transform
:
scale
(
0.9999
);
transition
:
all
0.2s
ease
;
-webkit-appearance
:
none
;
-webkit-tap-highlight-color
:
rgba
(
0
,
0
,
0
,
0
)
;
}
-webkit-tap-highlight-color
:
transparent
;
}
.reveal
.controls
.enabled
{
opacity
:
0.7
;
...
...
@@ -240,8 +246,7 @@ body {
height
:
100%
;
width
:
0px
;
background-color
:
#000
;
-webkit-transition
:
width
800ms
cubic-bezier
(
0.26
,
0.86
,
0.44
,
0.985
);
transition
:
width
800ms
cubic-bezier
(
0.26
,
0.86
,
0.44
,
0.985
);
}
transition
:
width
800ms
cubic-bezier
(
0.26
,
0.86
,
0.44
,
0.985
);
}
/*********************************************
* SLIDE NUMBER
...
...
@@ -263,8 +268,7 @@ body {
width
:
100%
;
height
:
100%
;
overflow
:
hidden
;
-ms-touch-action
:
none
;
touch-action
:
none
;
}
touch-action
:
none
;
}
.reveal
.slides
{
position
:
absolute
;
...
...
@@ -278,64 +282,66 @@ 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
{
-ms-perspective
:
600px
;
}
.reveal
.slides
>
section
,
.reveal
.slides
>
section
>
section
{
.reveal
.slides
>
section
,
.reveal
.slides
>
section
>
section
{
display
:
none
;
position
:
absolute
;
width
:
100%
;
padding
:
20px
0px
;
z-index
:
10
;
-webkit-transform-style
:
preserve-3d
;
transform-style
:
preserve-3d
;
-webkit-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
);
transition
:
-ms-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
);
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
);
}
transform-style
:
preserve-3d
;
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 */
.reveal
[
data-transition-speed
=
"fast"
]
.slides
section
{
-webkit-transition-duration
:
400ms
;
transition-duration
:
400ms
;
}
transition-duration
:
400ms
;
}
.reveal
[
data-transition-speed
=
"slow"
]
.slides
section
{
-webkit-transition-duration
:
1200ms
;
transition-duration
:
1200ms
;
}
transition-duration
:
1200ms
;
}
/* Slide-specific transition speed overrides */
.reveal
.slides
section
[
data-transition-speed
=
"fast"
]
{
-webkit-transition-duration
:
400ms
;
transition-duration
:
400ms
;
}
transition-duration
:
400ms
;
}
.reveal
.slides
section
[
data-transition-speed
=
"slow"
]
{
-webkit-transition-duration
:
1200ms
;
transition-duration
:
1200ms
;
}
transition-duration
:
1200ms
;
}
.reveal
.slides
>
section
.stack
{
padding-top
:
0
;
padding-bottom
:
0
;
}
.reveal
.slides
>
section
.present
,
.reveal
.slides
>
section
>
section
.present
{
.reveal
.slides
>
section
.present
,
.reveal
.slides
>
section
>
section
.present
{
display
:
block
;
z-index
:
11
;
opacity
:
1
;
}
.reveal.center
,
.reveal.center
.slides
,
.reveal.center
.slides
section
{
.reveal.center
,
.reveal.center
.slides
,
.reveal.center
.slides
section
{
min-height
:
0
!important
;
}
/* Don't allow interaction with invisible slides */
.reveal
.slides
>
section
.future
,
.reveal
.slides
>
section
>
section
.future
,
.reveal
.slides
>
section
.past
,
.reveal
.slides
>
section
>
section
.past
{
.reveal
.slides
>
section
.future
,
.reveal
.slides
>
section
>
section
.future
,
.reveal
.slides
>
section
.past
,
.reveal
.slides
>
section
>
section
.past
{
pointer-events
:
none
;
}
.reveal.overview
.slides
>
section
,
.reveal.overview
.slides
>
section
>
section
{
.reveal.overview
.slides
>
section
,
.reveal.overview
.slides
>
section
>
section
{
pointer-events
:
auto
;
}
.reveal
.slides
>
section
.past
,
.reveal
.slides
>
section
.future
,
.reveal
.slides
>
section
>
section
.past
,
.reveal
.slides
>
section
>
section
.future
{
.reveal
.slides
>
section
.past
,
.reveal
.slides
>
section
.future
,
.reveal
.slides
>
section
>
section
.past
,
.reveal
.slides
>
section
>
section
.future
{
opacity
:
0
;
}
/*********************************************
...
...
@@ -346,151 +352,158 @@ 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
);
-ms-transform
:
translate
(
-150%
,
0
);
transform
:
translate
(
-150%
,
0
);
}
.reveal
.slides
>
section
[
data-transition
=
slide
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
slide-out
]
.past
,
.reveal.slide
.slides
>
section
:not
([
data-transition
])
.past
{
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
);
-ms-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
{
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%
);
-ms-transform
:
translate
(
0
,
-150%
);
transform
:
translate
(
0
,
-150%
);
}
.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
{
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%
);
-ms-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
{
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
);
-ms-transform
:
translate
(
-150%
,
0
);
transform
:
translate
(
-150%
,
0
);
}
.reveal
.slides
>
section
[
data-transition
=
linear
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
linear-out
]
.past
,
.reveal.linear
.slides
>
section
:not
([
data-transition
])
.past
{
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
);
-ms-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
{
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%
);
-ms-transform
:
translate
(
0
,
-150%
);
transform
:
translate
(
0
,
-150%
);
}
.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
{
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%
);
-ms-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
{
transform
:
translate
(
0
,
150%
);
}
/*********************************************
* CONVEX TRANSITION
* Aliased 'default' for backwards compatibility
*********************************************/
.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
);
}
.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
);
}
.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
);
}
.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
);
}
.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
);
}
.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
);
}
.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
);
}
.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
);
}
.reveal
.slides
>
section
[
data-transition
=
default
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
default-out
]
.past
,
.reveal.default
.slides
>
section
:not
([
data-transition
])
.past
{
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
{
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
{
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
{
transform
:
translate3d
(
0
,
300px
,
0
)
rotateX
(
-70deg
)
translate3d
(
0
,
300px
,
0
);
}
.reveal
.slides
>
section
[
data-transition
=
convex
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
convex-out
]
.past
,
.reveal.convex
.slides
>
section
:not
([
data-transition
])
.past
{
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
{
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
{
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
{
transform
:
translate3d
(
0
,
300px
,
0
)
rotateX
(
-70deg
)
translate3d
(
0
,
300px
,
0
);
}
/*********************************************
* CONCAVE TRANSITION
*********************************************/
.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
);
}
.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
);
}
.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
);
}
.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
);
}
.reveal
.slides
>
section
[
data-transition
=
concave
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
concave-out
]
.past
,
.reveal.concave
.slides
>
section
:not
([
data-transition
])
.past
{
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
{
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
{
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
{
transform
:
translate3d
(
0
,
80%
,
0
)
rotateX
(
70deg
)
translate3d
(
0
,
80%
,
0
);
}
/*********************************************
* ZOOM TRANSITION
*********************************************/
.reveal
.slides
section
[
data-transition
=
zoom
],
.reveal.zoom
.slides
section
:not
([
data-transition
])
{
-webkit-transition-timing-function
:
ease
;
transition-timing-function
:
ease
;
}
.reveal
.slides
section
[
data-transition
=
zoom
],
.reveal.zoom
.slides
section
:not
([
data-transition
])
{
transition-timing-function
:
ease
;
}
.reveal
.slides
>
section
[
data-transition
=
zoom
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
zoom-out
]
.past
,
.reveal.zoom
.slides
>
section
:not
([
data-transition
])
.past
{
.reveal
.slides
>
section
[
data-transition
=
zoom
]
.past
,
.reveal
.slides
>
section
[
data-transition
~=
zoom-out
]
.past
,
.reveal.zoom
.slides
>
section
:not
([
data-transition
])
.past
{
visibility
:
hidden
;
-webkit-transform
:
scale
(
16
);
-ms-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
{
.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
);
-ms-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
:
translate
(
0
,
-150%
);
-ms-transform
:
translate
(
0
,
-150%
);
transform
:
translate
(
0
,
-150%
);
}
.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
{
transform
:
translate
(
0
,
-150%
);
}
.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%
);
-ms-transform
:
translate
(
0
,
150%
);
transform
:
translate
(
0
,
150%
);
}
.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
{
transform
:
translate
(
0
,
150%
);
}
/*********************************************
* CUBE TRANSITION
*********************************************/
.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
;
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
}
backface-visibility
:
hidden
;
box-sizing
:
border-box
;
}
.reveal.center.cube
.slides
section
{
min-height
:
0
;
}
...
...
@@ -505,8 +518,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
:
''
;
...
...
@@ -520,55 +532,39 @@ 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%
;
-ms-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%
;
-ms-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%
;
-ms-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%
;
-ms-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
*********************************************/
.reveal.page
.slides
{