From 8a7477f50cba19d98d901007b87561a52a181382 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Wed, 20 Dec 2017 20:40:41 +0000 Subject: [PATCH] Highlight ViewSource and Devtools ViewSource Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/ViewSource.js | 15 +++--- .../views/dialogs/DevtoolsDialog.js | 9 +++- src/components/views/elements/Highlight.js | 51 +++++++++++++++++++ src/skins/vector/css/_components.scss | 1 + .../vector-web/views/elements/_Highlight.scss | 21 ++++++++ 5 files changed, 89 insertions(+), 8 deletions(-) create mode 100644 src/components/views/elements/Highlight.js create mode 100644 src/skins/vector/css/vector-web/views/elements/_Highlight.scss diff --git a/src/components/structures/ViewSource.js b/src/components/structures/ViewSource.js index a0e198ce..8f60ae88 100644 --- a/src/components/structures/ViewSource.js +++ b/src/components/structures/ViewSource.js @@ -16,14 +16,17 @@ limitations under the License. 'use strict'; -var React = require('react'); +import React from 'react'; +import PropTypes from 'prop-types'; +import Highlight from '../views/elements/Highlight'; + module.exports = React.createClass({ displayName: 'ViewSource', propTypes: { - content: React.PropTypes.object.isRequired, - onFinished: React.PropTypes.func.isRequired, + content: PropTypes.object.isRequired, + onFinished: PropTypes.func.isRequired, }, componentDidMount: function() { @@ -45,9 +48,9 @@ module.exports = React.createClass({ render: function() { return (
- {JSON.stringify(this.props.content, null, 2)} -+
{ JSON.stringify(this.state.event.event, null, 2) }+
{ JSON.stringify(this.state.event.event, null, 2) }+
+ { children }
+
;
+ }
+}
diff --git a/src/skins/vector/css/_components.scss b/src/skins/vector/css/_components.scss
index 0dd6a1b1..c01a7dcf 100644
--- a/src/skins/vector/css/_components.scss
+++ b/src/skins/vector/css/_components.scss
@@ -91,6 +91,7 @@
@import "./vector-web/views/dialogs/_SetEmailDialog.scss";
@import "./vector-web/views/dialogs/_SetPasswordDialog.scss";
@import "./vector-web/views/directory/_NetworkDropdown.scss";
+@import "./vector-web/views/elements/_Highlight.scss";
@import "./vector-web/views/elements/_ImageView.scss";
@import "./vector-web/views/elements/_InlineSpinner.scss";
@import "./vector-web/views/elements/_Spinner.scss";
diff --git a/src/skins/vector/css/vector-web/views/elements/_Highlight.scss b/src/skins/vector/css/vector-web/views/elements/_Highlight.scss
new file mode 100644
index 00000000..9b35844f
--- /dev/null
+++ b/src/skins/vector/css/vector-web/views/elements/_Highlight.scss
@@ -0,0 +1,21 @@
+/*
+Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+.mx_Highlight {
+ /* inhibit hljs styling */
+ background: none !important;
+ color: $light-fg-color !important;
+}