Fix problem of squished quote icons and images

stylesheets/_conversation.scss

@@ -525,6 +525,7 @@ span.status {
 
       .icon-container {
         flex: initial;
+        min-width: 48px;
         width: 48px;
         height: 48px;
         position: relative;

ts/components/conversation/Quote.md

@@ -72,7 +72,7 @@ const View = Whisper.MessageView;
 ```jsx
 const outgoing = new Whisper.Message({
   type: 'outgoing',
-  body: 'About six',
+  body: 'Woo, otters!',
   sent_at: Date.now() - 18000000,
   quote: {
     text:
@@ -104,7 +104,50 @@ const View = Whisper.MessageView;
 </util.ConversationContext>
 ```
 
-#### Image with caption
+#### A lot of text in quotation, with icon
+
+```jsx
+const outgoing = new Whisper.Message({
+  type: 'outgoing',
+  body: 'Woo, otters!',
+  sent_at: Date.now() - 18000000,
+  quote: {
+    text:
+      'I have lots of things to say. First, I enjoy otters. Second best are cats. ' +
+      'After that, probably dogs. And then, you know, reptiles of all types. ' +
+      'Then birds. They are dinosaurs, after all. Then cephalapods, because they are ' +
+      'really smart.',
+    author: '+12025550011',
+    id: Date.now() - 1000,
+    attachments: [
+      {
+        contentType: 'text/plain',
+        fileName: 'lorum_ipsum.txt',
+      },
+    ],
+  },
+});
+const incoming = new Whisper.Message(Object.assign({}, outgoing.attributes, {
+  source: '+12025550011',
+  type: 'incoming',
+  quote: Object.assign({}, outgoing.attributes.quote, {
+    author: '+12025550005',
+  }),
+}));
+const View = Whisper.MessageView;
+<util.ConversationContext theme={util.theme}>
+  <util.BackboneWrapper
+    View={View}
+    options={{ model: incoming }}
+  />
+  <util.BackboneWrapper
+    View={View}
+    options={{ model: outgoing }}
+  />
+</util.ConversationContext>
+```
+
+#### A lot of text in quotation, with image
 
 ```jsx
 const quotedMessage = {
@@ -113,10 +156,14 @@ const quotedMessage = {
 };
 const outgoing = new Whisper.Message({
   type: 'outgoing',
-  body: "Totally, it's a pretty unintuitive concept.",
+  body: 'Woo, otters!',
   sent_at: Date.now() - 18000000,
   quote: {
-    text: 'I am pretty confused about Pi.',
+    text:
+      'I have lots of things to say. First, I enjoy otters. Second best are cats. ' +
+      'After that, probably dogs. And then, you know, reptiles of all types. ' +
+      'Then birds. They are dinosaurs, after all. Then cephalapods, because they are ' +
+      'really smart.',
     author: '+12025550011',
     id: Date.now() - 1000,
     attachments: [
@@ -154,6 +201,53 @@ const View = Whisper.MessageView;
 </util.ConversationContext>
 ```
 
+#### Image with caption
+
+```jsx
+const quotedMessage = {
+  imageUrl: util.gifObjectUrl,
+  id: '3234-23423-2342',
+};
+const outgoing = new Whisper.Message({
+  type: 'outgoing',
+  body: "Totally, it's a pretty unintuitive concept.",
+  sent_at: Date.now() - 18000000,
+  quote: {
+    text: 'I am pretty confused about Pi.',
+    author: '+12025550011',
+    id: Date.now() - 1000,
+    attachments: [
+      {
+        contentType: 'image/gif',
+        fileName: 'pi.gif',
+        thumbnail: {
+          contentType: 'image/gif',
+        },
+      },
+    ],
+  },
+});
+const incoming = new Whisper.Message(Object.assign({}, outgoing.attributes, {
+  source: '+12025550011',
+  type: 'incoming',
+  quote: Object.assign({}, outgoing.attributes.quote, {
+    author: '+12025550005',
+  }),
+}));
+
+const View = Whisper.MessageView;
+<util.ConversationContext theme={util.theme}>
+  <util.BackboneWrapper
+    View={View}
+    options={{ model: incoming }}
+  />
+  <util.BackboneWrapper
+    View={View}
+    options={{ model: outgoing }}
+  />
+</util.ConversationContext>
+```
+
 #### Image
 
 ```jsx