@@ -19,7 +19,7 @@ html {
overflow: hidden;
}
-body {
+.reveal-viewport {
height: 100%;
position: relative;
@@ -6,7 +6,7 @@
@import "./exposer";
@include bodyBackground();
background-color: $backgroundColor;
@@ -33,7 +33,7 @@
--selection-background-color: rgba(79, 64, 28, 0.99);
--selection-color: #fff; }
background: #f7f2d3;
background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3));
@@ -35,7 +35,7 @@ section.has-light-background, section.has-light-background h1, section.has-light
--selection-background-color: #bee4fd;
background: #191919;
background-color: #191919; }
@@ -38,7 +38,7 @@
--selection-background-color: #a23;
background: #222;
background-color: #222; }
@@ -35,7 +35,7 @@
--selection-background-color: #FF5E99;
background: #1c1e20;
background: -moz-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #555a5f), color-stop(100%, #1c1e20));
@@ -39,7 +39,7 @@ html * {
--selection-background-color: #d33682;
background: #002b36;
background-color: #002b36; }
--selection-background-color: #e7ad52;
background: #111;
background-color: #111; }
--selection-background-color: #26351C;
background: #F0F1EB;
background-color: #F0F1EB; }
@@ -38,7 +38,7 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
--selection-background-color: rgba(0, 0, 0, 0.99);
background: #fff;
background-color: #fff; }
@@ -36,7 +36,7 @@
--selection-background-color: #134674;
background: #add9e4;
background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #add9e4));
background: #fdf6e3;
background-color: #fdf6e3; }
@@ -35,7 +35,7 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
--selection-background-color: #98bdef;
@@ -230,6 +230,13 @@ export default function( revealElement, options ) {
dom.wrapper.classList.remove( 'no-hover' );
+ if( config.embedded === true ) {
+ revealElement.classList.add( 'reveal-viewport' );
+ }
+ else {
+ document.body.classList.add( 'reveal-viewport' );
+
backgrounds.render();
slideNumber.render();
controls.render();
@@ -12,26 +12,22 @@
<link rel="stylesheet" href="../../dist/theme/white.css" id="theme">
</head>
- <body>
+ <body style="background: #ddd;">
<div style="display: flex; flex-direction: row;">
- <div class="deck1" style="width: 100%; height: 50vh; padding: 10px;">
- <div class="reveal">
- <div class="slides">
- <section>1.1</section>
- <section>1.2</section>
- <section>1.3</section>
- </div>
+ <div class="reveal deck1" style="width: 100%; height: 50vh; margin: 10px;">
+ <div class="slides">
+ <section>1.1</section>
+ <section>1.2</section>
+ <section>1.3</section>
</div>
- <div class="deck2" style="width: 100%; height: 50vh; padding: 10px;">
- <section>2.1</section>
- <section>2.2</section>
- <section>2.3</section>
+ <div class="reveal deck2" style="width: 100%; height: 50vh; margin: 10px;">
+ <section>2.1</section>
+ <section>2.2</section>
+ <section>2.3</section>
@@ -40,10 +36,14 @@
<script>
- let r1 = new Reveal( document.querySelector( '.deck1 .reveal' ) );
+ let r1 = new Reveal( document.querySelector( '.deck1' ), {
+ embedded: true
+ } );
r1.initialize();
- let r2 = new Reveal( document.querySelector( '.deck2 .reveal' ) );
+ let r2 = new Reveal( document.querySelector( '.deck2' ), {
r2.initialize();
</script>