diff --git a/res/css/views/rooms/_LinkPreviewWidget.scss b/res/css/views/rooms/_LinkPreviewWidget.scss index 4495b142e6..022cf3ed28 100644 --- a/res/css/views/rooms/_LinkPreviewWidget.scss +++ b/res/css/views/rooms/_LinkPreviewWidget.scss @@ -52,12 +52,18 @@ limitations under the License. } .mx_LinkPreviewWidget_cancel { - visibility: hidden; cursor: pointer; - flex: 0 0 40px; + width: 18px; + height: 18px; + + img { + flex: 0 0 40px; + visibility: hidden; + } } -.mx_LinkPreviewWidget:hover .mx_LinkPreviewWidget_cancel { +.mx_LinkPreviewWidget:hover .mx_LinkPreviewWidget_cancel img, +.mx_LinkPreviewWidget_cancel.focus-visible:focus img { visibility: visible; } diff --git a/src/components/views/rooms/LinkPreviewWidget.js b/src/components/views/rooms/LinkPreviewWidget.js index 2e3a3915d0..ee63cd1bb7 100644 --- a/src/components/views/rooms/LinkPreviewWidget.js +++ b/src/components/views/rooms/LinkPreviewWidget.js @@ -1,5 +1,6 @@ /* Copyright 2016 OpenMarket Ltd +Copyright 2019 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -19,6 +20,7 @@ import PropTypes from 'prop-types'; import createReactClass from 'create-react-class'; import { linkifyElement } from '../../../HtmlUtils'; import SettingsStore from "../../../settings/SettingsStore"; +import { _t } from "../../../languageHandler"; const sdk = require('../../../index'); const MatrixClientPeg = require('../../../MatrixClientPeg'); @@ -125,6 +127,7 @@ module.exports = createReactClass({ ; } + const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); return (
{ img } @@ -135,9 +138,10 @@ module.exports = createReactClass({ { p["og:description"] }
- + + + ); }, diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 80604e9090..361319bb6c 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -876,6 +876,7 @@ "Unencrypted": "Unencrypted", "Please select the destination room for this message": "Please select the destination room for this message", "Scroll to bottom of page": "Scroll to bottom of page", + "Close preview": "Close preview", "device id: ": "device id: ", "Disinvite": "Disinvite", "Kick": "Kick",