define(function () {return '<style>{%=previewCss%}</style>\n<style>\n    @font-face {\n        font-family: \'{%=fontFamily%}\';\n        {%if(fontFormat==\'eot\'){%}\n        src: url({%=fontData%});\n        {%} else if(fontFormat==\'ttf\') {%}\n        src: url({%=fontData%}) format(\'truetype\');\n        {%} else {%}\n        src: url({%=fontData%}) format(\'{%=fontFormat%}\');\n        {%}%}\n    }\n    .icon {\n        font-family: \'{%=fontFamily%}\';\n    }\n</style>\n<div class="main">\n    <h1>${lang.preview_title}</h1>\n    <ul class="iconfont-list">\n        {%glyfList.forEach(function(glyf) {%}\n        <li>\n            <i class="icon">{%=glyf.code%}</i>\n            <div class="code">{%=glyf.codeName%}</div>\n            <div class="name">{%=glyf.name%}</div>\n        </li>\n        {%});%}\n    </ul>\n    <div class="helps">${lang.preview_first_step}\n<pre>\n@font-face {\n    font-family: \'{%=fontFamily%}\';\n    src: url(\'{%=fontFamily%}.eot\'); /* IE9*/\n    src: url(\'{%=fontFamily%}.eot?#iefix\') format(\'embedded-opentype\'), /* IE6-IE8 */\n    url(\'{%=fontFamily%}.woff\') format(\'woff\'), /* chrome、firefox */\n    url(\'{%=fontFamily%}.ttf\') format(\'truetype\'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/\n    url(\'{%=fontFamily%}.svg#ux{%=fontFamily%}\') format(\'svg\'); /* iOS 4.1- */\n}\n</pre>\n${lang.preview_second_step}\n<pre>\n.{%=fontFamily%} {\n    font-family: "{%=fontFamily%}" !important;\n    speak: none;\n    font-style: normal;\n    font-weight: normal;\n    font-variant: normal;\n    text-transform: none;\n    line-height: 1;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n}\n\n.icon-tree:after {content: \'\\33\';}\n</pre>\n${lang.preview_third_step}\n<pre>\n    &lt;i class="{%=fontFamily%}"&gt;&amp;#x33&lt;/i&gt;\n\nor\n\n    &lt;i class="{%=fontFamily%} icon-three"&gt;&lt;/i&gt;\n</pre>\n</div>\n</div>\n';});