Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

added syntax highlighting for markdown codes #716

Merged
merged 23 commits into from
Nov 15, 2017
+1,156 −215
Merged

added syntax highlighting for markdown codes #716

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
3031436
added syntax highlighting for markdown codes
mtxr Nov 11, 2017
9be463f
Added highlight to markdown renderer
mtxr Nov 11, 2017
c21db1c
Markdown code change test
mtxr Nov 11, 2017
9005551
Logging marked errors
mtxr Nov 11, 2017
69568ad
Using sanitize
mtxr Nov 11, 2017
057589e
highlight styles
mtxr Nov 11, 2017
43d4725
Removed unsed consoles
mtxr Nov 11, 2017
7e125d9
Using monokai as highlight theme
mtxr Nov 11, 2017
57dc581
Using monokai for all markdown code, syntax highlight working on deta…
mtxr Nov 11, 2017
fff0d9b
Surounded with pre code tags
mtxr Nov 11, 2017
51fad1e
Disable hljs and using rouge for builds
mtxr Nov 13, 2017
d57ea43
fied broken detail page
mtxr Nov 13, 2017
0de3e19
Added minified highlight.js with common languages
mtxr Nov 13, 2017
abc9705
Fixed build script
mtxr Nov 13, 2017
5225bba
Fixed build script to use yarn
mtxr Nov 13, 2017
d46f8d2
Using spreading
mtxr Nov 13, 2017
c1fa4b4
Fixed build script to use yarn
mtxr Nov 13, 2017
e1e4718
Removed submodule
mtxr Nov 13, 2017
93f4e38
Using hightlight statically
mtxr Nov 13, 2017
08e49b0
Using built highlight.js
mtxr Nov 13, 2017
48bf36c
Static highlight.js
mtxr Nov 13, 2017
8d244ae
removed unnecessary changes
mtxr Nov 13, 2017
9693228
style(markdown): simplify css config
Haroenv Nov 13, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 7 additions & 2 deletions _config.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,10 +53,15 @@ gems:
markdown: kramdown
kramdown:
input: GFM
syntax_highlighter: none
syntax_highlighter: rouge

syntax_highlighter_opts:
disable: true
css_class: 'rougeHighlight'
span:
line_numbers: false
block:
line_numbers: false
start_line: 1

sass:
style: compressed
Expand Down
3 changes: 0 additions & 3 deletions _layouts/default.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,7 @@
{% endfor %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/fontawesome/4.7.0/css/font-awesome.min.css" />
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}?t={{ site.time | date_to_xmlschema }}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/monokai.min.css" integrity="sha256-f1pe1glzqtZBNSOEV8RzLjSURph11H7Ieum3EVhASKw=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js" integrity="sha256-/BfiIkHlHoVihZdc6TFuj7MmJ0TWcWsMXkeDFwhi0zw=" crossorigin="anonymous"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.js?unknown=polyfill&excludes=Element"></script>
<script>hljs.initHighlightingOnLoad();</script>
<meta name="google-site-verification" content="DIcCyEkVaGHm864NWzItnt2n6Gg7hz3l47RBIRyxvcQ" />
</head>
<body>
Expand Down
4 changes: 3 additions & 1 deletion _layouts/pages/install.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,9 @@
{% highlight sh %}

{% endhighlight %}
<pre ><code class="bash">yarn --version</code></pre>
<div class="language-sh highlighter-rouge">
<pre class="rougeHighlight"><code>yarn --version</code></pre>
</div>

<h3>{{i18n.docs_nightly}}</h3>
<p>{{i18n.install_nightly_intro}}</p>
Expand Down
4 changes: 3 additions & 1 deletion _sass/_code.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
.rougeHighlight pre {
.rougeHighlight pre,
.rougeHighlight, pre {

background: $gray-dark;
-webkit-font-smoothing: antialiased;
border-left: 4px solid $yarn-blue;
Expand Down
6 changes: 0 additions & 6 deletions js/src/common.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,3 @@ ReactDOM.render(<Search />, document.getElementById('search'));
if (process.env.NODE_ENV === 'production') {
fillLanguageDropdown();
}

$(document).ready(function() {
$('pre code').each(function(i, block) {
hljs.highlightBlock(block);
});
});
8 changes: 6 additions & 2 deletions js/src/lib/Details/Markdown.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,6 @@ const renderAndEscapeMarkdown = ({ source, githubRepo }) => {
}

renderer.code = function(code, lang) {
code = xss(code);
if (lang && hljs.getLanguage(lang)) {
try {
const prepared = hljs.highlight(lang, code);
Expand All @@ -87,7 +86,12 @@ const renderAndEscapeMarkdown = ({ source, githubRepo }) => {
return `<pre><code>${code}</code></pre>`;
};

return marked(source, { renderer, mangle: false, sanitize: true });
const html = marked(source, { renderer, mangle: false });
return xss(html, {
whiteList: Object.assign({}, xss.getDefaultWhiteList(), {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

you can use spreading here if you want, it's supported by our babel config 😄

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks! just changed.

code: ['class'],
}),
});
};

const Markdown = ({ source, githubRepo }) => (
Expand Down