element_calendar.htm 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <html>
  2. <head>
  3. <meta charset="utf-8" />
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <meta name="description" content="" />
  7. <meta name="author" content="Maxim Sokhatsky" />
  8. <title>CALENDAR</title>
  9. <link rel="stylesheet" href="https://n2o.dev/blank.css" />
  10. <link rel="stylesheet" href="https://n2o.dev/zima.css" />
  11. </head>
  12. <body>
  13. <nav>
  14. <a href="https://n2o.dev">DEV</a>
  15. <a href="https://nitro.n2o.dev">ELEMENT</a>
  16. <a href="#" style="background:#ededed;">CALENDAR</a>
  17. <div class="dropdown">
  18. <a onclick="drop()" class="dropbtn">EN</a>
  19. <div id="dropdown" class="dropdown-content">
  20. <a href="https://n2o.dev/deps/nitro/man/ua/element_calendar.htm">UA</a>
  21. <a href="#">EN</a>
  22. </div>
  23. </div>
  24. </nav>
  25. <header>
  26. <a href="../index.html"><img src="https://openmoji.org/data/color/svg/1F525.svg" /></a>
  27. <h1>CALENDAR</h1>
  28. </header>
  29. <main>
  30. <section>
  31. <h3>INTRO</h3>
  32. <p>The CALENDAR module provides a refreshing zero-dependency
  33. JavaScript datepicker <a href="https://github.com/Pikaday/Pikaday">Pikaday</a>.</p>
  34. </section>
  35. <section>
  36. <h3>ERLANG</h3>
  37. <figure><code>
  38. -record(calendar, { ?ELEMENT_BASE(element_calendar2),
  39. autocomplete=true,
  40. autofocus=false,
  41. disabled=false,
  42. form=[],
  43. list=[],
  44. maxDate={2019,2,2},
  45. minDate,
  46. format="YYYY-MM-DD",
  47. pattern=[],
  48. name=[],
  49. step=[],
  50. readonly=[],
  51. required=[],
  52. value={2020,2,2},
  53. placeholder=[],
  54. onSelect=[],
  55. disableDayFn=[],
  56. position=[],
  57. reposition=[],
  58. yearRange=100}).
  59. </code></figure>
  60. </section>
  61. <section>
  62. <h3>HTML5</h3>
  63. <figure><code>
  64. > :erlang.iolist_to_binary(:nitro.render(NITRO.calendar(id: :cal)))
  65. "&lt;input type=\"calendar\"/&gt;"
  66. > :erlang.iolist_to_binary(:nitro.render(:nitro.actions))
  67. "pickers['cal'] = new Pikaday({
  68. field: document.getElementById(''),
  69. firstDay: 0,
  70. i18n: clLangs.ua,
  71. defaultDate: new Date(2019, 10, 7),
  72. setDefaultDate: false,
  73. minDate: null,
  74. maxDate: new Date(2020,10,10),
  75. format: 'YYYY-MM-DD',
  76. onSelect: null,
  77. disableDayFn: null,
  78. position: 'bottom left',
  79. reposition: true,
  80. yearRange: 100});
  81. </code></figure>
  82. </section>
  83. <section>
  84. <h3>UI</h3>
  85. <figure><img src="img/calendar.png" width="320"/></figure>
  86. </section>
  87. <section>
  88. <p>This module may refer to: <b>nitro</b>.</p>
  89. </section>
  90. </main>
  91. <footer>2005—2019 © Synrc Research Center</footer>
  92. <script>function drop(){document.getElementById("dropdown").classList.toggle("show");}</script>
  93. </body></html>