Added mobil layout, extend desktop description
Alexander Böhm
parent
2a8ca37fb2
commit
92ca10ca53
570
antrag.html
570
antrag.html
|
|
@ -3,6 +3,10 @@
|
|||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
.description {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
|
@ -11,21 +15,14 @@
|
|||
padding-bottom: 2em;
|
||||
}
|
||||
|
||||
.step-submission .button {
|
||||
margin: auto;
|
||||
width: 50%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.step .description {
|
||||
font-weight: 650;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.center {
|
||||
margin: auto;
|
||||
width: 50%;
|
||||
border: 3px solid green;
|
||||
padding: 10px;
|
||||
padding: 0.1em;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
|
|
@ -53,13 +50,14 @@
|
|||
}
|
||||
|
||||
.button {
|
||||
display: block;
|
||||
color: #6ab43e;
|
||||
border-color: #dedede;
|
||||
border-radius: 1em;
|
||||
background: #eee;
|
||||
border-style: solid;
|
||||
border-width: 0.2em;
|
||||
padding: 1em;
|
||||
text-align: center;
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
|
|
@ -73,9 +71,8 @@
|
|||
border-radius: 1em;
|
||||
border-style: solid;
|
||||
border-width: 0.2em;
|
||||
background: #eee;
|
||||
padding: 1em;
|
||||
text-align: center;
|
||||
transition: opacity 1s, border-color 1s, filter 1s;
|
||||
}
|
||||
|
||||
.radio:hover {
|
||||
|
|
@ -84,45 +81,121 @@
|
|||
}
|
||||
|
||||
.radio-selected {
|
||||
color: #dedede;
|
||||
background: #6ab43e;
|
||||
text-shadow: none;
|
||||
border-color: #6ab43e;
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
||||
.radio-not-selected {
|
||||
border-color: #dedede;
|
||||
opacity: 0.3;
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
|
||||
.tab-2-cell-1 {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.tab-5-cell-1 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.tab-5-cell-3 {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.tab-6-cell-1 {
|
||||
width: 16%;
|
||||
}
|
||||
|
||||
.tab-7-cell-1 {
|
||||
width: 14%;
|
||||
}
|
||||
|
||||
.selection {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
td.radio img {
|
||||
width: 100%;
|
||||
margin-bottom: 5em;
|
||||
}
|
||||
|
||||
.step .submission {
|
||||
.text-selection {
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.pictured-selection .items .label .caption {
|
||||
font-size: 2.33em;
|
||||
}
|
||||
|
||||
.picture img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tab-2, .tab-5, .tab-6, .tab-7 {
|
||||
display: table;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.text-selection .items {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.pictured-selection .items {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.pictured-selection .items .radio .label {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.pictured-selection .items .radio .label .picture {
|
||||
display: table-cell;
|
||||
width: 29%;
|
||||
}
|
||||
|
||||
.pictured-selection .items .radio .label .caption {
|
||||
display: table-cell;
|
||||
padding-left: 1em;
|
||||
vertical-align: middle;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.submission .label {
|
||||
font-size: 2.33em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1024px) {
|
||||
.text-selection,
|
||||
.pictured-selection .items .label .caption {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.text-selection .items {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.text-selection .items .radio {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.pictured-selection .items {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.pictured-selection .items .radio {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.pictured-selection .items .radio .label .picture {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.pictured-selection .items .radio .label .caption {
|
||||
display: table-row;
|
||||
padding-top: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tab-2 {
|
||||
width: 40%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.tab-2-cell-1 {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.tab-5-cell-1 {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.tab-6-cell-1 {
|
||||
width: 16.6%;
|
||||
}
|
||||
|
||||
.tab-7-cell-1 {
|
||||
width: 14.2%;
|
||||
}
|
||||
|
||||
.submission {
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
|
|
@ -148,10 +221,18 @@
|
|||
elm.classList.add("fade-in");
|
||||
}
|
||||
|
||||
function jump_to_step(step) {
|
||||
window.scrollTo(0, document.getElementById("step-"+step).offsetTop);
|
||||
}
|
||||
|
||||
function option_choosen(event) {
|
||||
var elm = event.target;
|
||||
|
||||
while (!elm.hasAttribute("name") || !elm.hasAttribute("value")) {
|
||||
while (true) {
|
||||
if (elm.classList.contains("radio") && elm.attributes.getNamedItem("name") && elm.attributes.getNamedItem("value")) {
|
||||
break;
|
||||
}
|
||||
|
||||
elm = elm.parentNode;
|
||||
if (!elm.parentNode)
|
||||
return;
|
||||
|
|
@ -162,14 +243,17 @@
|
|||
var name = elm.attributes.name.nodeValue;
|
||||
var value = elm.attributes.value.nodeValue;
|
||||
application[name] = value;
|
||||
console.log(elm.attributes);
|
||||
console.log(application);
|
||||
|
||||
elm.parentNode.parentNode.querySelectorAll(".radio").forEach(function(e) {
|
||||
e.classList.remove("radio-selected");
|
||||
e.classList.add("radio-not-selected");
|
||||
elm.parentNode.parentNode.parentNode.querySelectorAll(".radio").forEach(function(e) {
|
||||
if (e == elm) {
|
||||
e.classList.remove("radio-not-selected");
|
||||
e.classList.add("radio-selected");
|
||||
} else {
|
||||
e.classList.remove("radio-selected");
|
||||
e.classList.add("radio-not-selected");
|
||||
}
|
||||
console.log(e);
|
||||
});
|
||||
elm.classList.add("radio-selected");
|
||||
|
||||
switch(name) {
|
||||
case "language":
|
||||
|
|
@ -177,32 +261,39 @@
|
|||
document.querySelectorAll("." + value).forEach(function(elm) { show(elm); } );
|
||||
document.querySelectorAll(".step").forEach(function(elm) { show(elm); } );
|
||||
|
||||
document.querySelectorAll(".step-description").forEach(function(elm) { ungray(elm); } );
|
||||
document.querySelectorAll(".step-domicilie").forEach(function(elm) { ungray(elm); } );
|
||||
ungray(document.getElementById("step-description"));
|
||||
ungray(document.getElementById("step-domicilie"));
|
||||
jump_to_step("description");
|
||||
|
||||
break;
|
||||
|
||||
case "domicilie":
|
||||
document.querySelectorAll(".step-notice").forEach(function(elm) { ungray(elm); } );
|
||||
ungray(document.getElementById("step-notice"));
|
||||
jump_to_step("notice");
|
||||
break;
|
||||
|
||||
case "document":
|
||||
document.querySelectorAll(".step-device").forEach(function(elm) { ungray(elm); } );
|
||||
ungray(document.getElementById("step-device"));
|
||||
jump_to_step("device");
|
||||
break;
|
||||
|
||||
case "device":
|
||||
document.querySelectorAll(".step-data-processing").forEach(function(elm) { ungray(elm); } );
|
||||
ungray(document.getElementById("step-data-processing"));
|
||||
jump_to_step("data-processing");
|
||||
break;
|
||||
|
||||
case "data-processing":
|
||||
if (application["data-processing"] == "yes") {
|
||||
document.querySelectorAll(".step-submission").forEach(function(elm) { ungray(elm); } );
|
||||
ungray(document.getElementById("step-submission"));
|
||||
jump_to_step("submission");
|
||||
var subject = "Antrag für Gerät " + application['device'] + "/Wohnort " + application['domicilie']+ "/Nachweis " + application['document'] + "/Wizard";
|
||||
console.log(subject);
|
||||
var email_link = "mailto:mail@hardwareforfuture.de?subject=" + encodeURI(subject);
|
||||
document.getElementById("email_link").href = email_link;
|
||||
} else {
|
||||
document.querySelectorAll(".step-submission").forEach(function(elm) { gray(elm); } );
|
||||
gray(document.getElementById("step-submission"));
|
||||
document.getElementById("email_link").href = "";
|
||||
jump_to_step("data-processing");
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
|
@ -211,7 +302,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="application">
|
||||
<div class="show step step-language">
|
||||
<div class="show step" id="step-language">
|
||||
<div class="description">
|
||||
<span class="german" lang="de">Welche Sprache?</span>
|
||||
<span class="english" lang="en">Which language?</span>
|
||||
|
|
@ -222,34 +313,34 @@
|
|||
<span class="persian" lang="fa">چه زبانی؟ (ترجمه ماشینی)</span>
|
||||
</div>
|
||||
|
||||
<table class="selection">
|
||||
<tr>
|
||||
<td class="radio tab-7-cell-1" name="language" value="german">
|
||||
<div class="selection text-selection tab-7">
|
||||
<div class="items">
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="german">
|
||||
<span class="label">Deutsch</span>
|
||||
</td>
|
||||
<td class="radio tab-7-cell-1" name="language" value="english">
|
||||
</div>
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="english">
|
||||
<span class="label">English</span>
|
||||
</td>
|
||||
<td class="radio tab-7-cell-1" name="language" value="french">
|
||||
<span class="label">Français (traduit automatiquement)</span>
|
||||
</td>
|
||||
<td class="radio tab-7-cell-1" name="language" value="ukrainian">
|
||||
</div>
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="french">
|
||||
<span class="label">Français (divaduit automatiquement)</span>
|
||||
</div>
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="ukrainian">
|
||||
<span class="label">український (машинний переклад)</span>
|
||||
</td>
|
||||
<td class="radio tab-7-cell-1" name="language" value="russian">
|
||||
</div>
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="russian">
|
||||
<span class="label">Русский (машинный перевод)</span>
|
||||
</td>
|
||||
<td class="radio tab-7-cell-1" name="language" value="arabic">
|
||||
</div>
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="arabic">
|
||||
<span class="label">العربية (آلة مترجمة)</span>
|
||||
</td>
|
||||
<td class="radio tab-7-cell-1" name="language" value="persian">
|
||||
</div>
|
||||
<div class="tab-cell tab-7-cell-1 radio" name="language" value="persian">
|
||||
<span class="label">عربی (ترجمه ماشینی)</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="step step-description grayed fade-out">
|
||||
<div class="step grayed fade-out" id="step-description">
|
||||
<div class="localized german" lang="de">
|
||||
<p>Gerne möchten wir dich unterstützen! Um einen Rechner von uns zu bekommen benötigen wir weitere Informationen von dir.</p>
|
||||
<p>Zurzeit decken wir vorrangig das Gebiet von Leipzig ab und geben Computer an Menschen, die in Leipzig wohnen.</p>
|
||||
|
|
@ -315,7 +406,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden step step-domicilie grayed">
|
||||
<div class="hidden step grayed" id="step-domicilie">
|
||||
<div class="description">
|
||||
<p class="localized german" lang="de">Wo wohnst du zurzeit?</p>
|
||||
<p class="localized english" lang="en">Where do you live at the moment?</p>
|
||||
|
|
@ -326,37 +417,39 @@
|
|||
<p class="localized persian" lang="fa">در حال حاضر کجا زندگی می کنید؟</p>
|
||||
</div>
|
||||
|
||||
<table class="selection">
|
||||
<tr>
|
||||
<td class="radio tab-6-cell-1" name="domicilie" value="Leipzig">
|
||||
<span>Leipzig</span>
|
||||
</td>
|
||||
<td class="radio tab-6-cell-1" name="domicilie" value="Leipziger Land">
|
||||
<span>Leipziger Land</span>
|
||||
</td>
|
||||
<td class="radio tab-6-cell-1" name="domicilie" value="Halle">
|
||||
<span>Halle</span>
|
||||
</td>
|
||||
<td class="radio tab-6-cell-1" name="domicilie" value="Chemnitz">
|
||||
<span>Chemnitz</span>
|
||||
</td>
|
||||
<td class="radio tab-6-cell-1" name="domicilie" value="Dresden">
|
||||
<label>Dresden</label>
|
||||
</td>
|
||||
<td class="radio tab-6-cell-1" name="domicilie" value="Else">
|
||||
<span class="localized german" lang="de">Andere</span>
|
||||
<span class="localized english" lang="en">Else</span>
|
||||
<span class="localized french" lang="fr">Autre</span>
|
||||
<span class="localized ukrainian" lang="ua">Інший</span>
|
||||
<span class="localized russian" lang="ru">Другой</span>
|
||||
<span class="localized arabic" lang="ar">آخر</span>
|
||||
<span class="localized persian" lang="fa">دیگر</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="selection text-selection tab-6">
|
||||
<div class="items">
|
||||
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Leipzig">
|
||||
<span class="label">Leipzig</span>
|
||||
</div>
|
||||
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Leipziger Land">
|
||||
<span class="label">Leipziger Land</span>
|
||||
</div>
|
||||
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Halle">
|
||||
<span class="label">Halle</span>
|
||||
</div>
|
||||
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Chemnitz">
|
||||
<span class="label">Chemnitz</span>
|
||||
</div>
|
||||
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Dresden">
|
||||
<span class="label">Dresden</span>
|
||||
</div>
|
||||
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Else">
|
||||
<div class="label">
|
||||
<span class="localized german" lang="de">Andere</span>
|
||||
<span class="localized english" lang="en">Else</span>
|
||||
<span class="localized french" lang="fr">Autre</span>
|
||||
<span class="localized ukrainian" lang="ua">Інший</span>
|
||||
<span class="localized russian" lang="ru">Другой</span>
|
||||
<span class="localized arabic" lang="ar">آخر</span>
|
||||
<span class="localized persian" lang="fa">دیگر</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden step step-notice grayed">
|
||||
<div class="hidden step grayed" id="step-notice">
|
||||
<div class="description">
|
||||
<p class="localized german" lang="de">Wir brauchen von dir einen Nachweis über deine Bedürftigkeit. Welches Dokument besitzt du?</p>
|
||||
<p class="localized english" lang="en">We need proof of your need from you. What document do you have?</p>
|
||||
|
|
@ -367,67 +460,87 @@
|
|||
<p class="localized persian" lang="fa">ﻡﺍ ﺐﻫ ﻡﺩﺮﮐ ﻦﯾﺍﺯ ﺶﻣﺍ ﺍﺯ ﺶﻣﺍ ﻦﯾﺍﺯ ﺩﺍﺮﯿﻣ. ﭻﻫ ﺲﻧﺪﯾ ﺩﺍﺮﯾﺩ؟</p>
|
||||
</div>
|
||||
|
||||
<table class="selection">
|
||||
<tr>
|
||||
<td class="radio tab-5-cell-1" name="document" value="Leipzig-Pass">
|
||||
<img src="notice-leipzig-pass.png"/>
|
||||
<div class="caption">
|
||||
<span>Leipzig Pass</span>
|
||||
<div class="selection pictured-selection tab-5">
|
||||
<div class="items">
|
||||
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Leipzig-Pass">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="notice-leipzig-pass.png"/>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span>Leipzig Pass</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="radio tab-5-cell-1" name="document" value="Sozialhilfe Bescheid/ALG2">
|
||||
<img src="notice-alg2.jpg"/>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Sozialhilfebescheid / ALG2</span>
|
||||
<span class="localized english" lang="en">Social security notice (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized french" lang="fr">Avis de sécurité sociale (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized ukrainian" lang="ua">повідомлення про соціальне страхування (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized russian" lang="ru">уведомление о социальном обеспечении (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized arabic" lang="ar">(Sozialhilfebescheid/ALG2) إشعار الضمان الاجتماعي</span>
|
||||
<span class="localized persian" lang="fa">(Sozialhilfebescheid/ALG2) اطلاعیه تامین اجتماعی</span>
|
||||
</div>
|
||||
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Sozialhilfe Bescheid/ALG2">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="notice-alg2.jpg"/>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Sozialhilfebescheid / ALG2</span>
|
||||
<span class="localized english" lang="en">Social security notice (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized french" lang="fr">Avis de sécurité sociale (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized ukrainian" lang="ua">повідомлення про соціальне страхування (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized russian" lang="ru">уведомление о социальном обеспечении (Sozialhilfebescheid/ALG2)</span>
|
||||
<span class="localized arabic" lang="ar">(Sozialhilfebescheid/ALG2) إشعار الضمان الاجتماعي</span>
|
||||
<span class="localized persian" lang="fa">(Sozialhilfebescheid/ALG2) اطلاعیه تامین اجتماعی</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="radio tab-5-cell-1" name="document" value="Arbeitslosengeld">
|
||||
<img src="notice-alg1.jpg" />
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Bescheid für den Bezug von Arbeitslosengeld</span>
|
||||
<span class="localized english" lang="en">Notice for unemployment benefit (Arbeitslosengeld)</span>
|
||||
<span class="localized french" lang="fr">Décision de recevoir des allocations de chômage (Arbeitslosengeld)</span>
|
||||
<span class="localized ukrainian" lang="ua">Рішення про отримання допомоги по безробіттю (Arbeitslosengeld)</span>
|
||||
<span class="localized russian" lang="ru">Решение о получении пособия по безработице (Arbeitslosengeld)</span>
|
||||
<span class="localized arabic" lang="ar">(Arbeitslosengeld) قرار الحصول على إعانة البطالة</span>
|
||||
<span class="localized persian" lang="fa">(Arbeitslosengeld) تصمیم برای دریافت مقرری بیکاری</span>
|
||||
</div>
|
||||
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Arbeitslosengeld">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="notice-alg1.jpg" />
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Bescheid für den Bezug von Arbeitslosengeld</span>
|
||||
<span class="localized english" lang="en">Notice for unemployment benefit (Arbeitslosengeld)</span>
|
||||
<span class="localized french" lang="fr">Décision de recevoir des allocations de chômage (Arbeitslosengeld)</span>
|
||||
<span class="localized ukrainian" lang="ua">Рішення про отримання допомоги по безробіттю (Arbeitslosengeld)</span>
|
||||
<span class="localized russian" lang="ru">Решение о получении пособия по безработице (Arbeitslosengeld)</span>
|
||||
<span class="localized arabic" lang="ar">(Arbeitslosengeld) قرار الحصول على إعانة البطالة</span>
|
||||
<span class="localized persian" lang="fa">(Arbeitslosengeld) تصمیم برای دریافت مقرری بیکاری</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="radio tab-5-cell-1" name="document" value="Fiktionsbescheinigung">
|
||||
<img src="notice-fiktionsbescheinigung.jpg"/>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Fiktionsbescheinigung</span>
|
||||
<span class="localized english" lang="en">Preliminarily residence certificate (Fiktionsbescheinigung)</span>
|
||||
<span class="localized french" lang="fr">Certificat de résidence préalable (Fiktionsbescheinigung)</span>
|
||||
<span class="localized ukrainian" lang="ua">Рішення про отримання допомоги по безробіттю (Fiktionsbescheinigung)</span>
|
||||
<span class="localized russian" lang="ru">Предварительно свидетельство о проживании (Fiktionsbescheinigung)</span>
|
||||
<span class="localized arabic" lang="ar">(Fiktionsbescheinigung) شهادة إقامة مؤقتة</span>
|
||||
<span class="localized persian" lang="fa">(Fiktionsbescheinigung) گواهی اقامت اولیه</span>
|
||||
</div>
|
||||
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Fiktionsbescheinigung">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="notice-fiktionsbescheinigung.jpg"/>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Fiktionsbescheinigung</span>
|
||||
<span class="localized english" lang="en">Preliminarily residence certificate (Fiktionsbescheinigung)</span>
|
||||
<span class="localized french" lang="fr">Certificat de résidence préalable (Fiktionsbescheinigung)</span>
|
||||
<span class="localized ukrainian" lang="ua">Рішення про отримання допомоги по безробіттю (Fiktionsbescheinigung)</span>
|
||||
<span class="localized russian" lang="ru">Предварительно свидетельство о проживании (Fiktionsbescheinigung)</span>
|
||||
<span class="localized arabic" lang="ar">(Fiktionsbescheinigung) شهادة إقامة مؤقتة</span>
|
||||
<span class="localized persian" lang="fa">(Fiktionsbescheinigung) گواهی اقامت اولیه</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="radio tab-5-cell-1" name="document" value="Ukrainian Passport">
|
||||
<img src="notice-ukrainian-pass.png" />
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Ukrainischer Pass</span>
|
||||
<span class="localized english" lang="en">Ukrainian passport</span>
|
||||
<span class="localized french" lang="fr">Passeport ukrainien</span>
|
||||
<span class="localized ukrainian" lang="ua">український паспорт</span>
|
||||
<span class="localized russian" lang="ru">украинский паспорт</span>
|
||||
<span class="localized arabic" lang="ar">جواز سفر أوكراني</span>
|
||||
<span class="localized persian" lang="fa">پاسپورت اوکراینی</span>
|
||||
</div>
|
||||
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Ukrainian Passport">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="notice-ukrainian-pass.png" />
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Ukrainischer Pass</span>
|
||||
<span class="localized english" lang="en">Ukrainian passport</span>
|
||||
<span class="localized french" lang="fr">Passeport ukrainien</span>
|
||||
<span class="localized ukrainian" lang="ua">український паспорт</span>
|
||||
<span class="localized russian" lang="ru">украинский паспорт</span>
|
||||
<span class="localized arabic" lang="ar">جواز سفر أوكراني</span>
|
||||
<span class="localized persian" lang="fa">پاسپورت اوکراینی</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden step step-device grayed">
|
||||
<div class="hidden step grayed" id="step-device">
|
||||
<div class="description">
|
||||
<p class="localized german" lang="de">Welches Gerät benötigst du?</p>
|
||||
<p class="localized english" lang="en">Which device do you need?</p>
|
||||
|
|
@ -438,37 +551,45 @@
|
|||
<p class="localized persian" lang="fa">به کدام دستگاه نیاز دارید؟</p>
|
||||
</div>
|
||||
|
||||
<table class="selection">
|
||||
</tr>
|
||||
<td class="radio" name="device" value="Desktop-PC">
|
||||
<img src="device-desktop.png"/>
|
||||
<div class="caption">
|
||||
<span class="caption localized german" lang="de">Desktop-PC (Wartezeit bis zu 3 Monate)</span>
|
||||
<span class="caption localized english" lang="en">Desktop-PC (Waiting time till to 3 month)</span>
|
||||
<span class="caption localized french" lang="fr">Desktop-PC (temps d'attente jusqu'à 3 mois)</span>
|
||||
<span class="caption localized ukrainian" lang="ua">Desktop-PC (Час очікування до 3 місяців)</span>
|
||||
<span class="caption localized russian" lang="ru">Desktop-PC (время ожидания до 3 месяцев)</span>
|
||||
<span class="caption localized arabic" lang="ar">Desktop-PC (مدة الانتظار تصل إلى 3 أشهر)</span>
|
||||
<span class="caption localized persian" lang="fa">Desktop-PC (مدت زمان انتظار تا 3 ماه)</span>
|
||||
<div class="selection pictured-selection tab-2">
|
||||
<div class="items">
|
||||
<div class="tab-2-cell-1 tab-cell radio" name="device" value="Desktop-PC">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="device-desktop.png"/>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Desktop-PC mit Monitor, Tastatur, Maus und WLAN-Adapter (Wartezeit bis zu 3 Monate)</span>
|
||||
<span class="localized english" lang="en">Desktop-PC with display, keyboard, mouse and WiFi adapter (Waiting time up to 3 month)</span>
|
||||
<span class="localized french" lang="fr">PC de bureau avec moniteur, clavier, souris et adaptateur WLAN (temps d'attente jusqu'à 3 mois)</span>
|
||||
<span class="localized ukrainian" lang="ua">Настільний ПК з монітором, клавіатурою, мишею та адаптером WLAN (час очікування до 3 місяців)</span>
|
||||
<span class="localized russian" lang="ru">Настольный ПК с монитором, клавиатурой, мышью и адаптером WLAN (время ожидания до 3 месяцев)</span>
|
||||
<span class="localized arabic" lang="ar">كمبيوتر مكتبي مزود بشاشة ولوحة مفاتيح وماوس ومحول WLAN (مدة انتظار تصل إلى 3 أشهر)</span>
|
||||
<span class="localized persian" lang="fa">کامپیوتر رومیزی با مانیتور، صفحه کلید، ماوس و آداپتور WLAN (مدت زمان انتظار تا 3 ماه)</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="radio" name="device" value="Laptop">
|
||||
<img src="device-laptop.png"/>
|
||||
<div class="caption">
|
||||
<span class="caption localized german" lang="de">Laptop (Wartezeit bis zu 12 Monate)</span>
|
||||
<span class="caption localized english" lang="en">Laptop (Waiting time till to 12 month)</span>
|
||||
<span class="caption localized french" lang="fr">Laptop (temps d'attente jusqu'à 12 mois)</span>
|
||||
<span class="caption localized ukrainian" lang="ua">Laptop (Час очікування до 12 місяців)</span>
|
||||
<span class="caption localized russian" lang="ru">Laptop (время ожидания до 12 месяцев)</span>
|
||||
<span class="caption localized arabic" lang="ar">Laptop (مدة الانتظار تصل إلى 12 أشهر)</span>
|
||||
<span class="caption localized persian" lang="fa">Laptop (مدت زمان انتظار تا 12 ماه)</span>
|
||||
</div>
|
||||
<div class="tab-2-cell-1 tab-cell radio" name="device" value="Laptop">
|
||||
<div class="label">
|
||||
<div class="picture">
|
||||
<img src="device-laptop.png"/>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<span class="localized german" lang="de">Laptop (Wartezeit bis zu 12 Monate)</span>
|
||||
<span class="localized english" lang="en">Laptop (Waiting time up to 12 month)</span>
|
||||
<span class="localized french" lang="fr">Laptop (temps d'attente jusqu'à 12 mois)</span>
|
||||
<span class="localized ukrainian" lang="ua">Laptop (Час очікування до 12 місяців)</span>
|
||||
<span class="localized russian" lang="ru">Laptop (время ожидания до 12 месяцев)</span>
|
||||
<span class="localized arabic" lang="ar">Laptop (مدة الانتظار تصل إلى 12 أشهر)</span>
|
||||
<span class="localized persian" lang="fa">Laptop (مدت زمان انتظار تا 12 ماه)</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden step step-data-processing grayed">
|
||||
<div class="hidden step grayed" id="step-data-processing">
|
||||
<div class="description">
|
||||
<p class="localized german" lang="de">Als letzten Schritt musst du uns noch die Erlaubnis geben deine Daten im Rahmen des Antrags verarbeiten zu können. (<a href="https://hardwareforfuture.de/datenschutzerklaerung/">Unsere Datenschutzerklärung</a>).</p>
|
||||
<p class="localized english" lang="en">In the last step of the application you must allow us to process your data in the context of your appliaction. (<a href="https://hardwareforfuture.de/datenschutzerklaerung/">Our data protection explanation</a>).</p>
|
||||
|
|
@ -479,40 +600,45 @@
|
|||
<p class="localized persian" lang="fa">به عنوان آخرین مرحله، باید به ما اجازه دهید تا داده های شما را به عنوان بخشی از برنامه پردازش کنیم. (<a href="https://hardwareforfuture.de/datenschutzerklaerung/">حفاظت اطلاعات</a>)</p>
|
||||
</div>
|
||||
|
||||
<table class="selection">
|
||||
<tr>
|
||||
<td class="radio tab-2-cell-1" name="data-processing" value="yes">
|
||||
<span class="label localized german">Ich akzeptiere die Verarbeitung meiner Daten.</span>
|
||||
<span class="label localized english">I accept the processing of my data.</span>
|
||||
<span class="label localized french">J'accepte le traitement de mes données.</span>
|
||||
<span class="label localized ukrainian">Я приймаю обробку моїх даних.</span>
|
||||
<span class="label localized russian">Я принимаю обработку моих данных.</span>
|
||||
<span class="label localized arabic">أنا أقبل معالجة بياناتي.</span>
|
||||
<span class="label localized persian">من پردازش داده های خود را می پذیرم.</span>
|
||||
</td>
|
||||
<td class="radio tab-2-cell-1" name="data-processing" value="no">
|
||||
<span class="label localized german">Ich lehne ab.</span>
|
||||
<span class="label localized english">I decline.</span>
|
||||
<span class="label localized french">Je refuse.</span>
|
||||
<span class="label localized ukrainian">Я відмовляюся.</span>
|
||||
<span class="label localized russian">Я отказываюсь.</span>
|
||||
<span class="label localized arabic">أرفض.</span>
|
||||
<span class="label localized persian">رد میکنم.</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="selection text-selection tab-2">
|
||||
<div class="items">
|
||||
<div class="tab-2-cell-1 radio" name="data-processing" value="yes">
|
||||
<div class="label">
|
||||
<span class="localized german">Ich akzeptiere die Verarbeitung meiner Daten.</span>
|
||||
<span class="localized english">I accept the processing of my data.</span>
|
||||
<span class="localized french">J'accepte le traitement de mes données.</span>
|
||||
<span class="localized ukrainian">Я приймаю обробку моїх даних.</span>
|
||||
<span class="localized russian">Я принимаю обработку моих данных.</span>
|
||||
<span class="localized arabic">أنا أقبل معالجة بياناتي.</span>
|
||||
<span class="localized persian">من پردازش داده های خود را می پذیرم.</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-2-cell-1 radio" name="data-processing" value="no">
|
||||
<div class="label">
|
||||
<span class="label localized german">Ich lehne ab.</span>
|
||||
<span class="label localized english">I decline.</span>
|
||||
<span class="label localized french">Je refuse.</span>
|
||||
<span class="label localized ukrainian">Я відмовляюся.</span>
|
||||
<span class="label localized russian">Я отказываюсь.</span>
|
||||
<span class="label localized arabic">أرفض.</span>
|
||||
<span class="label localized persian">رد میکنم.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden step step-submission grayed">
|
||||
<div class="hidden step grayed" id="step-submission">
|
||||
<a class="submission button center" id="email_link">
|
||||
<span class="localized german">E-Mail erstellen zur Übermittlung des Antrags und anschließend absenden.</span>
|
||||
<span class="localized english">Create the mail for your application and submit it.</span>
|
||||
<span class="localized french">Créez le courrier pour votre candidature et soumettez-le.</span>
|
||||
<span class="localized ukrainian">Створіть пошту для своєї заявки та надішліть її.</span>
|
||||
<span class="localized russian">Создайте почту для своего приложения и отправьте ее.</span>
|
||||
<span class="localized arabic">قم بإنشاء البريد الخاص بطلبك وقم بإرساله.</span>
|
||||
<span class="localized persian">ایمیل درخواست خود را ایجاد کنید و آن را ارسال کنید.</span>
|
||||
<div class="label">
|
||||
<span class="localized german">E-Mail erstellen zur Übermittlung des Antrags und anschließend absenden.</span>
|
||||
<span class="localized english">Create the mail for your application and submit it.</span>
|
||||
<span class="localized french">Créez le courrier pour votre candidature et soumettez-le.</span>
|
||||
<span class="localized ukrainian">Створіть пошту для своєї заявки та надішліть її.</span>
|
||||
<span class="localized russian">Создайте почту для своего приложения и отправьте ее.</span>
|
||||
<span class="localized arabic">قم بإنشاء البريد الخاص بطلبك وقم بإرساله.</span>
|
||||
<span class="localized persian">ایمیل درخواست خود را ایجاد کنید و آن را ارسال کنید.</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue