Skip to content

Commit 722b14b

Browse files
committed
reduce lightbox header in small windows
1 parent 1923a5c commit 722b14b

File tree

7 files changed

+21
-8
lines changed

7 files changed

+21
-8
lines changed

css/reveal.scss

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,12 @@ html.reveal-full-page {
3939
--r-overlay-gap: 5px;
4040
}
4141

42+
@media screen and (max-width: 1024px), (max-height: 768px) {
43+
.reveal-viewport {
44+
--r-overlay-header-height: 26px;
45+
}
46+
}
47+
4248
// Force the presentation to cover the full viewport when we
4349
// enter fullscreen mode. Fixes sizing issues in Safari.
4450
.reveal-viewport:fullscreen {
@@ -1492,7 +1498,7 @@ $controlsArrowAngleActive: 36deg;
14921498
justify-content: center;
14931499
min-width: var(--r-overlay-header-height);
14941500
min-height: var(--r-overlay-header-height);
1495-
padding: 0 10px;
1501+
padding: 0 calc(var(--r-overlay-header-height) / 4);
14961502
opacity: 1;
14971503
border-radius: 6px;
14981504
font-size: 18px;

dist/reveal.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/reveal.esm.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/reveal.esm.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/reveal.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/reveal.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

js/controllers/overlay.js

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ export default class Overlay {
1313
this.iframeTriggerSelector = null;
1414
this.mediaTriggerSelector = '[data-preview-image], [data-preview-video]';
1515

16+
this.stateProps = ['previewIframe', 'previewImage', 'previewVideo', 'previewFit'];
1617
this.state = {};
1718

1819
}
@@ -64,7 +65,7 @@ export default class Overlay {
6465

6566
this.close();
6667

67-
this.state.previewIframe = url;
68+
this.state = { previewIframe: url };
6869

6970
this.createOverlay( 'r-overlay-preview' );
7071
this.dom.dataset.state = 'loading';
@@ -313,6 +314,12 @@ export default class Overlay {
313314

314315
setState( state ) {
315316

317+
// Ignore the incoming state if none of the preview related
318+
// props have changed
319+
if( this.stateProps.every( key => this.state[ key ] === state[ key ] ) ) {
320+
return;
321+
}
322+
316323
if( state.previewIframe ) {
317324
this.previewIframe( state.previewIframe );
318325
}
@@ -338,7 +345,7 @@ export default class Overlay {
338345
// Was an iframe lightbox trigger clicked?
339346
if( linkTarget ) {
340347
if( event.metaKey || event.shiftKey || event.altKey ) {
341-
// Let the browser handle meta keys naturally so users can cmd+click, cmd+shift+click, shift+click, alt+click, etc.
348+
// Let the browser handle meta keys naturally so users can cmd+click
342349
return;
343350
}
344351
let url = linkTarget.getAttribute( 'href' ) || linkTarget.getAttribute( 'data-preview-link' );

0 commit comments

Comments
 (0)