Browse Source

move body styles to new .reveal-viewport

master
Hakim El Hattab 2 years ago
parent
commit
ff62b96a5d
  1. 2
      css/reveal.scss
  2. 2
      css/theme/template/theme.scss
  3. 2
      dist/reveal.css
  4. 2
      dist/reveal.min.js
  5. 2
      dist/theme/beige.css
  6. 2
      dist/theme/black.css
  7. 2
      dist/theme/blood.css
  8. 2
      dist/theme/league.css
  9. 2
      dist/theme/moon.css
  10. 2
      dist/theme/night.css
  11. 2
      dist/theme/serif.css
  12. 2
      dist/theme/simple.css
  13. 2
      dist/theme/sky.css
  14. 2
      dist/theme/solarized.css
  15. 2
      dist/theme/white.css
  16. 7
      js/reveal.js
  17. 34
      test/examples/multiple-instances.html

2
css/reveal.scss

@ -19,7 +19,7 @@ html {
overflow: hidden;
}
body {
.reveal-viewport {
height: 100%;
overflow: hidden;
position: relative;

2
css/theme/template/theme.scss

@ -6,7 +6,7 @@
@import "./exposer";
body {
.reveal-viewport {
@include bodyBackground();
background-color: $backgroundColor;
}

2
dist/reveal.css

File diff suppressed because one or more lines are too long

2
dist/reveal.min.js

File diff suppressed because one or more lines are too long

2
dist/theme/beige.css

@ -33,7 +33,7 @@
--selection-background-color: rgba(79, 64, 28, 0.99);
--selection-color: #fff; }
body {
.reveal-viewport {
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));

2
dist/theme/black.css

@ -35,7 +35,7 @@ section.has-light-background, section.has-light-background h1, section.has-light
--selection-background-color: #bee4fd;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #191919;
background-color: #191919; }

2
dist/theme/blood.css

@ -38,7 +38,7 @@
--selection-background-color: #a23;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #222;
background-color: #222; }

2
dist/theme/league.css

@ -35,7 +35,7 @@
--selection-background-color: #FF5E99;
--selection-color: #fff; }
body {
.reveal-viewport {
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));

2
dist/theme/moon.css

@ -39,7 +39,7 @@ html * {
--selection-background-color: #d33682;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #002b36;
background-color: #002b36; }

2
dist/theme/night.css

@ -33,7 +33,7 @@
--selection-background-color: #e7ad52;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #111;
background-color: #111; }

2
dist/theme/serif.css

@ -35,7 +35,7 @@
--selection-background-color: #26351C;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #F0F1EB;
background-color: #F0F1EB; }

2
dist/theme/simple.css

@ -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);
--selection-color: #fff; }
body {
.reveal-viewport {
background: #fff;
background-color: #fff; }

2
dist/theme/sky.css

@ -36,7 +36,7 @@
--selection-background-color: #134674;
--selection-color: #fff; }
body {
.reveal-viewport {
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));

2
dist/theme/solarized.css

@ -39,7 +39,7 @@ html * {
--selection-background-color: #d33682;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #fdf6e3;
background-color: #fdf6e3; }

2
dist/theme/white.css

@ -35,7 +35,7 @@ section.has-dark-background, section.has-dark-background h1, section.has-dark-ba
--selection-background-color: #98bdef;
--selection-color: #fff; }
body {
.reveal-viewport {
background: #fff;
background-color: #fff; }

7
js/reveal.js

@ -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();

34
test/examples/multiple-instances.html

@ -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>
<div class="deck2" style="width: 100%; height: 50vh; padding: 10px;">
<div class="reveal">
<div class="slides">
<section>2.1</section>
<section>2.2</section>
<section>2.3</section>
</div>
<div class="reveal deck2" style="width: 100%; height: 50vh; margin: 10px;">
<div class="slides">
<section>2.1</section>
<section>2.2</section>
<section>2.3</section>
</div>
</div>
</div>
@ -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' ), {
embedded: true
} );
r2.initialize();
</script>

Loading…
Cancel
Save