Transparent background for images.

stylesheets/_modules.scss

@@ -130,9 +130,6 @@
   border-radius: $session_message-container-border-radius;
   overflow: hidden;
   // no background by default for the attachment container
-  @include themify($themes) {
-    background: themed('inboxBackground');
-  }
 }
 
 .module-message--outgoing {
@@ -1284,7 +1281,8 @@
 
 .module-image {
   overflow: hidden;
-  background-color: $color-white;
+  // background-color: $color-white;
+  background-color: rgba(0, 0, 0, 0);
   position: relative;
   display: inline-block;
   margin: 1px;

stylesheets/_session_theme.scss

@@ -25,8 +25,14 @@
   }
 
   &__container--incoming {
-    @include themify($themes) {
+    &--opaque {
-      background: themed('receivedMessageBackground');
+      @include themify($themes) {
+        background: themed('receivedMessageBackground');
+      }
+    }
+
+    &--transparent {
+      background: none;
     }
 
     .module-message__text {
@@ -49,8 +55,15 @@
   }
 
   &__container--outgoing {
-    @include themify($themes) {
+    &--opaque {
-      background: themed('sentMessageBackground');
+      @include themify($themes) {
+        background: themed('sentMessageBackground');
+      }
+    }
+
+
+    &--transparent {
+      background: none;
     }
 
     .module-message__text {

stylesheets/_theme_dark.scss

@@ -401,7 +401,7 @@
   // Module: Image
 
   .module-image {
-    background-color: $color-black;
+    background: none;
   }
 
   .module-image__border-overlay {

ts/components/conversation/Message.tsx

@@ -671,8 +671,8 @@ class MessageInner extends React.PureComponent<MessageRegularProps, State> {
 
       return Boolean(
         displayImage &&
-          ((isImage(attachments) && hasImage(attachments)) ||
+        ((isImage(attachments) && hasImage(attachments)) ||
-            (isVideo(attachments) && hasVideoScreenshot(attachments)))
+          (isVideo(attachments) && hasVideoScreenshot(attachments)))
       );
     }
 
@@ -781,7 +781,10 @@ class MessageInner extends React.PureComponent<MessageRegularProps, State> {
           <div
             className={classNames(
               'module-message__container',
-              `module-message__container--${direction}`
+              `module-message__container--${direction}`,
+              isShowingImage ? 
+                `module-message__container--${direction}--transparent` : 
+                `module-message__container--${direction}--opaque`
             )}
             style={{
               width: isShowingImage ? width : undefined,