erp5_document_scanner: Small fix to render stream on mobile

erp5_document_scanner/SkinTemplateItem/portal_skins/erp5_document_scanner/gadget_document_scanner.css.css

@@ -3,23 +3,27 @@
   font-size: 19px;
 }
 
+div[data-gadget-scope="field_your_document_scanner_gadget"] {
+  text-align: center;
+}
+
 .video, .photo, .camera-output {
   max-width: 100%;
   width: auto;
-  height: 360px;
+  max-height: 360px;
   filter: brightness(1);
   text-align: center;
 }
 
+.camera-input, .camera-output {
+  min-height: 360px;
+}
+
 .canvas {
   display: none;
   filter: brightness(1);
 }
 
-.camera {
-  min-height: 390px;
-}
-
 .page-number {
   display: inline;
 }

erp5_document_scanner/SkinTemplateItem/portal_skins/erp5_document_scanner/gadget_document_scanner.js.js

@@ -204,8 +204,6 @@
       .push(function (photoCapabilities) {
         imageWidth = photoCapabilities.imageWidth.max;
         imageHeight = photoCapabilities.imageHeight.max;
-        root.querySelector(".camera-output").style.maxWidth = imageWidth;
-        root.querySelector(".camera-output").style.maxHeight = imageHeight;
         return video.play();
       })
       .push(function () {
@@ -306,6 +304,7 @@
         return this.getElement()
           .push(function (el) {
             root = el;
+            el.querySelector(".camera").style.maxWidth = video.offsetWidth + "px";
             el.querySelector(".camera-input").style.display = "none";
             return takePicture(el);
           })