Fix responsive zoom for some resolutions

src/js/plugins/zoom.js

@@ -133,7 +133,7 @@ export default class Zoom {
       elem.el.style.height = `${(wsW - marginH) * 1.5}px`;
       elem.el.style.minHeight = scale == 1? 'auto' : '';
       // Because of flexbox, wrap height is required
-      wrap.style.height = `${window.innerWidth / 1.5}px`;
+      wrap.style.height = `${(wsW - marginH) * 1.5 / 2}px`;
     } else {
       elem.el.style.width = `${window.innerWidth - marginW * scale}px`;
       elem.el.style.height = `${window.innerHeight - marginH * scale}px`;
@@ -178,6 +178,8 @@ export default class Zoom {
    * @param {Event} ev
    */
   onWindowResize(ev) {
+    if (this.isZoomed_) this.zoomOut();
+
     this.zws_.slides.forEach( elem => {
       const wrap = elem.el.parentElement;
       const div = wrap.parentElement;

static/css/base.css

@@ -3385,7 +3385,7 @@ Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
   /*border-radius: .3rem;
   padding: 0 1.6rem;*/
   margin: .8rem auto;
- }
+}
 
 @media all and (orientation: portrait) {
   #webslides-zoomed.grid > .column {
@@ -3401,6 +3401,6 @@ Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
     width: 100%;
   }
   #webslides-zoomed.grid > .column > .wrap-zoom > .slide {
-    transform: scale(0.5) translate(-50%, -30vh);
+    transform: scale(0.5) translate(-50%, -50%);
   }
 }

static/js/webslides.js

@@ -1,7 +1,7 @@
 /*!
  * Name: WebSlides
  * Version: 1.2.1
- * Date: 2017-04-12
+ * Date: 2017-04-13
  * Description: Making HTML presentations easy
  * URL: https://github.com/webslides/webslides#readme
  * Credits: @jlantunez, @LuisSacristan, @Belelros
@@ -2608,7 +2608,7 @@ var Zoom = function () {
         elem.el.style.height = (wsW - marginH) * 1.5 + 'px';
         elem.el.style.minHeight = scale == 1 ? 'auto' : '';
         // Because of flexbox, wrap height is required
-        wrap.style.height = window.innerWidth / 1.5 + 'px';
+        wrap.style.height = (wsW - marginH) * 1.5 / 2 + 'px';
       } else {
         elem.el.style.width = window.innerWidth - marginW * scale + 'px';
         elem.el.style.height = window.innerHeight - marginH * scale + 'px';
@@ -2667,6 +2667,8 @@ var Zoom = function () {
     value: function onWindowResize(ev) {
       var _this3 = this;
 
+      if (this.isZoomed_) this.zoomOut();
+
       this.zws_.slides.forEach(function (elem) {
         var wrap = elem.el.parentElement;
         var div = wrap.parentElement;