Sign upLogin

doches/rtypeset

View on GitHub
Star
index.html

Summary

Maintainability
Test Coverage
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>  <span class="pull-T">T</span>ype­set.js – an <span class="small-caps">HTML</span> pre-proces­sor ­for<span class="push-w"></span>  <span class="pull-w">w</span>eb ­ty­pog­ra­phy<span class="push-T"></span>  </title>
  <link rel="icon" type="image/png" href="./demo/favicon.png">
  <link rel="stylesheet" href="./demo/style.css">
  <link rel="stylesheet" href="./demo/typeset.css">
</head>
<body>
  <div class="container">
    <h1>rTypeset</h1>
    <p>A typographic pre-processor for <span class='small-caps'>HTML</span> inspired by <a href="https://blot.im/typeset/">Typeset.js</a> that gives you:</p>
    <ul>
        <li>Real hang­ing punc­tu­a­tion</li>
        <li>Soft hy­phen in­ser­tion</li>
        <li><span class="pull-O">O</span>p­ti­cal mar­gin<span class="push-o"></span> <span class="pull-o">o</span>ut­dents</li>
        <li>Small-caps<span class="push-c"></span> <span class="pull-c">c</span>on­ver­sion</li>
        <li>Punc­tu­a­tion sub­sti­tu­tion</li>
        <li>Space sub­sti­tu­tion</li>
    </ul>
    <div class='prefooter'>&nbsp;</div>
    <h3>Raw</h3>
    <div class="demo">
      <p>Yjarni Sigurðardóttir spoke to NATO from Iceland yesterday: "Light of my life, fire of my florins -- my sin, my soul. The tip of the tongue taking a trip to 118° 19' 43.5"."</p>
      <p>"She's faster than a 120' 4" whale." <em>Piña co­ladas</em> were widely consumed in Götterdämmerung from 1880–1912. For the low price of $20 / year from Ex­hi­bits A–E... Then the <em>duplex</em> came forward. "Thrice the tower, he mounted the round gunrest, 'awaking' HTML. He can print a fixed num­ber of dots in a square inch (for in­stance, 600 × 600)."</p>
    </div>
    <h3>Typeset</h3>
    <div class="demo">
      <p><span class="pull-Y">Y</span>jarni Sig­urðardót­tir spoke to <span class="small-caps">NATO</span> from Ice­land yes­ter­day:<span class="push-double"></span>  <span class="pull-double">“</span>Light<span class="push-o"></span>  <span class="pull-o">o</span>f my life, ­fire<span class="push-o"></span>  <span class="pull-o">o</span>f my florin­s – my s­in, my ­soul.<span class="push-T"></span>  <span class="pull-T">T</span>he tip<span class="push-o"></span>  <span class="pull-o">o</span>f the ­tongue ­tak­ing a trip ­to 118° 19′ 43.5″.”<span class="push-Y"></span><span class="push-Y"></span></p>
      <p><span class="pull-double">“</span>She’s ­faster than a 120′ 4″<span class="push-w"></span>  <span class="pull-w">w</span>hale.”<span class="push-double"></span>  <em>Piña<span class="push-c"></span>  <span class="pull-c">c</span>o­ladas</em>  <span class="pull-w">w</span>ere<span class="push-w"></span>  <span class="pull-w">w</span>idely<span class="push-c"></span>  <span class="pull-c">c</span>onsumed in Göt­ter­däm­merung from 1880–1912. ­For the low price<span class="push-o"></span>  <span class="pull-o">o</span>f $20 / year from Ex­hi­bits<span class="push-A"></span>  <span class="pull-A">A</span>–E…<span class="push-T"></span>  <span class="pull-T">T</span>hen the<span class="push-w"></span>  <em>duplex</em>  <span class="pull-c">c</span>ame ­for­ward.<span class="push-double"></span>  <span class="pull-double">“</span>Thrice the ­tow­er, he ­mount­ed the round ­gun­rest,<span class="push-single"></span>  <span class="pull-single">‘</span>awak­ing’ <span class="small-caps">HTML</span>. He<span class="push-c"></span>  <span class="pull-c">c</span>an print­ a ­fixed num­ber<span class="push-o"></span>  <span class="pull-o">o</span>f dot­s in a square inch (­for in­s­tance, 600 × 600).”<span class="push-c"></span></p>
    </div>
    <h2>Installation</h2>
    <code class='code'>
      gem install rtypeset
    </code>
    <h2>Usage</h2>
    <pre class='code'>
require 'typeset'

raw_html = &lt;&lt;HTM
&lt;p&gt;Yjarni Sigurðardóttir spoke to NATO from Iceland yesterday:
"Light of my life, fire of my florins -- my sin, my soul.
The tip of the tongue taking a trip to 118° 19' 43.5".":&lt;/p&gt;
HTM

# Output beautifully-formatted HTML
puts Typeset.typeset(raw_html)
    </pre>
  </div>
</body>
</html>