form.html 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <section id="form" data-transition="slide">
  2. <header data-title="Form Elements">
  3. <nav class="button">
  4. <a href="#back" data-router="section" data-label="back"></a>
  5. </nav>
  6. </header>
  7. <article class="scroll list">
  8. <form>
  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 left">
  37. <a href="#" class="button big theme" data-label="Accept" data-icon="check"></a>
  38. </div>
  39. <div class="four columns right">
  40. <a href="#" class="button big red" data-label="Cancel" data-icon="close"></a>
  41. </div>
  42. </form>
  43. </ul>
  44. </article>
  45. </section>