diff --git a/www/common/common-history.js b/www/common/common-history.js
index 9f417197e..b8c874847 100644
--- a/www/common/common-history.js
+++ b/www/common/common-history.js
@@ -225,7 +225,7 @@ define([
if (e.which === 33) { p(); return render(getNext(10)); } // PageUp
if (e.which === 34) { p(); return render(getPrevious(10)); } // PageUp
if (e.which === 27) { p(); $close.click(); }
- }).focus();
+ }).keyup(function (e) { e.stopPropagation(); }).focus();
$cur.on('change', function () {
render( get($cur.val() - 1) );
});
diff --git a/www/slide/index.html b/www/slide/index.html
index 2f5e675a9..96eb6c577 100644
--- a/www/slide/index.html
+++ b/www/slide/index.html
@@ -35,8 +35,6 @@
overflow:hidden;
box-sizing: border-box;
}
- /* We use !important here to override the 96% set to the element in DecorateToolbar.js
- when we enter fullscreen mode. It allows us to avoid changing the iframe's size in JS */
body #pad-iframe.fullscreen {
top: 0px;
height: 100%;
@@ -45,8 +43,6 @@
top: 0px;
height: 100%;
}
-
-
diff --git a/www/slide/inner.html b/www/slide/inner.html
index 1726cd2f1..4e192d0c5 100644
--- a/www/slide/inner.html
+++ b/www/slide/inner.html
@@ -5,7 +5,6 @@
-
@@ -35,6 +34,8 @@
+
+
diff --git a/www/slide/inner.js b/www/slide/inner.js
new file mode 100644
index 000000000..2b9da86c5
--- /dev/null
+++ b/www/slide/inner.js
@@ -0,0 +1 @@
+define([ 'less!/slide/slide.less' ], function () {});
diff --git a/www/slide/slide.less b/www/slide/slide.less
index 459267186..6cbe6367f 100644
--- a/www/slide/slide.less
+++ b/www/slide/slide.less
@@ -1,5 +1,5 @@
-@import "../../customize.dist/src/less/variables.less";
-@import "../../customize.dist/src/less/mixins.less";
+@import "/customize/src/less/variables.less";
+@import "/customize/src/less/mixins.less";
// used for slides
.viewportRatio (@x, @y, @p: 100) {
@@ -158,12 +158,8 @@ body {
height: ~"calc(100vh - 2px)";
}
}
- /*.slide-frame:first-child {
- margin-top: ~"calc(((100vh - 56.25vw)/2))";
- }*/
}
-
/* Slide position (present mode) */
div.modal, div#modal {
display: none;
@@ -212,21 +208,15 @@ div.modal, div#modal {
white-space: nowrap;
.slide-frame {
overflow: hidden;
- display: inline-block;
+ display: flex;
+ flex-flow: column !important;
+
box-sizing: border-box;
border: 1px solid;
white-space: normal;
vertical-align: middle;
- /* center things as much as possible
-
- margin-top: 50vh;
- margin-bottom: 50vh;
- transform: translateY(-50%);
-
- */
-
padding: 0.5em;
width: 100vw;
height: 56.25vw; // height:width ratio = 9/16 = .5625
@@ -324,7 +314,6 @@ div#modal #content, #print {
margin: 0 auto;
padding-left: 0.3em;
}
- // p, ul, ol { padding-left: 10%; }
img {
position: relative;
@@ -364,7 +353,7 @@ div#modal #content, #print {
top: 15vh; bottom: 15vh;
left: 10vw; right: 10vw;
border: 1px solid black;
- z-index: 10;
+ z-index: 100000;
overflow: auto;
display: none;
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
@@ -396,3 +385,31 @@ div#modal #content, #print {
}
}
+.slide-frame * {
+ max-width: 100%;
+ max-height: 100%;
+}
+
+p {
+ display: flex;
+ flex-flow: column;
+ padding: 0;
+ margin: 0;
+ min-height:0;
+ flex: 1;
+}
+
+media-tag {
+ min-height: 0;
+ flex: 1;
+ display: block;
+ text-align: center;
+}
+
+media-tag img {
+ max-height: 100% !important;
+}
+
+media-tag iframe {
+ min-height: 100%;
+}