1
0
Fork 0
wmdeit_kaform/kostenerstattung.html

498 lines
25 KiB
HTML
Raw Normal View History

2020-02-20 13:45:47 +00:00
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Kostenerstattungsantrag Wikimedia Deutschland e.V.</title>
<link rel="stylesheet" href="kostenerstattung.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="polyfiller.js"></script>
<script src="iban.js/iban.js"></script>
<script>
var eintraege = 0;
function neuerIndex()
{
var aufstellung = document.getElementById('Aufstellung'),
eintraege = document.querySelectorAll('#Aufstellung tbody tr');
for(var n = 0; n < eintraege.length; n++)
{
eintraege[n].querySelector('legend').textContent = n+1+'. Position';
}
}
function checkIban()
{
iban = document.getElementById('iban');
if( document.getElementById('eu').checked ) {
if(IBAN.isValid(iban.value))
{
if(iban.classList.contains('invalid')) iban.classList.remove('invalid');
iban.classList.add('valid');
}
else
{
if(iban.classList.contains('valid')) iban.classList.remove('valid');
iban.classList.add('invalid');
}
} else {
if(iban.classList.contains('invalid')) iban.classList.remove('invalid');
if(iban.classList.contains('valid')) iban.classList.remove('valid');
}
}
function neueZeileGebraucht()
{
var eintraege = document.querySelectorAll('#Aufstellung tbody tr');
if(2 === eintraege.length)
{
addLine();
return true;
}
var datum = document.getElementById('Datum['+(eintraege.length-1)+']'),
betrag = document.getElementById('Betrag['+(eintraege.length-1)+']');
if("" !== datum.value || "0.00" !== betrag.value) addLine();
}
function aktualisiereSumme()
{
var aufstellung = document.getElementById('Aufstellung'),
eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
summe = 0-parseFloat(document.getElementById('vorschuss').value);
for(var e = 1; e < eintraege.length-1; e++)
{
// console.log('aktualisiereSumme/Summe: '+summe);
// console.log('aktualisiereSumme/eintraege[e].id: '+eintraege[e].id);
var id = parseInt(eintraege[e].id.match(/(\d+)/)[0]);
summe += parseFloat(document.getElementById('Betrag['+id+']').querySelector('input').value);
}
document.getElementById('Summe').textContent = summe.toLocaleString(false, { minimumFractionDigits: 2, useGrouping: true } );
// document.getElementById('Summe').textContent = summe.toFixed(2).toLocaleString();
}
function checkForUpdates()
{
// neueZeileGebraucht();
aktualisiereSumme();
}
function erstellePosition(p)
{
var vorlage = document.getElementById('neuerEintrag'),
neuerEintrag, inputs, labels, spans, textareas, tds;
neuerEintrag = document.importNode(vorlage.content, true);
neuerEintrag.querySelector('tr').id='Reihe['+p+']';
tds = neuerEintrag.querySelectorAll('td');
tds[0].id = 'Position['+p+']';
tds[1].id = 'Beschreibung['+p+']';
tds[2].id = 'Belegdatum['+p+']';
tds[3].id = 'Betrag['+p+']';
tds[4].id = 'Delete['+p+']';
tds[0].textContent = p;
tds[4].querySelector('button').onclick = delLine;
tds[4].querySelector('button').ontouch = delLine;
tds[3].querySelector('input').onchange = checkForUpdates;
spans = neuerEintrag.querySelectorAll('span');
return neuerEintrag;
}
function fadeIn(element)
{
console.log('Fading in');
var op = 0.1; // initial opacity
element.style.opacity = 0;
element.style.filter = 'alpha(opacity=0)';
element.style.display = 'table-row';
var timer = setInterval(function ()
{
element.style.opacity = op;
element.style.filter = 'alpha(opacity=' + op * 100 + ")";
op += op * 0.1;
if (op >= 1)
{
clearInterval(timer);
element.style.opacity = 1;
element.style.filter = 'alpha(opacity=100)';
}
}, 10);
}
function fadeOut(element)
{
console.log('Fading out');
var op = 1; // initial opacity
var timer = setInterval(function ()
{
if (op <= 0.1)
{
clearInterval(timer);
element.style.display = 'none';
}
element.style.opacity = op;
element.style.filter = 'alpha(opacity=' + op * 100 + ")";
op -= 0.05;
}, 25);
}
function removeAfterTimeout(element)
{
console.log('Removing '+element.id);
var eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
aufstellung = document.getElementById('Aufstellung'),
currentId = parseInt(element.id.match(/(\d+)/)[0]);
element.parentNode.removeChild(document.getElementById('Reihe['+currentId+']'));
// console.log('removeAfterTimeout/currentId: '+currentId);
// console.log('removeAfterTimeout/eintraege.length: '+eintraege.length);
if((currentId+1) < (eintraege.length))
{
// if there are more entries after the one supposed to be deleted, change their index values to match their new position
for(var i = currentId+1; i < eintraege.length-1; i++)
{
// console.log('removeAfterTimeout/i: '+i);
var regex = new RegExp(/\d+/),
newIdx = i-1,
pos = document.getElementById('Reihe['+i+']');
// console.log('removeAfterTimeout/newIdx: '+newIdx);
// console.log('removeAfterTimeout/pos.id before: '+pos.id);
pos.id=pos.id.replace(regex,newIdx);
// console.log('removeAfterTimeout/pos.id after: '+pos.id);
for(var n = 0; n < pos.childNodes.length; n++)
{
if(1 == pos.childNodes[n].nodeType)
{
pos.childNodes[n].id=pos.childNodes[n].id.replace(/\d/,newIdx);
}
}
document.getElementById('Position['+newIdx+']').textContent = newIdx;
}
}
checkForUpdates();
}
function delLine()
{
var eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
aufstellung = document.getElementById('Aufstellung');
var current = this.parentNode.parentNode;
console.log(current);
fadeOut(current);
setTimeout(removeAfterTimeout, 1100, current);
}
function addLine()
{
var eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
aufstellung = document.getElementById('Aufstellung').querySelector('tbody');
var neu = erstellePosition(eintraege.length-1);
aufstellung.insertBefore(neu,document.getElementById('more'));
// var eingefuegt = aufstellung.querySelector('fieldset:last-of-type');
var eingefuegt = aufstellung.querySelector('tr:nth-last-of-type(2)');
// neuerIndex();
console.log('Adding '+eingefuegt.id);
fadeIn(eingefuegt);
}
function splitDateString(date) { return date.match(/(\d{4})-(\d{2})-(\d{2})/); }
function splitTimeString(time) { return time.match(/(\d{2}):(\d{2})/); }
function restoreFromCookie()
{
var c = document.cookie.match(new RegExp('Kostenerstattung' + '=([^;]+)'));
console.log(c);
if(c) {
c && (c = JSON.parse(c[1]));
document.getElementById('projekt').value = c.projekt;
document.getElementById('ansprech').value = c.ansprech;
document.getElementById('real').value = c.real;
document.getElementById('email').value = c.email;
document.getElementById('phone').value = c.phone;
document.getElementById('iban').value = c.iban;
document.getElementById('bic').value = c.bic;
document.getElementById('bank').value = c.bank;
}
}
function storeToCookie()
{
var c =
{
'projekt': document.getElementById('projekt').value,
'ansprech': document.getElementById('ansprech').value,
'real': document.getElementById('real').value,
'email': document.getElementById('email').value,
'phone': document.getElementById('phone').value,
'iban': document.getElementById('iban').value,
'bic': document.getElementById('bic').value,
'bank': document.getElementById('bank').value,
};
document.cookie = 'Kostenerstattung='+JSON.stringify(c)+'; domain='+window.location.host.toString()+'; path=/extern; expires='+(new Date().getTime()+1000*60*60*24*365);
}
function init() {
document.getElementById("printDE_top").addEventListener('click', function() { window.print(); }, true);
document.getElementById("printEN_top").addEventListener('click', function() { window.print(); }, true);
document.getElementById("printDE_top").addEventListener('touch', function() { window.print(); }, true);
document.getElementById("printEN_top").addEventListener('touch', function() { window.print(); }, true);
document.getElementById("printDE_bottom").addEventListener('click', function() { window.print(); }, true);
document.getElementById("printEN_bottom").addEventListener('click', function() { window.print(); }, true);
document.getElementById("printDE_bottom").addEventListener('touch', function() { window.print(); }, true);
document.getElementById("printEN_bottom").addEventListener('touch', function() { window.print(); }, true);
document.getElementById('vorschuss').addEventListener('change', aktualisiereSumme);
document.getElementById('iban').addEventListener('change', checkIban);
/* document.getElementById('save').addEventListener('click', storeToCookie);
document.getElementById('save').addEventListener('touch', storeToCookie);*/
document.getElementById('addbutton_de').addEventListener('click', addLine);
document.getElementById('addbutton_de').addEventListener('touch', addLine);
document.getElementById('addbutton_en').addEventListener('click', addLine);
document.getElementById('addbutton_en').addEventListener('touch', addLine);
// if(document.cookie) restoreFromCookie();
}
function init2()
{
webshims.setOptions('forms-ext', {types: 'date'});
webshims.polyfill('forms forms-ext');
addLine();
aktualisiereSumme();
}
window.addEventListener('DOMContentLoaded',init);
window.addEventListener('load',init2);
</script>
</head>
<body>
<input class="screen radiobutton" type="radio" id="en" name="lang" value="en" checked><label class="screen" for="en">English</label>
<input class="screen radiobutton" type="radio" id="de" name="lang" value="de"><label class="screen" for="de">Deutsch</label>
<header>
<img style="float: right;" src="logo_web.png" alt="logo">
<h1 lang="de">Antrag auf Kostenerstattung</h1>
<h1 lang="en">Reimbursement Claims</h1>
<p lang="de">Bitte beachte beim Ausfüllen die <a href="https://www.wikimedia.de/wiki/Gesch%C3%A4ftsordnung#Reisekostenordnung">Reisekostenordnung</a>.</p>
</header>
<div id="printcontainerDE_top" lang="de"><input type="button" value="🖶 Antrag drucken" id="printDE_top" disabled></div>
<div id="printcontainerEN_top" lang="en"><input type="button" value="🖶 Print" id="printEN_top" disabled></div>
<main>
<fieldset>
<legend lang="de">Bitte fülle die allgemeinen Daten für die Erstattung aus.</legend>
<legend lang="en">Please fill in the general data for reimbursement.</legend>
<fieldset class="iblock">
<legend lang="de">Dein Projekt / Zweck der Reise</legend>
<legend lang="en">Your project / purpose of travel</legend>
<input required type="input" size="32" id="projekt" name="Projekt" placeholder="Projekt xy" />
</fieldset>
<fieldset class="iblock">
<legend lang="de">Deine Ansprechperson bei Wikimedia</legend>
<legend lang="en">Your contact person at Wikimedia</legend>
<input required type="input" size="32" id="ansprech" name="Ansprechperson" placeholder="John Doe" />
</fieldset>
<hr />
<fieldset class="iblock">
<legend lang="de">Deine Kontaktdaten</legend>
<legend lang="en">Contact details</legend>
<!-- <p>Eine Angabe reicht bereits</p>-->
<label for="real" lang="de">Dein Realname</label>
<label for="real" lang="en">Full legal name</label>
<input required type="input" size="32" id="real" name="Realname" placeholder="Corinna Commonsuser" />
<label for="email" lang="de">E-Mail-Adresse</label>
<label for="email" lang="en">Email address</label>
<input required type="email" size="32" id="email" name="Emailadresse" placeholder="name@example.org" />
<label for="phone" lang="de">Telefonnummer</label>
<label for="phone" lang="en">Phone number</label>
<input required type="tel" size="32" id="phone" name="Telefonnummer" placeholder="0123-456789" />
</fieldset>
<fieldset class="iblock" id="bankdetails">
<legend lang="de">Auszahlungsweg</legend>
<legend lang="en">Payout method</legend>
<!-- <span style="white-space: pre;"><input class="screen" type="radio" id="eu" name="bank" value="EU" checked><label class="screen" for="eu" lang="de">EU-Banküberweisung</label><label class="screen" for="eu" lang="en">EU bank transfer</label></span>
<span style="white-space: pre;"><input class="screen" type="radio" id="noneu" name="bank" value="Non-EU"><label class="screen" for="noneu" lang="en">Non EU bank transfer</label><label class="screen" for="noneu" lang="de">Non-EU-Banküberweisung</label></span>
<span style="white-space: pre;"><input class="screen" type="radio" id="paypal" name="bank" value="PayPal"><label class="screen" for="paypal">PayPal</label></span>
<span style="white-space: pre;"><input class="screen" type="radio" id="bar" name="bank" value="Bar"><label class="screen" for="bar" lang="de">Bargeld</label><label class="screen" for="bar" lang="en">Cash</label></span>-->
<input class="screen" type="radio" id="eu" name="bank" value="EU" checked><label class="screen radio" for="eu" lang="de">EU-Banküberweisung</label><label class="screen radio" for="eu" lang="en">EU bank transfer</label>
<input class="screen" type="radio" id="noneu" name="bank" value="Non-EU"><label class="screen radio" for="noneu" lang="de">Non-EU-Banküberweisung</label><label class="screen radio" for="noneu" lang="en">Non EU bank transfer</label>
<input class="screen" type="radio" id="paypal" name="bank" value="PayPal"><label class="screen radio" for="paypal">PayPal</label>
<input class="screen" type="radio" id="bar" name="bank" value="Bar"><label class="screen radio" for="bar" lang="de">Bargeld</label><label class="screen radio" for="bar" lang="en">Cash</label>
<label class="EU nonEU" for="owner" lang="de">Kontoinhaber</label><label class="EU nonEU" for="owner" lang="en">Bank account owner</label><input class="EU nonEU" type="input" size="32" id="ownerDe" name="Owner" placeholder="wenn abweichend vom Realnamen" lang="de" /><input class="EU nonEU" type="input" size="32" id="ownerEn" name="Owner" placeholder="if different from full legal name" lang="en" />
<label class="EU nonEU" for="iban" lang="de">IBAN</label><label class="EU nonEU" for="iban" lang="en">Bank account number</label><input class="EU nonEU" type="input" size="32" id="iban" name="IBAN" placeholder="DE0123…" />
<label class="EU nonEU" for="bic">BIC / SWIFT</label><input class="EU nonEU" type="input" size="32" id="bic" name="BIC" placeholder="LBMU…" />
<label class="EU nonEU" for="bank" lang="de">Name der Bank</label><label class="EU nonEU" for="bank" lang="en">Name of bank</label><input class="EU nonEU" type="input" size="32" id="bank" name="Bankname" placeholder="Banky McBankface" />
<label class="nonEU" for="bankaddress" lang="en">Bank address</label><textarea lang="en" class="nonEU" id="bankaddress" style="resize:both;" cols="32" rows="4" placeholder="Street and house number
Postal code and city
Country"></textarea>
<label class="nonEU" for="address" lang="en">Your address</label><textarea lang="en" class="nonEU" id="address" style="resize:both;" cols="32" rows="4" placeholder="Street and house number
Postal code and city
Country"></textarea>
<label class="EU nonEU" for="comments" lang="en">Further comments</label><textarea lang="en" class="EU nonEU" id="comments" style="resize:both;" cols="32" rows="4" placeholder="e.g. intermediary bank,
reasons for differing account owner"></textarea>
<label class="nonEU" for="bankaddress" lang="de">Bankanschrift</label><textarea lang="de" class="nonEU" id="bankaddress" style="resize:both;" cols="32" rows="4" placeholder="Straße und Hausnummer
Postleitzahl und Ort
Land"></textarea>
<label class="nonEU" for="address" lang="de">Deine Anschrift</label><textarea lang="de" class="nonEU" id="address" style="resize:both;" cols="32" rows="4" placeholder="Straße und Hausnummer
Postleitzahl und Ort
Land"></textarea>
<label class="EU nonEU" for="comments" lang="de">Weitere Anmerkungen</label><textarea lang="de" class="EU nonEU" id="comments" style="resize:both;" cols="32" rows="4" placeholder="z.B. intermdiäre Bank,
Grund für abweichende Kontoinhaberin"></textarea>
<label class="paypal" for="accountnumber">PayPal account</label><input class="paypal" type="input" size="32" id="paypal" placeholder="paypal@example.com" />
</fieldset>
<!-- <div id="datacontainer"><input type="button" value="💾 Diese Angaben für eine spätere Verwendung auf diesem Rechner sichern (Cookie). / Save these specifications for later use on this computer (cookie)." id="save"></div>-->
</fieldset>
<fieldset id="Aufstellung_alt">
<legend class="screen" lang="de">Bitte trage deine einzelnen Kostenpositionen ein.</legend>
<legend class="screen" lang="en">Please enter your cost items.</legend>
<p class="screen" lang="de">Bitte trage nur eine Ausgabe pro Zeile ein, lege den Originalbeleg dem Antrag bei und kennzeichne den Beleg mit der entsprechenden Zeilennummer.
Aus der Beschreibung soll zu ersehen sein, ob es sich um Transport, Dienstleistung, Materialien, Verpflegung oder ähnliches handelt.
<p class="screen" lang="en">Please enter only one expense per line, provide original receipt with your claim and tag the receipt with the appropriate line number.
The description of the expense should refer to the kind of expense, e.g. travel, service, materials, food or similar.</p>
<table id="Aufstellung">
<thead><tr id="aufstellungheader" style="font-size:80%;">
<th id="spalte0">Pos.</th>
<th id="spalte1"><span lang="de">Beschreibung</span><span lang="en">Description</span></th>
<th id="spalte2"><span lang="de">Belegdatum</span><span lang="en">Date</span></th>
<th id="spalte3"><span lang="de">Betrag</span><span lang="en">Sum</span>
<input list="waehrungen" name="waehrung" id="waehrung" placeholder="EUR, or enter currency code">
<datalist id="waehrungen">
<option value="USD">United States Dollars</option>
<option value="EUR" selected="selected">Euro</option>
<option value="GBP">United Kingdom Pounds</option>
<option value="DZD">Algeria Dinars</option>
<option value="ARP">Argentina Pesos</option>
<option value="AUD">Australia Dollars</option>
<option value="BSD">Bahamas Dollars</option>
<option value="BBD">Barbados Dollars</option>
<option value="BMD">Bermuda Dollars</option>
<option value="BRR">Brazil Real</option>
<option value="BGL">Bulgaria Lev</option>
<option value="CAD">Canada Dollars</option>
<option value="CLP">Chile Pesos</option>
<option value="CNY">China Yuan Renmimbi</option>
<option value="CSK">Czech Republic Koruna</option>
<option value="DKK">Denmark Kroner</option>
<option value="XCD">Eastern Caribbean Dollars</option>
<option value="EGP">Egypt Pounds</option>
<option value="FJD">Fiji Dollars</option>
<option value="HKD">Hong Kong Dollars</option>
<option value="HUF">Hungary Forint</option>
<option value="ISK">Iceland Krona</option>
<option value="INR">India Rupees</option>
<option value="IDR">Indonesia Rupiah</option>
<option value="ILS">Israel New Shekels</option>
<option value="JMD">Jamaica Dollars</option>
<option value="JPY">Japan Yen</option>
<option value="JOD">Jordan Dinar</option>
<option value="KRW">Korea (South) Won</option>
<option value="LBP">Lebanon Pounds</option>
<option value="MYR">Malaysia Ringgit</option>
<option value="MXP">Mexico Pesos</option>
<option value="NZD">New Zealand Dollars</option>
<option value="NOK">Norway Kroner</option>
<option value="PKR">Pakistan Rupees</option>
<option value="PHP">Philippines Pesos</option>
<option value="PLZ">Poland Zloty</option>
<option value="ROL">Romania Leu</option>
<option value="RUR">Russia Rubles</option>
<option value="SAR">Saudi Arabia Riyal</option>
<option value="SGD">Singapore Dollars</option>
<option value="ZAR">South Africa Rand</option>
<option value="KRW">South Korea Won</option>
<option value="SDD">Sudan Dinar</option>
<option value="SEK">Sweden Krona</option>
<option value="CHF">Switzerland Francs</option>
<option value="TWD">Taiwan Dollars</option>
<option value="THB">Thailand Baht</option>
<option value="TTD">Trinidad and Tobago Dollars</option>
<option value="TRL">Turkey Lira</option>
<option value="VEB">Venezuela Bolivar</option>
<option value="ZMK">Zambia Kwacha</option>
</datalist>
</th>
<th id="spalte4" class="delete"></th>
</tr></thead>
<tbody>
<tr id="Reihe[0]">
<td id="Position[0]" style="text-align: right;">0</td>
<td id="Beschreibung[0]"><textarea style="resize:none;" cols="45" rows="1" readonly lang="de">Vorschuss (falls zutreffend)</textarea><textarea style="resize:none;" cols="45" rows="1" readonly lang="en">Advance payment (if applicable)</textarea></td>
<td id="Belegdatum[0]"><input type="date" style="visibility:hidden;"></td>
<td id="Betrag[0]" style="text-align:right;"><input required type="number" step="0.01" value="0.00" min="0.00" max="10000.00" id="vorschuss" name="Vorschuss" style="font-size:120%; text-align: right;" /></td>
<td class="delete" id="delete[0]"></td>
</tr>
<tr class="screen" id="more"><td colspan="4"><input type="button" id="addbutton_de" style="width:100%;" value="Ausgabe hinzufügen +" lang="de" /><input type="button" id="addbutton_en" style="width:100%;" value="Add expense +" lang="en" /></td></tr>
</tbody>
<tfoot>
<tr id="Reihe[Summe]">
<td colspan="3" style="text-align: right;"><span lang="de">Summe</span><span lang="en">Total</span></td>
<td style="text-align: right;"><span class="geld" id="Summe" style="margin-left: 2em; font-weight:bold; color:black; width:8em;"></span></td>
</tr>
</tfoot>
</table>
</fieldset>
<fieldset>
<legend lang="de">Datum der Antragstellung</legend>
<legend lang="en">Date of claim</legend>
<input type="date">
</fieldset>
<fieldset>
<legend lang="de">Pflichtangabe: Hiermit bestätige ich die Vollständig- und Richtigkeit meiner Angaben.</legend>
<legend lang="en">Mandatory declaration: Herewith I confirm the completeness and correctness of my data.</legend>
<input type="checkbox" id="check" name="checkbox" onchange="document.getElementById('printDE_bottom').disabled = !this.checked;
document.getElementById('printEN_bottom').disabled = !this.checked;
document.getElementById('printDE_top').disabled = !this.checked;
document.getElementById('printEN_top').disabled = !this.checked;">
</fieldset>
<h2 id="faq" class="screen">Frequently asked questions (FAQ)</h2>
<!--<input class="screen" type="radio" id="en" name="lang" value="en" checked><label class="screen" for="en">English</label>
<input class="screen" type="radio" id="de" name="lang" value="de"><label class="screen" for="de">Deutsch</label>-->
<dl lang="en" class="screen">
<dt>My claims are not in Euro. What now?</dt>
<dd>When claiming expenses please select in which currency you want your expense reimbursed. Use the
<a href="https://sdw.ecb.europa.eu/curConverter.do?node=9693519">converter of the European Central Bank</a>.
Convert per line (not the sum!) using the exchange rate valid at the date of expense. If you don't provide a
currency, we'll assume you want to get reimbursed using Euro.</dd>
</dl>
<dl lang="de" class="screen">
<dt>Meine Ausgabe sind nicht in Euro. Was soll ich machen?</dt>
<dd>Wenn du Ausgaben erstattet haben willst, rechne die Ausgaben zeilenweise (nicht nur den Gesamtbetrag!) mit dem
<a href="https://sdw.ecb.europa.eu/curConverter.do?node=9693519">Währungsumrechner der Europäischen Zentralbank</a>
in die Währung um, in der du deine Kosten erstattet haben willst. Gibst du keine Währung an, nehmen wir an, dass
die Erstattung in Euro erfolgen soll.</dd>
</dl>
<div style="width: 100%; text-align:right; padding-right: 50px; font-weight:bold; font-size:90%;"></div>
</main>
<div id="printcontainerDE_bottom" lang="de"><input type="button" value="🖶 Antrag drucken" id="printDE_bottom" disabled></div>
<div id="printcontainerEN_bottom" lang="en"><input type="button" value="🖶 Print" id="printEN_bottom" disabled></div>
<template id="neuerEintrag">
<tr style="display: none">
<td style="text-align: right;"></td>
<td><textarea style="resize:both;" cols="45" rows="2" placeholder="Please enter a description of this expense here."></textarea></td>
<td><input type="date"></td>
<td style="text-align:right;"><input type="number" min="0.00" max="10000.00" step="0.01" value="0.00" style="text-align: right;"></td>
<td class="delete"><button class="delbutton">-</button></td>
</tr>
</template>
<footer>
<a href="mailto:info@wikimedia.de">Kontakt / contact</a>
<p>© 2016 by Wikimedia Deutschland e.V.</p>
<address>Wikimedia Deutschland<br>
Gesellschaft zur Förderung Freien Wissens e.V.<br>
Postfach 61 03 49<br>
10925 Berlin<br><br>
http://wikimedia.de<br>
Tel: +49 30/21 91 58 26-0<br>
Fax: +49 30/21 91 58 26-9<br>
E-Mail: info@wikimedia.de<br><br>
</address>
</footer>
</body>
</html>