|
@@ -224,20 +224,20 @@
|
|
|
|
|
|
<section>
|
|
|
<h2>Pretty Code</h2>
|
|
|
- <pre><code class="hljs" data-trim contenteditable>
|
|
|
-function linkify( selector ) {
|
|
|
- if( supports3DTransforms ) {
|
|
|
-
|
|
|
- var nodes = document.querySelectorAll( selector );
|
|
|
-
|
|
|
- for( var i = 0, len = nodes.length; i < len; i++ ) {
|
|
|
- var node = nodes[i];
|
|
|
-
|
|
|
- if( !node.className ) {
|
|
|
- node.className += ' roll';
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ <pre><code class="hljs" data-trim data-line-numbers="4|9|4,8-11">
|
|
|
+import React, { useState } from 'react';
|
|
|
+
|
|
|
+function Example() {
|
|
|
+ const [count, setCount] = useState(0);
|
|
|
+
|
|
|
+ return (
|
|
|
+ <div>
|
|
|
+ <p>You clicked {count} times</p>
|
|
|
+ <button onClick={() => setCount(count + 1)}>
|
|
|
+ Click me
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
}
|
|
|
</code></pre>
|
|
|
<p>Code syntax highlighting courtesy of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
|
|
@@ -394,10 +394,9 @@ Reveal.addEventListener( 'customevent', function() {
|
|
|
|
|
|
// More info https://github.com/hakimel/reveal.js#dependencies
|
|
|
dependencies: [
|
|
|
- { src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
|
|
{ src: 'plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
|
|
{ src: 'plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
|
|
- { src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
|
|
|
+ { src: 'plugin/highlight/highlight.js' },
|
|
|
{ src: 'plugin/search/search.js', async: true },
|
|
|
{ src: 'plugin/zoom-js/zoom.js', async: true },
|
|
|
{ src: 'plugin/notes/notes.js', async: true }
|