From b9b3fe6a76fd633afac3244ab74ac9372337d05e Mon Sep 17 00:00:00 2001
From: Eduard Kuzmenko <thanwords24@gmail.com>
Date: Mon, 10 Feb 2020 17:34:51 +0700
Subject: [PATCH] chat img contain size (BE CARE)

---
 src/components/misc.ts       | 10 ++++++++++
 src/scss/partials/_chat.scss | 14 +++++++++-----
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/components/misc.ts b/src/components/misc.ts
index 887e2b38..391cf810 100644
--- a/src/components/misc.ts
+++ b/src/components/misc.ts
@@ -300,10 +300,14 @@ export function wrapVideo(this: any, doc: MTDocument, container: HTMLDivElement,
       
       /* image.style.height = doc.h + 'px';
       image.style.width = doc.w + 'px'; */
+
+      
       
       if(!justLoader) {
         return loadVideo();
       } else {
+        container.style.width = '';
+        container.style.height = '';
         preloader.detach();
       }
     });
@@ -532,6 +536,7 @@ export function wrapPhoto(this: AppImManager, photo: any, message: any, containe
   
   let size = appPhotosManager.setAttachmentSize(photo.id, container);
   let image = container.firstElementChild as HTMLImageElement || new Image();
+  //let size = appPhotosManager.setAttachmentSize(photo.id, image);
   image.setAttribute('message-id', message.mid);
   
   if(!container.contains(image)) {
@@ -549,6 +554,11 @@ export function wrapPhoto(this: AppImManager, photo: any, message: any, containe
     image.src = URL.createObjectURL(blob);
     
     preloader.detach();
+
+    image.style.width = '';
+    image.style.height = '';
+    container.style.width = '';
+    container.style.height = '';
   });
   
   console.log('wrapPhoto', load, container, image);
diff --git a/src/scss/partials/_chat.scss b/src/scss/partials/_chat.scss
index 6dbf0105..665b0106 100644
--- a/src/scss/partials/_chat.scss
+++ b/src/scss/partials/_chat.scss
@@ -295,11 +295,13 @@
 				.attachment {
 					max-width: 380px;
 					max-height: 380px;
+
+					width: max-content;
 				}
 				
 				img, video {
-					/* object-fit: contain; */
-					object-fit: cover;
+					object-fit: contain;
+					/* object-fit: cover; */
 				}
 			}
 			
@@ -308,7 +310,7 @@
 					//max-height: fit-content;
 					
 					img {
-						width: 100%;
+						/* width: 100%; */
 						/* height: 100%; */
 					}
 				}
@@ -351,11 +353,13 @@
 						user-select: none;
 						cursor: pointer;
 						position: relative;
+
+						width: max-content;
 						
 						img, video {
 							max-width: 100%;
-							width: 100%;
-							height: 100%;
+							/* width: 100%;
+							height: 100%; */
 						}
 					}