Merge pull request #6288 from vector-im/luke/e2e-request-keys-button

Changes for E2E "fudge-button"

src/components/views/rooms/RoomTooltip.js

@@ -31,7 +31,7 @@ module.exports = React.createClass({
         tooltipClassName: React.PropTypes.string,
         // The tooltip is derived from either the room name or a label
         room: React.PropTypes.object,
-        label: React.PropTypes.string,
+        label: React.PropTypes.node,
     },
 
     // Create a wrapper for the tooltip outside the parent and attach it to the body element

src/skins/vector/css/matrix-react-sdk/views/elements/_ToolTipButton.scss

@@ -44,8 +44,8 @@ limitations under the License.
 }
 
 .mx_ToolTipButton_helpText {
-    width: 200px;
+    width: 400px;
-    text-align: center;
+    text-align: start;
     line-height: 17px !important;
 }
 

src/skins/vector/css/matrix-react-sdk/views/rooms/_EventTile.scss

@@ -298,6 +298,34 @@ limitations under the License.
     cursor: pointer;
 }
 
+.mx_EventTile_keyRequestInfo {
+    font-size: 12px;
+}
+
+.mx_EventTile_keyRequestInfo_text {
+    opacity: 0.5;
+}
+
+.mx_EventTile_keyRequestInfo_text a {
+    color: $primary-fg-color;
+    text-decoration: underline;
+    cursor: pointer;
+}
+
+.mx_EventTile_keyRequestInfo_tooltip_contents p {
+    text-align: auto;
+    margin-left: 3px;
+    margin-right: 3px;
+}
+
+.mx_EventTile_keyRequestInfo_tooltip_contents p:first-child {
+    margin-top: 0px;
+}
+
+.mx_EventTile_keyRequestInfo_tooltip_contents p:last-child {
+    margin-bottom: 0px;
+}
+
 .mx_EventTile_12hr .mx_EventTile_e2eIcon {
     padding-left: 5px;
 }