diff --git a/package.json b/package.json index 3b10970a..fc867ea7 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "classnames": "^2.1.2", "filesize": "^3.1.2", "flux": "~2.0.3", + "gfm.css": "^1.1.1", "linkifyjs": "^2.0.0-beta.4", "matrix-js-sdk": "https://github.com/matrix-org/matrix-js-sdk.git#develop", "matrix-react-sdk": "https://github.com/matrix-org/matrix-react-sdk.git#develop", @@ -37,8 +38,8 @@ "react-dnd-html5-backend": "^2.0.0", "react-dom": "^0.14.2", "react-gemini-scrollbar": "^2.0.1", - "velocity-animate": "^1.2.3", - "sanitize-html": "^1.0.0" + "sanitize-html": "^1.0.0", + "velocity-animate": "^1.2.3" }, "devDependencies": { "babel": "^5.8.23", diff --git a/src/HtmlUtils.js b/src/HtmlUtils.js index ff7af121..52bb7735 100644 --- a/src/HtmlUtils.js +++ b/src/HtmlUtils.js @@ -19,11 +19,31 @@ limitations under the License. var React = require('react'); var sanitizeHtml = require('sanitize-html'); -var allowedAttributes = sanitizeHtml.defaults.allowedAttributes; -allowedAttributes['font'] = ['color']; var sanitizeHtmlParams = { - allowedTags: sanitizeHtml.defaults.allowedTags.concat([ 'font', 'h1', 'h2' ]), - allowedAttributes: allowedAttributes, + allowedTags: [ + 'h1', 'h2', 'font', // custom to matrix + 'h3', 'h4', 'h5', 'h6', 'blockquote', 'p', 'a', 'ul', 'ol', + 'nl', 'li', 'b', 'i', 'strong', 'em', 'strike', 'code', 'hr', 'br', 'div', + 'table', 'thead', 'caption', 'tbody', 'tr', 'th', 'td', 'pre' + ], + allowedAttributes: { + // custom ones first: + font: [ 'color' ], // custom to matrix + a: [ 'href', 'name', 'target' ], // remote target: custom to matrix + // We don't currently allow img itself by default, but this + // would make sense if we did + img: [ 'src' ], + }, + // Lots of these won't come up by default because we don't allow them + selfClosing: [ 'img', 'br', 'hr', 'area', 'base', 'basefont', 'input', 'link', 'meta' ], + // URL schemes we permit + allowedSchemes: [ 'http', 'https', 'ftp', 'mailto' ], + allowedSchemesByTag: {}, + + transformTags: { // custom to matrix + // add blank targets to all hyperlinks + 'a': sanitizeHtml.simpleTransform('a', { target: '_blank'} ) + }, }; module.exports = { @@ -51,7 +71,7 @@ module.exports = { bodyList.push(); lastOffset = offset + safeSearchTerm.length; } - bodyList.push(); + bodyList.push(); } else { while ((offset = originalBody.indexOf(searchTerm, lastOffset)) >= 0) { @@ -66,7 +86,7 @@ module.exports = { else { if (content.format === "org.matrix.custom.html") { var safeBody = sanitizeHtml(content.formatted_body, sanitizeHtmlParams); - body = ; + body = ; } else { body = originalBody; diff --git a/src/skins/vector/css/molecules/EventTile.css b/src/skins/vector/css/molecules/EventTile.css index f092ba28..83fbf60c 100644 --- a/src/skins/vector/css/molecules/EventTile.css +++ b/src/skins/vector/css/molecules/EventTile.css @@ -65,6 +65,27 @@ limitations under the License. margin-right: 100px; } +/* Various markdown overrides */ + +.mx_MessageTile_content .markdown-body { + font-family: inherit ! important; + white-space: normal ! important; +} + +.mx_MessageTile_content .markdown-body h1, +.mx_MessageTile_content .markdown-body h2, +.mx_MessageTile_content .markdown-body h3, +.mx_MessageTile_content .markdown-body h4, +.mx_MessageTile_content .markdown-body h5, +.mx_MessageTile_content .markdown-body h6 +{ + font-family: inherit ! important; +} + +.mx_MessageTile_content .markdown-body a { + color: #76cfa6; +} + .mx_MessageTile_searchHighlight { background-color: #76cfa6; color: #fff;