forked from tohe/wmdeit_kaform
				
			
		
			
				
	
	
		
			247 lines
		
	
	
		
			6.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
			
		
		
	
	
			247 lines
		
	
	
		
			6.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
<!doctype html>
 | 
						|
<html >
 | 
						|
<head>
 | 
						|
	<title>Kostenerstattungsforumlar</title>
 | 
						|
	<meta charset="utf-8">
 | 
						|
	
 | 
						|
	<meta name="viewport" content="width=device-width, initial-scale=1">
 | 
						|
 | 
						|
	<!-- Kube CSS -->
 | 
						|
	<link rel="stylesheet" href="css/kube.min.css">
 | 
						|
	<link rel="stylesheet" href="addons/kube-addons.min.css" />
 | 
						|
 | 
						|
	<link rel="stylesheet" href="master.css" />
 | 
						|
 | 
						|
</head>
 | 
						|
<body>
 | 
						|
	<div class="page is-container">
 | 
						|
	<div class="main-sidebar">
 | 
						|
		<img alt="wikimedia logo" src="wmde.png"/>
 | 
						|
	</div>      
 | 
						|
	<div class="main-content">
 | 
						|
    
 | 
						|
		<h1>Auslagenersatz</h1>
 | 
						|
		<p>Du möchtest dir Kosten erstatten lassen, welche im Rahmen deines
 | 
						|
		Projektes entstanden sind?<BR>
 | 
						|
		Bitte fülle dieses Formular aus ...
 | 
						|
		</p>
 | 
						|
 | 
						|
		<form data-kube="kaform" name="theform" id="theform" action="submit.php" method="POST">
 | 
						|
 | 
						|
		<div class="is-row">
 | 
						|
		<div class="is-col is-70">
 | 
						|
			<fieldset>
 | 
						|
				<legend>1. Erfasse deine Stammdaten</legend>
 | 
						|
				<div class="is-row">
 | 
						|
					<div class="is-col"> 
 | 
						|
						<input required type="input"
 | 
						|
						size="32" id="nickname" name="nickname"
 | 
						|
						placeholder="Nickname*" />
 | 
						|
					</div>
 | 
						|
					<div class="is-col"> 
 | 
						|
						<input required type="input"
 | 
						|
						   size="32" id="projekt" name="project"
 | 
						|
						   placeholder="Projekt-ID*" />
 | 
						|
					</div>
 | 
						|
				</div>
 | 
						|
				<br>
 | 
						|
				<div class="is-row">
 | 
						|
					<div class="is-col"> 
 | 
						|
						<input required type="input" size="32"
 | 
						|
				`			name="realname" placeholder="Realname*" />
 | 
						|
					</div>
 | 
						|
					<div class="is-col"> 
 | 
						|
					</div>
 | 
						|
				</div>
 | 
						|
				<br>
 | 
						|
				<div class="is-row">
 | 
						|
					<div class="is-col"> 
 | 
						|
						<input required type="email" size="32" id="email"
 | 
						|
							name="email" placeholder="E-Mail-Adresse*" />
 | 
						|
					</div>
 | 
						|
					<div class="is-col"> 
 | 
						|
					</div>
 | 
						|
				</div>
 | 
						|
				<br>
 | 
						|
 | 
						|
				<div class="is-row">
 | 
						|
					<div class="is-col"> 
 | 
						|
 | 
						|
					<nav class="tabs" data-kube="tabs" data-equal="false">
 | 
						|
					<a href="#tab1" class="is-active">Banküberweisung</a>
 | 
						|
					<a href="#tab2">Banküberweisung(Non-EU)</a>
 | 
						|
					<a href="#tab3">PayPal</a>
 | 
						|
					<a href="#tab4">Barauszahlung</a>
 | 
						|
					</nav>
 | 
						|
 | 
						|
					<section id="tab1">
 | 
						|
						<div class="is-row">
 | 
						|
						<div class="is-col">
 | 
						|
						<input type="input" size="32" name="Owner" placeholder="Kontoinhaber" />
 | 
						|
						</div>
 | 
						|
						<div class="is-col">
 | 
						|
						</div>
 | 
						|
						</div>
 | 
						|
						<br>
 | 
						|
 | 
						|
						<div class="is-row">
 | 
						|
						<div class="is-col">
 | 
						|
			<input type="input" size="32" id="iban" name="IBAN" placeholder="IBAN*" />
 | 
						|
 | 
						|
 | 
						|
						</div>
 | 
						|
						<div class="is-col">
 | 
						|
			<input type="input" size="32" id="bic" name="BIC" placeholder="BIC*" />
 | 
						|
						</div>
 | 
						|
						</div>
 | 
						|
						<br>
 | 
						|
			<input type="input" size="32" id="bic" name="purpose" placeholder="Verwendungszweck" />
 | 
						|
 | 
						|
					</section>
 | 
						|
 | 
						|
 | 
						|
					<section id="tab2">
 | 
						|
						<div class="is-row">
 | 
						|
						<div class="is-col">
 | 
						|
						<input type="input" size="32" name="Owner" placeholder="Kontoinhaber" />
 | 
						|
						</div>
 | 
						|
						<div class="is-col">
 | 
						|
						</div>
 | 
						|
						</div>
 | 
						|
						<br>
 | 
						|
 | 
						|
						<div class="is-row">
 | 
						|
						<div class="is-col">
 | 
						|
			<input type="input" size="32" id="iban" name="IBAN" placeholder="Kontonummer*" />
 | 
						|
 | 
						|
 | 
						|
						</div>
 | 
						|
						<div class="is-col">
 | 
						|
			<input type="input" size="32" id="bic" name="BIC" placeholder="BIC/SWIFT*" />
 | 
						|
						</div>
 | 
						|
						</div>
 | 
						|
						<br>
 | 
						|
			<input class="EU nonEU" type="input" size="32" id="bank" name="Bankname" placeholder="Name der Bank*" />
 | 
						|
						<br>
 | 
						|
 | 
						|
			<textarea  class="nonEU" name="bankaddress" id="bankaddress" style="resize:both;" cols="32" rows="4" placeholder="Adresse der Bank (Strasse und Hausnummer/Postleitzahl/Land)"></textarea>
 | 
						|
			<br>
 | 
						|
			<textarea name="address" lang="de" class="nonEU" id="address" style="resize:both;" cols="32" rows="4" placeholder="Deine Anschrift (Srtasse und Hausnummer/Postleitzahl/Land)
 | 
						|
"></textarea>
 | 
						|
			<br>
 | 
						|
 | 
						|
 | 
						|
 | 
						|
			<input type="input" size="32" id="bic" name="purpose" placeholder="Verwendungszweck" />
 | 
						|
 | 
						|
 | 
						|
					</section>
 | 
						|
					<section id="tab3">
 | 
						|
						<input class="paypal" type="input" size="32"
 | 
						|
						       id="paypal" placeholder="Dein PayPal Account (paypal@example.com)" />
 | 
						|
	
 | 
						|
 | 
						|
					</section>
 | 
						|
					<section id="tab4">
 | 
						|
					</section>
 | 
						|
 | 
						|
 | 
						|
 | 
						|
					</div> <!-- i-col -->
 | 
						|
				</div> <!-- is-row -->
 | 
						|
 | 
						|
			</fieldset>
 | 
						|
 | 
						|
		</div>
 | 
						|
		<div class="is-col ">
 | 
						|
			Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext Hilfetext
 | 
						|
		</div>
 | 
						|
		</div> <!-- is row -->
 | 
						|
 | 
						|
		<br>
 | 
						|
 | 
						|
		<div class="is-row">
 | 
						|
		<div class="is-col is-70">
 | 
						|
			<fieldset>
 | 
						|
				<legend>2. Erfasse deine Ausgaben</legend>
 | 
						|
				<div class="is-row">
 | 
						|
					<div class="is-col is-70">
 | 
						|
						<div class="is-row">
 | 
						|
							<div class="is-col is-60">
 | 
						|
								<input id="a_type" type="text" name="type" placeholder="Auslagenart*"/> 
 | 
						|
							</div>
 | 
						|
							<div class="is-col is-40">
 | 
						|
								<input id="a_date" type="date" name="type" placeholder="Datum*"/> 
 | 
						|
							</div>
 | 
						|
						</div>
 | 
						|
						<br>
 | 
						|
						<input id="a_description" type="text" name="description" placeholder="Beschreibung*"/> 
 | 
						|
						<br>
 | 
						|
 | 
						|
						<div class="is-row">
 | 
						|
							<div class="is-col">
 | 
						|
								<input id="a_amount" type="text" name="amount" placeholder="Betrag*"/> 
 | 
						|
							</div>
 | 
						|
							<div class="is-col">
 | 
						|
								<input id="a_currency" type="text" name="curreny" placeholder="Waehrung*"/> 
 | 
						|
							</div>
 | 
						|
							<div class="is-col">
 | 
						|
								<button type="button" onclick="addTableRow();" 
 | 
						|
									class="button is-green">Ausgabe hinzufügen</button>
 | 
						|
							</div>
 | 
						|
						</div>							
 | 
						|
 | 
						|
					</div>
 | 
						|
					<div  class="is-col is-30">
 | 
						|
						<div id="uploadfield" class="form-item">
 | 
						|
						</div>
 | 
						|
					</div>
 | 
						|
				</div>	
 | 
						|
				<br>
 | 
						|
				<table id="tabtab" class="is-bordered is-striped">
 | 
						|
				<thead>
 | 
						|
				<tr>
 | 
						|
					<th>Auslagenart</th>
 | 
						|
					<th>Datum</th>
 | 
						|
					<th>Beschreibung</th>
 | 
						|
					<th>Betrag</th>
 | 
						|
					<th>Währung</th>
 | 
						|
					<th>Löschen</th>
 | 
						|
				</tr>
 | 
						|
				</thead>
 | 
						|
				<tbody id="tabbody">
 | 
						|
				</tbody>
 | 
						|
	    
 | 
						|
				</table>
 | 
						|
			</fieldset>
 | 
						|
		</div>
 | 
						|
		<div class="is-col">
 | 
						|
			hilfe 2
 | 
						|
		</div>
 | 
						|
			
 | 
						|
		</div>
 | 
						|
		<button onclick="addTableRow();"
 | 
						|
			class="button is-green">Antrag elektronisch versenden</button>
 | 
						|
		<button type="button" onclick="alert('hello');"
 | 
						|
			class="button is-orange">Herunterladen</button>
 | 
						|
	
 | 
						|
		</div>
 | 
						|
	</div>
 | 
						|
	  
 | 
						|
  
 | 
						|
	<!--		<input type="submit" style="display:none" name="submitButton" />   -->
 | 
						|
	</form>
 | 
						|
	
 | 
						|
 | 
						|
	
 | 
						|
	
 | 
						|
	<!-- Kube JS (optional if you are using Kube CSS only) -->
 | 
						|
	<script src="js/kube.min.js"></script>
 | 
						|
	<script src="addons/upload/kube.upload.min.js"></script>
 | 
						|
	<script src="addons/kube-addons.min.js"></script>
 | 
						|
	<script src="kaform.js"></script>
 | 
						|
      </div>
 | 
						|
    </div>    
 | 
						|
  </body>
 | 
						|
</html>
 |