You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

246 lines
6.4 KiB

4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
  1. <!doctype html>
  2. <html >
  3. <head>
  4. <title>Kostenerstattungsforumlar</title>
  5. <meta charset="utf-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <!-- Kube CSS -->
  8. <link rel="stylesheet" href="css/kube.min.css">
  9. <link rel="stylesheet" href="addons/kube-addons.min.css" />
  10. <link rel="stylesheet" href="master.css" />
  11. </head>
  12. <body>
  13. <div class="page is-container">
  14. <div class="main-sidebar">
  15. <img alt="wikimedia logo" src="wmde.png"/>
  16. </div>
  17. <div class="main-content">
  18. <h1>Auslagenersatz</h1>
  19. <p>Du möchtest dir Kosten erstatten lassen, welche im Rahmen deines
  20. Projektes entstanden sind?<BR>
  21. Bitte fülle dieses Formular aus ...
  22. </p>
  23. <form data-kube="kaform" name="theform" id="theform" action="submit.php" method="POST">
  24. <div class="is-row">
  25. <div class="is-col is-70">
  26. <fieldset>
  27. <legend>1. Erfasse deine Stammdaten</legend>
  28. <div class="is-row">
  29. <div class="is-col">
  30. <input required type="input"
  31. size="32" id="nickname" name="nickname"
  32. placeholder="Nickname*" />
  33. </div>
  34. <div class="is-col">
  35. <input required type="input"
  36. size="32" id="projekt" name="project"
  37. placeholder="Projekt-ID*" />
  38. </div>
  39. </div>
  40. <br>
  41. <div class="is-row">
  42. <div class="is-col">
  43. <input required type="input" size="32"
  44. ` name="realname" placeholder="Realname*" />
  45. </div>
  46. <div class="is-col">
  47. </div>
  48. </div>
  49. <br>
  50. <div class="is-row">
  51. <div class="is-col">
  52. <input required type="email" size="32" id="email"
  53. name="email" placeholder="E-Mail-Adresse*" />
  54. </div>
  55. <div class="is-col">
  56. </div>
  57. </div>
  58. <br>
  59. <div class="is-row">
  60. <div class="is-col">
  61. <nav class="tabs" data-kube="tabs" data-equal="false">
  62. <a href="#tab1" class="is-active">Banküberweisung</a>
  63. <a href="#tab2">Banküberweisung(Non-EU)</a>
  64. <a href="#tab3">PayPal</a>
  65. <a href="#tab4">Barauszahlung</a>
  66. </nav>
  67. <section id="tab1">
  68. <div class="is-row">
  69. <div class="is-col">
  70. <input type="input" size="32" name="Owner" placeholder="Kontoinhaber" />
  71. </div>
  72. <div class="is-col">
  73. </div>
  74. </div>
  75. <br>
  76. <div class="is-row">
  77. <div class="is-col">
  78. <input type="input" size="32" id="iban" name="IBAN" placeholder="IBAN*" />
  79. </div>
  80. <div class="is-col">
  81. <input type="input" size="32" id="bic" name="BIC" placeholder="BIC*" />
  82. </div>
  83. </div>
  84. <br>
  85. <input type="input" size="32" id="bic" name="purpose" placeholder="Verwendungszweck" />
  86. </section>
  87. <section id="tab2">
  88. <div class="is-row">
  89. <div class="is-col">
  90. <input type="input" size="32" name="Owner" placeholder="Kontoinhaber" />
  91. </div>
  92. <div class="is-col">
  93. </div>
  94. </div>
  95. <br>
  96. <div class="is-row">
  97. <div class="is-col">
  98. <input type="input" size="32" id="iban" name="IBAN" placeholder="Kontonummer*" />
  99. </div>
  100. <div class="is-col">
  101. <input type="input" size="32" id="bic" name="BIC" placeholder="BIC/SWIFT*" />
  102. </div>
  103. </div>
  104. <br>
  105. <input class="EU nonEU" type="input" size="32" id="bank" name="Bankname" placeholder="Name der Bank*" />
  106. <br>
  107. <textarea class="nonEU" name="bankaddress" id="bankaddress" style="resize:both;" cols="32" rows="4" placeholder="Adresse der Bank (Strasse und Hausnummer/Postleitzahl/Land)"></textarea>
  108. <br>
  109. <textarea name="address" lang="de" class="nonEU" id="address" style="resize:both;" cols="32" rows="4" placeholder="Deine Anschrift (Srtasse und Hausnummer/Postleitzahl/Land)
  110. "></textarea>
  111. <br>
  112. <input type="input" size="32" id="bic" name="purpose" placeholder="Verwendungszweck" />
  113. </section>
  114. <section id="tab3">
  115. <input class="paypal" type="input" size="32"
  116. id="paypal" placeholder="Dein PayPal Account (paypal@example.com)" />
  117. </section>
  118. <section id="tab4">
  119. </section>
  120. </div> <!-- i-col -->
  121. </div> <!-- is-row -->
  122. </fieldset>
  123. </div>
  124. <div class="is-col ">
  125. Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext
  126. </div>
  127. </div> <!-- is row -->
  128. <br>
  129. <div class="is-row">
  130. <div class="is-col is-70">
  131. <fieldset>
  132. <legend>2. Erfasse deine Ausgaben</legend>
  133. <div class="is-row">
  134. <div class="is-col is-70">
  135. <div class="is-row">
  136. <div class="is-col is-60">
  137. <input id="a_type" type="text" name="type" placeholder="Auslagenart*"/>
  138. </div>
  139. <div class="is-col is-40">
  140. <input id="a_date" type="date" name="type" placeholder="Datum*"/>
  141. </div>
  142. </div>
  143. <br>
  144. <input id="a_description" type="text" name="description" placeholder="Beschreibung*"/>
  145. <br>
  146. <div class="is-row">
  147. <div class="is-col">
  148. <input id="a_amount" type="text" name="amount" placeholder="Betrag*"/>
  149. </div>
  150. <div class="is-col">
  151. <input id="a_currency" type="text" name="curreny" placeholder="Waehrung*"/>
  152. </div>
  153. <div class="is-col">
  154. <button type="button" onclick="addTableRow();"
  155. class="button is-green">Ausgabe hinzuf&uuml;gen</button>
  156. </div>
  157. </div>
  158. </div>
  159. <div class="is-col is-30">
  160. <div id="uploadfield" class="form-item">
  161. </div>
  162. </div>
  163. </div>
  164. <br>
  165. <table id="tabtab" class="is-bordered is-striped">
  166. <thead>
  167. <tr>
  168. <th>Auslagenart</th>
  169. <th>Datum</th>
  170. <th>Beschreibung</th>
  171. <th>Betrag</th>
  172. <th>W&auml;hrung</th>
  173. <th>L&ouml;schen</th>
  174. </tr>
  175. </thead>
  176. <tbody id="tabbody">
  177. </tbody>
  178. </table>
  179. </fieldset>
  180. </div>
  181. <div class="is-col">
  182. hilfe 2
  183. </div>
  184. </div>
  185. <button onclick="addTableRow();"
  186. class="button is-green">Antrag elektronisch versenden</button>
  187. <button type="button" onclick="alert('hello');"
  188. class="button is-orange">Herunterladen</button>
  189. </div>
  190. </div>
  191. <!-- <input type="submit" style="display:none" name="submitButton" /> -->
  192. </form>
  193. <!-- Kube JS (optional if you are using Kube CSS only) -->
  194. <script src="js/kube.min.js"></script>
  195. <script src="addons/upload/kube.upload.min.js"></script>
  196. <script src="addons/kube-addons.min.js"></script>
  197. <script src="kaform.js"></script>
  198. </div>
  199. </div>
  200. </body>
  201. </html>