form.html 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <section id="form" data-transition="slide">
  2. <header data-title="Form Elements">
  3. <nav class="box">
  4. <a href="#back" data-router="section" data-label="back"></a>
  5. </nav>
  6. </header>
  7. <article class="active scroll">
  8. <form class="margined">
  9. <input type="search" placeholder="type your search" />
  10. <a href="#" class="button theme" data-icon="search"></a>
  11. <div class="six columns">
  12. <label>Address</label>
  13. <input type="text" placeholder="placeholder"/>
  14. </div>
  15. <div class="three columns right">
  16. <label>Pin Code</label>
  17. <input type="password" value="value" disabled/>
  18. </div>
  19. <textarea></textarea>
  20. <label>Select your skill</label>
  21. <label class="select">
  22. <select class="custom">
  23. <option value="1">HTML5 Jedi</option>
  24. <option value="2">Two</option>
  25. <option value="3">Three</option>
  26. </select>
  27. </label>
  28. <label>Progress of project</label>
  29. <div id="progress-normal" data-progress="25%"></div>
  30. <label>Range 50%</label>
  31. <input type="range" placeholder="type your name" />
  32. <div class="one row">
  33. <input type="range" min="0" max="1" class="checkbox left" value="0">
  34. <input type="range" min="0" max="1" class="checkbox right active" value="1">
  35. </div>
  36. <div class="four columns s">
  37. <a href="#" class="button anchosr accept" data-label="Accept" data-icon="check"></a>
  38. </div>
  39. <div class="four columns s">
  40. <a href="#" class="button anchsor cancel" data-label="Cancel" data-icon="close"></a>
  41. </div>
  42. </form>
  43. </article>
  44. </section>