diff --git a/src/skins/vector/css/common.css b/src/skins/vector/css/common.css index c22a7def04..911d5e1de8 100644 --- a/src/skins/vector/css/common.css +++ b/src/skins/vector/css/common.css @@ -46,6 +46,14 @@ h2 { margin-bottom: 16px; } +a { + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + a:hover, a:link, a:visited { diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css index 676983b3b3..8693bdfdb5 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css @@ -64,16 +64,12 @@ limitations under the License. margin-right: 95px; } -/* all the overflow-y: hidden; are to trap Zalgos - - but they introduce an implicit overflow-x: auto. - so make that explicitly hidden too to avoid random - horizontal scrollbars occasionally appearing, like in +/* Removed hidden overflow in order to have hanging elements + in the message stream gutters. This may re-introduce https://github.com/vector-im/vector-web/issues/1154 - */ +*/ .mx_EventTile_content { display: block; - overflow-y: hidden; - overflow-x: hidden; } /* Various markdown overrides */ diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/LinkPreviewWidget.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/LinkPreviewWidget.css index ed470c0039..0167660906 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/LinkPreviewWidget.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/LinkPreviewWidget.css @@ -15,51 +15,47 @@ 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_image { - -webkit-flex: 0 0 100px; - flex: 0 0 100px; - margin-left: 15px; - text-align: center; - cursor: pointer; +.mx_LinkPreviewWidget:before { + position: absolute; + z-index: 1; + content: '\0020'; + top: 0; + left: -15px; + width: 1px; + height: 100%; + background-color: #dddddd; +} + +.mx_LinkPreviewWidget_indicator { + position: absolute; + z-index: 1; + top: 2px; + left: -40px; } .mx_LinkPreviewWidget_caption { - margin-left: 15px; - -webkit-flex: 1 1 auto; - flex: 1 1 auto; + margin-bottom: 10px; } .mx_LinkPreviewWidget_title { - display: inline; font-weight: bold; } .mx_LinkPreviewWidget_siteName { - display: inline; + opacity: 0.5; + font-size: 13px; + line-height: 18px; } -.mx_LinkPreviewWidget_description { - margin-top: 8px; - white-space: normal; - word-break: break-word; +.mx_LinkPreviewWidget_image { + margin-top: 10px; + margin-bottom: 10px; } -.mx_LinkPreviewWidget_cancel { - visibility: hidden; +.mx_LinkPreviewWidget_image img { cursor: pointer; - -webkit-flex: 0 0 40px; - flex: 0 0 40px; -} - -.mx_LinkPreviewWidget:hover .mx_LinkPreviewWidget_cancel { - visibility: visible; } diff --git a/src/skins/vector/img/icon-link.svg b/src/skins/vector/img/icon-link.svg new file mode 100644 index 0000000000..683299785b --- /dev/null +++ b/src/skins/vector/img/icon-link.svg @@ -0,0 +1,15 @@ + + + + F06866DA-05C9-4E9B-93BD-F25D93FF5A0B + Created with sketchtool. + + + + + + + + + + \ No newline at end of file