26 lines
1.1 KiB
HTML
26 lines
1.1 KiB
HTML
<h2>HTML template literals</h2>
|
|
<pre data-dependencies="markup"><code class="language-javascript">html`
|
|
<p>
|
|
Foo.
|
|
</p>`;</code></pre>
|
|
|
|
<h2>JS DOM</h2>
|
|
<pre data-dependencies="markup"><code class="language-javascript">div.innerHTML = `<p></p>`;
|
|
div.outerHTML = `<p></p>`;</code></pre>
|
|
|
|
<h2><a href="https://github.com/zeit/styled-jsx">styled-jsx</a> CSS template literals</h2>
|
|
<pre data-dependencies="css"><code class="language-javascript">css`a:hover { color: blue; }`;</code></pre>
|
|
|
|
<h2><a href="https://github.com/styled-components/styled-components"><code class="language-none">styled-components</code></a> CSS template literals</h2>
|
|
<pre data-dependencies="css"><code class="language-javascript">const Button = styled.button`
|
|
color: blue;
|
|
background: red;
|
|
`;</code></pre>
|
|
|
|
<h2>Markdown template literals</h2>
|
|
<pre data-dependencies="markdown"><code class="language-javascript">markdown`# My title`;</code></pre>
|
|
|
|
<h2>GraphQL template literals</h2>
|
|
<pre data-dependencies="graphql"><code class="language-javascript">gql`{ foo }`;
|
|
graphql`{ foo }`;</code></pre>
|