dirk
/
why-cant-we-deploy-today
1
0
Fork 0
Code Releases Activity

move body styles to new .reveal-viewport

This commit is contained in:
Hakim El Hattab 2020-04-06 13:49:39 +02:00
parent f26fc20b55
commit ff62b96a5d
17 changed files with 39 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css/reveal.scss
View File

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

2
css/theme/template/theme.scss
View File

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

2
dist/reveal.css vendored
View File

File diff suppressed because one or more lines are too long

2
dist/reveal.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/theme/beige.css vendored
View File

@ -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 vendored
View File

@ -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 vendored
View File

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

2
dist/theme/league.css vendored
View File

@ -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 vendored
View File

@ -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 vendored
View File

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

2
dist/theme/serif.css vendored
View File

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

2
dist/theme/simple.css vendored
View File

@ -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 vendored
View File

@ -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 vendored
View File

@ -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 vendored
View File

@ -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
View File

@ -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
View File

@ -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>