icon-row.html 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. <div class="icon-row">
  2. <div class="preview-icon"><span class="step size-12">
  3. <i class="icon {{prefix}}{{name}}"></i>
  4. </span><span class="step size-14">
  5. <i class="icon {{prefix}}{{name}}"></i>
  6. </span><span class="step size-16">
  7. <i class="icon {{prefix}}{{name}}"></i>
  8. </span><span class="step size-18">
  9. <i class="icon {{prefix}}{{name}}"></i>
  10. </span><span class="step size-21">
  11. <i class="icon {{prefix}}{{name}}"></i>
  12. </span><span class="step size-24">
  13. <i class="icon {{prefix}}{{name}}"></i>
  14. </span><span class="step size-32">
  15. <i class="icon {{prefix}}{{name}}"></i>
  16. </span><span class="step size-48">
  17. <i class="icon {{prefix}}{{name}}"></i>
  18. </span><span class="step size-64">
  19. <i class="icon {{prefix}}{{name}}"></i>
  20. </span><span class="step size-96">
  21. <i class="icon {{prefix}}{{name}}"></i>
  22. </span>
  23. </div>
  24. <div class="preview-scale"><span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">32</span><span class="step">48</span><span class="step">64</span><span class="step">96</span></div>
  25. <div class="usage">
  26. <label>Classname:</label>
  27. <input class="name" type="text" readonly="readonly" onClick="this.select();" value="{{prefix}}{{name}}" />
  28. <label>Selectable:</label>
  29. <span class="ion">{{html_code}}</span>
  30. <label>Escaped HTML:</label>
  31. <input class="html" type="text" readonly="readonly" onClick="this.select();" value="{{escaped_html_code}}" />
  32. <label>CSS Content:</label>
  33. <input class="css" type="text" readonly="readonly" onClick="this.select();" value="{{css_code}}" />
  34. </div>
  35. </div>