Iosevka/specimen.html
2015-12-11 06:03:58 +08:00

38 lines
2.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Iosevka</title>
<style>@import url(specimen.css);</style>
<script src="https://cdn.bootcss.com/vue/1.0.7/vue.min.js"></script>
<script>if (!window.Vue) document.write('<script src="vue.min.js">\x3C/script>')</script>
<script src="https://cdn.bootcss.com/vue-resource/0.1.17/vue-resource.min.js"></script>
<script>if (!window.Vue.resource) document.write('<script src="vue-resource.min.js">\x3C/script>')</script>
<link href="https://cdn.bootcss.com/simple-line-icons/2.2.3/css/simple-line-icons.css" rel="stylesheet">
</head>
<body>
<div id="picker">
<span class="title pp {{current.cls}}">{{current.display}} Specimen<span class="icon icon-menu"></span></span>
<div class="menu">
<div class="group" v-for="group in fonts">
<a href="#" v-for="item in group" v-on:click.prevent="choose(item)" class="pp {{item.cls}} {{item === current ? 'active' : ''}}">{{item.display}}</a>
</div>
</div>
</div>
<div id="display" class="show {{currentFont.cls}}">
<p class="waterfall" v-for="size in waterfall" style="font-size:{{size / 14}}rem">int Fox.quick(h){ isBrown &amp;&amp; jumpOver(doges.lazy) }</p>
<p class="lipsum" v-for="item in lipsums">{{item}}</p>
<pre><code class=patel><span class=keyword>define</span> samples : <span class=keyword>object</span><template v-for="sample in samples">
{<span class=qualifier>.lang</span> <span class=string>'{{sample.lang}}'</span>{{sample.spaces}}<span class=qualifier>.sample</span> <span class=string lang="{{sample.code}}">'{{{sample.sample}}}'</span>}<span class=comment>{{sample.comment}}</span></template></code></pre>
<table class="block">
<tr class="row" v-for="row in sampleRows">
<td class="indicator"><s>x</s><n>U+{{row.startIndex}}</n></td>
<template v-for="char in row.chars">
<td class="{{char.name ? 'present' : 'missing'}}" title="{{char.name}}"><d v-if="char.isMark">&#x25CC;</d>{{char.char}}</td>
</template>
</tr>
</table>
</div>
<script src="specimen.js"></script>
</body>
</html>