Truncate operator's avatar in invitation

Fixes #96

src/mibew/js/source/widget.js

@@ -396,6 +396,16 @@ var Mibew = {};
             + '<a href="javascript:void(0);" onclick="Mibew.Invitation.reject();">'
             + '&times;</a></div>';
 
+        // Add operator avatar
+        if (avatarUrl) {
+            popuptext += '<div id="mibew-invitation-avatar-wrapper">'
+                + '<img id="mibew-invitation-avatar" src="' + avatarUrl
+                + '" title="' + operatorName
+                + '" alt="' + operatorName
+                + '" onclick="Mibew.Invitation.accept();" />'
+                + '</div>';
+        }
+
         // Add operator name
         if (operatorName) {
             popuptext += '<h1 onclick="Mibew.Invitation.accept();">'
@@ -403,14 +413,6 @@ var Mibew = {};
                 + '</h1>';
         }
 
-        // Add operator avatar
-        if (avatarUrl) {
-            popuptext += '<img id="mibew-invitation-avatar" src="' + avatarUrl
-                + '" title="' + operatorName
-                + '" alt="' + operatorName
-                + '" onclick="Mibew.Invitation.accept();" />';
-        }
-
         // Broadcast message from the thread related with invitation into iframe
         if (threadUrl) {
             popuptext += '<iframe id="mibew-invitation-frame" '

src/mibew/styles/invitations/default/invite.css

@@ -85,11 +85,16 @@
     padding: 2px !important;
     margin: 2px !important;
 }
-#mibew-invitation-avatar {
+#mibew-invitation-avatar-wrapper {
     margin: 2px 10px 5px 2px !important;
     cursor: pointer !important;
     float: right !important;
     max-width: 100px !important;
+    max-height: 100px !important;
+    overflow: hidden;
+}
+#mibew-invitation-avatar {
+    max-width: 100px !important;
 }
 #mibew-invitation-frame {
     width: 388px !important;