flutter/dev/snippets/config/skeletons/application.html
Greg Spencer 094f93dfcf
Fixes several bugs in samples, quotes HTML properly, and pre-compiles snippet tool. (#24020)
When converting all of the samples to use the snippet tool, I encountered some bugs/shortcomings:

1. The document production took 90 minutes, since the snippet tool was being invoked from the command line each time. I fixed this by snapshotting the executable before running, so it's down to 7 minutes.

2. The sample code was not being properly escaped by the snippet tool, so generics were causing issues in the HTML output. It is now quoted.

3. Code examples that used languages other than Dart were not supported. Anything that highlight.js was compiled for dartdoc with is now supported.

4. The comment color for highlight.js was light grey on white, which was pretty unreadable. It's now dark green and bold.
2018-11-07 08:29:14 -08:00

35 lines
1.4 KiB
HTML

{@inject-html}
<div class="snippet-buttons">
<button id="shortSnippetButton" onclick="showSnippet(shortSnippet);" selected>Sample</button>
<button id="longSnippetButton" onclick="showSnippet(longSnippet);">Sample in an App</button>
</div>
<div class="snippet-container">
<div class="snippet" id="shortSnippet">
<div class="snippet-description">
{@end-inject-html}
{{description}}
{@inject-html}
</div>
<div class="copyable-container">
<button class="copy-button-overlay copy-button" title="Copy to clipboard"
onclick="copyTextToClipboard();">
<i class="material-icons copy-image">assignment</i>
</button>
<pre class="language-{{language}}"><code class="language-{{language}}">{{code}}</code></pre>
</div>
</div>
<div class="snippet" id="longSnippet" hidden>
<div class="snippet-description">To create a sample project with this code snippet, run:<br/>
<span class="snippet-create-command">flutter create --sample={{id}} mysample</span>
</div>
<div class="copyable-container">
<button class="copy-button-overlay copy-button" title="Copy to clipboard"
onclick="copyTextToClipboard();">
<i class="material-icons copy-image">assignment</i>
</button>
<pre class="language-{{language}}"><code class="language-{{language}}">{{app}}</code></pre>
</div>
</div>
</div>
{@end-inject-html}