forked from tohe/wmdeit_kaform
Moved form into form.php
This commit is contained in:
parent
37eba4283b
commit
2e0c9d3194
|
|
@ -0,0 +1,204 @@
|
|||
<h1>
|
||||
<?php echo _( "Antrag auf Kostenerstattung")?>
|
||||
</h1>
|
||||
<p>
|
||||
<?php echo _("Du möchtest dir Kosten erstatten lassen, welche im Rahmen deines Projektes entstanden sind?")?><BR>
|
||||
<?php echo _("Bitte fülle dieses Formular aus. Pflichtfelder sind mit einem * gekennzeichnet.")?>
|
||||
</p>
|
||||
|
||||
<form data-kube="kaform" name="theform" id="theform" action="submit.php" method="POST">
|
||||
|
||||
<fieldset> <legend><?php echo _("1. Erfasse deine Stammdaten")?></legend>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input required type="input"
|
||||
size="32" id="projectid" name="project"
|
||||
placeholder="<?php echo _("Projekt/Zweck der Reise*")?>" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input required type="input" size="32"
|
||||
` id="realname" name="realname" placeholder="<?php echo _("Dein Realname (Vorname Nachname)*")?>" />
|
||||
</div>
|
||||
<div class="is-col">
|
||||
<input type="input" size="32"
|
||||
` id="wmdecontact" name="wmdecontact"
|
||||
placeholder="<?= _("Deine Ansprechperson bei Wikimedia")?>" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input type="tel" size="32"
|
||||
id="phone" name="phone"
|
||||
placeholder="<?= _("Deine Telefonnummer")?>" />
|
||||
</div>
|
||||
<div class="is-col">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input required type="email" size="32" id="email"
|
||||
name="email" placeholder="<?= _("Deine E-Mail-Adresse*")?>" />
|
||||
</div>
|
||||
<div class="is-col">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
|
||||
<nav class="tabs" data-kube="tabs" data-equal="false">
|
||||
<a href="#bank-eu" class="is-active"><?=_("Banküberweisung")?></a>
|
||||
<a href="#bank-noneu"><?=_("Banküberweisung (Non-EU)")?></a>
|
||||
</nav>
|
||||
|
||||
<section id="bank-eu">
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input type="input" size="32" name="Owner" placeholder="<?=_("Kontoinhabende Person")?>" />
|
||||
</div>
|
||||
<div class="is-col">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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 (wenn ausländische Bank)")?>" />
|
||||
</div>
|
||||
</div>
|
||||
<textarea id="comments" name="comments" style="resize:none;" cols="32" rows="4"
|
||||
placeholder="<?=_("Weitere Anmerkungen z.B. intermediäre Bank, Grund für abweichende Kontoinhbende Person")?>"></textarea >
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
<section id="bank-noneu">
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input type="input" size="32" name="Owner" placeholder="<?=_("Kontoinhabende Person")?>" />
|
||||
</div>
|
||||
<div class="is-col">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<input type="input" size="32" id="n_iban" name="n_iban" placeholder="<?=_("Kontonummer*")?>" />
|
||||
|
||||
</div>
|
||||
<div class="is-col">
|
||||
<input type="input" size="32" id="n_bic" name="n_bic" placeholder="<?=_("BIC/SWIFT*")?>" />
|
||||
</div>
|
||||
</div>
|
||||
<input class="EU nonEU" type="input" size="32" id="n_bank" name="n_bankname" placeholder="<?="Name der Bank*"?>" />
|
||||
|
||||
<textarea class="nonEU" name="n_bankaddress" id="n_bankaddress" style="resize:both;" cols="32" rows="4"
|
||||
placeholder="<?=_("Adresse der Bank (Straße und Hausnummer/Postleitzahl/Land)")?>"></textarea>
|
||||
<br>
|
||||
<textarea name="n_address" lang="de" class="nonEU" id="n_address" style="resize:both;" cols="32" rows="4"
|
||||
placeholder="<?=_("Deine Anschrift (Srtaße und Hausnummer/Postleitzahl/Land)")?>"></textarea>
|
||||
<br>
|
||||
|
||||
|
||||
|
||||
<textarea id="n_comments" name="n_comments"
|
||||
style="resize:both;" cols="32" rows="4"
|
||||
placeholder="<?=_("Weitere Anmerkungen z.B. intermediäre Bank,Grund für abweichende kontoinhabende Person")?>"></textarea>
|
||||
|
||||
</section>
|
||||
|
||||
</div> <!-- i-col -->
|
||||
</div> <!-- is-row -->
|
||||
|
||||
</fieldset>
|
||||
|
||||
|
||||
<fieldset id="fieldset2"> <legend><?=_("2. Erfasse deine Ausgaben")?></legend>
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<?=_("Währung:")?>
|
||||
</div>
|
||||
<div class="is-col">
|
||||
<select onchange="renumberTableRows()" id="currency" >
|
||||
<option value="EUR">EUR</option>
|
||||
<option value="USD">USD</option>
|
||||
<option value="CHF">CHF</option>
|
||||
<option value="XBT">XBT</option>
|
||||
</select>`
|
||||
</div>
|
||||
<div class="is-col">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table id="tabtab" class="is-responsive is-bordered is-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th><?=_("Pos.")?></th>
|
||||
<th><?=_("Datum")?></th>
|
||||
<th><?=_("Beschreibung")?></th>
|
||||
<th><?=_("Betrag")?></th>
|
||||
<th><?=_("Währung")?></th>
|
||||
<th><?=_("Belege")?></th>
|
||||
<th><?=_("Löschen")?></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tabbody">
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="is-col">
|
||||
<button id="add_issue" type="button" onclick="addRow();"
|
||||
class="button is-green"><?=_("Ausgabe hinzufügen")?></button>
|
||||
</div>
|
||||
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset> <legend><?=_("3. Vorschuss und Sonstiges")?></legend>
|
||||
<div class="is-row">
|
||||
<div class="is-col valign="center"">
|
||||
<?=_("Ich habe bereits einen Vorschuss erhalten in Höhe von:")?>
|
||||
</div>
|
||||
<div class="is-col">
|
||||
<input input name="advance" id="advance" type="text" placeholder="0,00 EUR"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col valign="center"">
|
||||
<?=_("Hiermit bestätige ich die Vollständig- und Richtigkeit meiner Angaben:")?>*
|
||||
</div>
|
||||
<div class="is-col">
|
||||
<input id="agree" type="checkbox" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="is-row">
|
||||
<div class="is-col">
|
||||
<button type="button" onclick="downloadDocument(true);"
|
||||
class="button is-green"><?=_("Antrag elektronisch direkt an WMDE schicken")?></button>
|
||||
</div>
|
||||
|
||||
<div class="is-col">
|
||||
<button type="button" onclick="downloadDocument(false);"
|
||||
class="button is-orange"><?=_("Antrag herunterladen und später einreichen")?></button>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
|
||||
|
||||
<input type="hidden" id="banktype" name="banktype"/>
|
||||
<input type="hidden" id="sendmail" name="sendmail"/>
|
||||
|
||||
|
||||
|
||||
</form>
|
||||
<?php
|
||||
|
||||
5
ka.php
5
ka.php
|
|
@ -20,9 +20,6 @@
|
|||
$results = putenv("LC_ALL=$loc");
|
||||
$results = putenv("LC_MESSAGES=$loc");
|
||||
$results = bindtextdomain($domain,"./locale");
|
||||
|
||||
|
||||
|
||||
?>
|
||||
<html >
|
||||
<head>
|
||||
|
|
@ -40,9 +37,11 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="page is-container">
|
||||
|
||||
<div class="main-sidebar">
|
||||
<img alt="wikimedia logo" src="Wikimedia_Deutschland-Logo.svg"/>
|
||||
</div>
|
||||
|
||||
<div class="main-content">
|
||||
<h1>
|
||||
<?php echo _( "Antrag auf Kostenerstattung")?>
|
||||
|
|
|
|||
|
|
@ -161,13 +161,13 @@ function getUploadField(rid)
|
|||
function getRow(rid,num) {
|
||||
var cur = document.getElementById("currency").value;
|
||||
return ""
|
||||
+ "<td>"
|
||||
+ "<td data-label=\"Pos\">"
|
||||
+ `${num}`
|
||||
+"</td>"
|
||||
+ "<td>"
|
||||
+ "<td data-label=\"Datum\">"
|
||||
+ `<input name="date[${rid}]" value="" type="date" placeholder="Datum*"/>`
|
||||
+ "</td>"
|
||||
+ "<td>"
|
||||
+ "<td data-label=\"Beschr.\">"
|
||||
+ `<input name="desc[${rid}]" type="text" placeholder="Beschreibung"/>`
|
||||
+ "</td>"
|
||||
+ "<td>"
|
||||
|
|
|
|||
141
master.css
141
master.css
|
|
@ -1,46 +1,104 @@
|
|||
|
||||
body {
|
||||
margin: 1em;
|
||||
max-width: 100em;
|
||||
margin: auto;
|
||||
padding: 1em;
|
||||
border: 1px solid red;
|
||||
max-width: 90em;
|
||||
min-width: 75em;
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
body {
|
||||
min-width: 2em;
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
fieldset {
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
table {
|
||||
text-align: right;
|
||||
border: 1px solid red;
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
h1 {
|
||||
font-size: 120%;
|
||||
}
|
||||
}
|
||||
|
||||
.is-col {
|
||||
padding: 0;
|
||||
border: 0px solid blue;
|
||||
margin-bottom: 1.1em;
|
||||
}
|
||||
|
||||
.main-sidebar {
|
||||
@include make-sidebar(440px);
|
||||
/* margin-right: 61px;*/
|
||||
width:20em;
|
||||
padding-right:2em;
|
||||
|
||||
@include for-mobile {
|
||||
margin-right: 0;
|
||||
}
|
||||
flex: 0 0 10em;
|
||||
max-width: 10em;
|
||||
padding-right: 2em;
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
.main-sidebar {
|
||||
flex: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
.main-sidebar {
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.main-sidebar-secondary {
|
||||
@include make-sidebar(240px);
|
||||
margin-left: 16px;
|
||||
|
||||
@include for-mobile {
|
||||
margin-left: 0;
|
||||
}
|
||||
flex: 0 0 240px;
|
||||
max-width: 240px;
|
||||
margin-left: 16px;
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
.main-sidebar-secondary {
|
||||
flex: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
.main-sidebar-secondary {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.main-content {
|
||||
/* @include make-content;*/
|
||||
/* width: 100em;*/
|
||||
/* max-width:170em;*/
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wmdelogo {
|
||||
min-width: 5em;
|
||||
}
|
||||
|
||||
.button.is-green {
|
||||
/* // $back-color, $text-color
|
||||
@include make-button(#00ff00, #fff);*/
|
||||
background-color:green;
|
||||
}
|
||||
.button.is-orange {
|
||||
/* // $back-color, $text-color
|
||||
@include make-button(#ffc000, #fff);*/
|
||||
background-color:orange;
|
||||
/* // $back-color, $text-color
|
||||
@include make-button(#00ff00, #fff);*/
|
||||
background-color: green;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.button.is-orange {
|
||||
/* // $back-color, $text-color
|
||||
@include make-button(#ffc000, #fff);*/
|
||||
background-color: orange;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
/*
|
||||
#de:checked~header :lang(en) { display: none; }
|
||||
|
|
@ -50,17 +108,32 @@ body {
|
|||
#de:checked~main :lang(en) { display: none; }
|
||||
#en:checked~main :lang(de) { display: none; }
|
||||
*/
|
||||
:lang(en) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:lang(en) {display: none;}
|
||||
#bankdetails legend, #bankdetails input[type=radio], #bankdetails input[type=radio] + label, #bankdetails label.radio {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
#bankdetails #eu:checked ~ .nonEU:not(.EU), #bankdetails #eu:checked ~ .paypal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#bankdetails #noneu:checked ~ .EU:not(.nonEU), #bankdetails #noneu:checked ~ .paypal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#bankdetails #paypal:checked ~ .EU, #bankdetails #paypal:checked ~ .nonEU {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#bankdetails #bar:checked ~ .EU, #bankdetails #bar:checked ~ .nonEU, #bankdetails #bar:checked ~ .paypal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#bankdetails legend, #bankdetails input[type="radio"], #bankdetails input[type="radio"] + label, #bankdetails label.radio { display: inline; }
|
||||
#bankdetails #eu:checked ~ .nonEU:not(.EU), #bankdetails #eu:checked ~ .paypal { display: none; }
|
||||
#bankdetails #noneu:checked ~ .EU:not(.nonEU), #bankdetails #noneu:checked ~ .paypal { display: none; }
|
||||
#bankdetails #paypal:checked ~ .EU, #bankdetails #paypal:checked ~ .nonEU { display: none; }
|
||||
#bankdetails #bar:checked ~ .EU, #bankdetails #bar:checked ~ .nonEU, #bankdetails #bar:checked ~ .paypal { display: none; }
|
||||
.radiobutton {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=master.css.map */
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
@use "sass:math";
|
||||
|
||||
// =FUNCTIONS
|
||||
// ---------------------------------------------------------------------------
|
||||
@function strip-unit($number) {
|
||||
@if type-of($number) == 'number' and not unitless($number)
|
||||
{
|
||||
@return $number / ($number * 0 + 1);
|
||||
@return math.div($number , ($number * 0 + 1));
|
||||
}
|
||||
|
||||
@return $number;
|
||||
|
|
@ -129,7 +131,7 @@ $color-button: #0c3dd7 !default;
|
|||
// ---------------------------------------------------------------------------
|
||||
|
||||
// Font Metrics
|
||||
$letter-height: 12/16;
|
||||
$letter-height: math.div(12,16);
|
||||
$crop-top: 0.49em;
|
||||
$crop-bottom: 0.49em;
|
||||
|
||||
|
|
@ -157,9 +159,9 @@ $border-radius: 4px !default;
|
|||
$border: 1px solid rgba($color-black, .07) !default;
|
||||
|
||||
// Input/Buttons Height
|
||||
$controls-height: ((40/(strip-unit($font-size-ui)*16)) * 1em) !default; // 40px in ems
|
||||
$controls-height-small: ((32/(strip-unit($font-size-small)*16)) * 1em) !default; // 32px in ems
|
||||
$controls-height-big: ((44/(strip-unit($font-size-big)*16)) * 1em) !default; // 44px in ems
|
||||
$controls-height: ((math.div(40,(strip-unit($font-size-ui)*16))) * 1em) !default; // 40px in ems
|
||||
$controls-height-small: ((math.div(32,(strip-unit($font-size-small)*16))) * 1em) !default; // 32px in ems
|
||||
$controls-height-big: ((math.div(44,(strip-unit($font-size-big)*16))) * 1em) !default; // 44px in ems
|
||||
|
||||
// Overlay
|
||||
$overlay-background-color: rgba($color-black, .18) !default;
|
||||
|
|
|
|||
Loading…
Reference in New Issue