Merge pull request #1809 from vector-im/revert-1799-feature-inline-link-preview

Revert "Presentation for inline link"

src/skins/vector/css/common.css

@@ -46,14 +46,6 @@ h2 {
     margin-bottom: 16px;
 }
 
-a {
-    text-decoration: none;
-}
-
-a:hover {
-    text-decoration: underline;
-}
-
 a:hover,
 a:link,
 a:visited {

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

@@ -64,12 +64,16 @@ limitations under the License.
     margin-right: 95px;
 }
 
-/* Removed hidden overflow in order to have hanging elements
+/* all the overflow-y: hidden; are to trap Zalgos -
-   in the message stream gutters. This may re-introduce
+   but they introduce an implicit overflow-x: auto.
+   so make that explicitly hidden too to avoid random
+   horizontal scrollbars occasionally appearing, like in
    https://github.com/vector-im/vector-web/issues/1154
-*/
+    */
 .mx_EventTile_content {
     display: block;
+    overflow-y: hidden;
+    overflow-x: hidden;
 }
 
 /* De-zalgoing */

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

@@ -15,47 +15,51 @@ limitations under the License.
 */
 
 .mx_LinkPreviewWidget {
-    position: relative;
     margin-top: 15px;
+    margin-right: 15px;
+    margin-bottom: 15px;
+    display: -webkit-flex;
+    display: flex;
+    border-left: 4px solid #ddd;
+    color: #888;
 }
 
-.mx_LinkPreviewWidget:before {
+.mx_LinkPreviewWidget_image {
-    position: absolute;
+    -webkit-flex: 0 0 100px;
-    z-index: 1;
+    flex: 0 0 100px;
-    content: '\0020';
+    margin-left: 15px;
-    top: 0;
+    text-align: center;
-    left: -15px;
+    cursor: pointer;
-    width: 1px;
-    height: 100%;
-    background-color: #dddddd;
-}
-
-.mx_LinkPreviewWidget_indicator {
-    position: absolute;
-    z-index: 1;
-    top: 2px;
-    left: -40px;
 }
 
 .mx_LinkPreviewWidget_caption {
-    margin-bottom: 10px;
+    margin-left: 15px;
+    -webkit-flex: 1 1 auto;
+    flex: 1 1 auto;
 }
 
 .mx_LinkPreviewWidget_title {
+    display: inline;
     font-weight: bold;
 }
 
 .mx_LinkPreviewWidget_siteName {
-    opacity: 0.5;
+    display: inline;
-    font-size: 13px;
-    line-height: 18px;
 }
 
-.mx_LinkPreviewWidget_image {
+.mx_LinkPreviewWidget_description {
-    margin-top: 10px;
+    margin-top: 8px;
-    margin-bottom: 10px;
+    white-space: normal;
+    word-break: break-word;
 }
 
-.mx_LinkPreviewWidget_image img {
+.mx_LinkPreviewWidget_cancel {
+    visibility: hidden;
     cursor: pointer;
+    -webkit-flex: 0 0 40px;
+    flex: 0 0 40px;
+}
+
+.mx_LinkPreviewWidget:hover .mx_LinkPreviewWidget_cancel {
+    visibility: visible;
 }

src/skins/vector/img/icon-link.svg

@@ -1,15 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="12px" height="15px" viewBox="0 0 12 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: sketchtool 3.8.3 (29802) - http://www.bohemiancoding.com/sketch -->
-    <title>F06866DA-05C9-4E9B-93BD-F25D93FF5A0B</title>
-    <desc>Created with sketchtool.</desc>
-    <defs></defs>
-    <g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.2">
-        <g id="02_19a-Notification-panel" transform="translate(-262.000000, -233.000000)" stroke="#000000">
-            <g id="icon_link" transform="translate(262.000000, 233.000000)">
-                <path d="M9.95890881,3.86367071 C9.95890881,2.18051719 8.59444328,0.816051666 6.91128976,0.816051666 C5.22813624,0.816051666 3.86367071,2.18051719 3.86367071,3.86367071 L3.86367071,6.87379824 M3.86367071,6.91128976 C3.86367071,8.59444328 5.22813624,9.95890881 6.91128976,9.95890881 C8.59444328,9.95890881 9.95890881,8.59444328 9.95890881,6.91128976 L9.95890881,3.68060995" id="Combined-Shape-Copy" transform="translate(6.911290, 5.387480) rotate(-315.000000) translate(-6.911290, -5.387480) "></path>
-                <path d="M8.43509929,8.43509929 C8.43509929,6.75194576 7.07063376,5.38748024 5.38748024,5.38748024 C3.70432671,5.38748024 2.33986119,6.75194576 2.33986119,8.43509929 L2.33986119,11.4452268 M2.33986119,11.4827183 C2.33986119,13.1658719 3.70432671,14.5303374 5.38748024,14.5303374 C7.07063376,14.5303374 8.43509929,13.1658719 8.43509929,11.4827183 L8.43509929,8.25203852" id="Combined-Shape-Copy-2" transform="translate(5.387480, 9.958909) rotate(-315.000000) translate(-5.387480, -9.958909) "></path>
-            </g>
-        </g>
-    </g>
-</svg>