mirror of
https://github.com/SchildiChat/element-web.git
synced 2024-10-01 01:26:12 -04:00
add target=_blank onto all HTML links, and apply GFM.css for CSS for markdown
This commit is contained in:
parent
4c11de787e
commit
76c6d6d4d6
@ -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",
|
||||
|
@ -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(<span key={ k++ } dangerouslySetInnerHTML={{ __html: safeSearchTerm }} className="mx_MessageTile_searchHighlight" />);
|
||||
lastOffset = offset + safeSearchTerm.length;
|
||||
}
|
||||
bodyList.push(<span key={ k++ } dangerouslySetInnerHTML={{ __html: safeBody.substring(lastOffset) }} />);
|
||||
bodyList.push(<span className="markdown-body" key={ k++ } dangerouslySetInnerHTML={{ __html: safeBody.substring(lastOffset) }} />);
|
||||
}
|
||||
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 = <span dangerouslySetInnerHTML={{ __html: safeBody }} />;
|
||||
body = <span className="markdown-body" dangerouslySetInnerHTML={{ __html: safeBody }} />;
|
||||
}
|
||||
else {
|
||||
body = originalBody;
|
||||
|
@ -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;
|
||||
|
Loading…
Reference in New Issue
Block a user