Added mobil layout, extend desktop description
This commit is contained in:
parent
2a8ca37fb2
commit
92ca10ca53
570
antrag.html
570
antrag.html
|
@ -3,6 +3,10 @@
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||||
<style>
|
<style>
|
||||||
|
body {
|
||||||
|
font-family: Arial, Helvetica, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
.description {
|
.description {
|
||||||
padding-bottom: 1em;
|
padding-bottom: 1em;
|
||||||
}
|
}
|
||||||
|
@ -11,21 +15,14 @@
|
||||||
padding-bottom: 2em;
|
padding-bottom: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.step-submission .button {
|
|
||||||
margin: auto;
|
|
||||||
width: 50%;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.step .description {
|
.step .description {
|
||||||
font-weight: 650;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center {
|
.center {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
border: 3px solid green;
|
padding: 0.1em;
|
||||||
padding: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.hidden {
|
.hidden {
|
||||||
|
@ -53,13 +50,14 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.button {
|
.button {
|
||||||
|
display: block;
|
||||||
color: #6ab43e;
|
color: #6ab43e;
|
||||||
border-color: #dedede;
|
border-color: #dedede;
|
||||||
border-radius: 1em;
|
border-radius: 1em;
|
||||||
background: #eee;
|
border-style: solid;
|
||||||
|
border-width: 0.2em;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: larger;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.button:hover {
|
.button:hover {
|
||||||
|
@ -73,9 +71,8 @@
|
||||||
border-radius: 1em;
|
border-radius: 1em;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-width: 0.2em;
|
border-width: 0.2em;
|
||||||
background: #eee;
|
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
text-align: center;
|
transition: opacity 1s, border-color 1s, filter 1s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.radio:hover {
|
.radio:hover {
|
||||||
|
@ -84,45 +81,121 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.radio-selected {
|
.radio-selected {
|
||||||
color: #dedede;
|
|
||||||
background: #6ab43e;
|
|
||||||
text-shadow: none;
|
text-shadow: none;
|
||||||
|
border-color: #6ab43e;
|
||||||
|
opacity: 1.0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.radio-not-selected {
|
.radio-not-selected {
|
||||||
|
border-color: #dedede;
|
||||||
|
opacity: 0.3;
|
||||||
|
filter: grayscale(100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.tab-2-cell-1 {
|
.text-selection {
|
||||||
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-align: center;
|
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>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
|
@ -148,10 +221,18 @@
|
||||||
elm.classList.add("fade-in");
|
elm.classList.add("fade-in");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function jump_to_step(step) {
|
||||||
|
window.scrollTo(0, document.getElementById("step-"+step).offsetTop);
|
||||||
|
}
|
||||||
|
|
||||||
function option_choosen(event) {
|
function option_choosen(event) {
|
||||||
var elm = event.target;
|
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;
|
elm = elm.parentNode;
|
||||||
if (!elm.parentNode)
|
if (!elm.parentNode)
|
||||||
return;
|
return;
|
||||||
|
@ -162,14 +243,17 @@
|
||||||
var name = elm.attributes.name.nodeValue;
|
var name = elm.attributes.name.nodeValue;
|
||||||
var value = elm.attributes.value.nodeValue;
|
var value = elm.attributes.value.nodeValue;
|
||||||
application[name] = value;
|
application[name] = value;
|
||||||
console.log(elm.attributes);
|
|
||||||
console.log(application);
|
|
||||||
|
|
||||||
elm.parentNode.parentNode.querySelectorAll(".radio").forEach(function(e) {
|
elm.parentNode.parentNode.parentNode.querySelectorAll(".radio").forEach(function(e) {
|
||||||
e.classList.remove("radio-selected");
|
if (e == elm) {
|
||||||
e.classList.add("radio-not-selected");
|
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) {
|
switch(name) {
|
||||||
case "language":
|
case "language":
|
||||||
|
@ -177,32 +261,39 @@
|
||||||
document.querySelectorAll("." + value).forEach(function(elm) { show(elm); } );
|
document.querySelectorAll("." + value).forEach(function(elm) { show(elm); } );
|
||||||
document.querySelectorAll(".step").forEach(function(elm) { show(elm); } );
|
document.querySelectorAll(".step").forEach(function(elm) { show(elm); } );
|
||||||
|
|
||||||
document.querySelectorAll(".step-description").forEach(function(elm) { ungray(elm); } );
|
ungray(document.getElementById("step-description"));
|
||||||
document.querySelectorAll(".step-domicilie").forEach(function(elm) { ungray(elm); } );
|
ungray(document.getElementById("step-domicilie"));
|
||||||
|
jump_to_step("description");
|
||||||
|
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "domicilie":
|
case "domicilie":
|
||||||
document.querySelectorAll(".step-notice").forEach(function(elm) { ungray(elm); } );
|
ungray(document.getElementById("step-notice"));
|
||||||
|
jump_to_step("notice");
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "document":
|
case "document":
|
||||||
document.querySelectorAll(".step-device").forEach(function(elm) { ungray(elm); } );
|
ungray(document.getElementById("step-device"));
|
||||||
|
jump_to_step("device");
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "device":
|
case "device":
|
||||||
document.querySelectorAll(".step-data-processing").forEach(function(elm) { ungray(elm); } );
|
ungray(document.getElementById("step-data-processing"));
|
||||||
|
jump_to_step("data-processing");
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "data-processing":
|
case "data-processing":
|
||||||
if (application["data-processing"] == "yes") {
|
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";
|
var subject = "Antrag für Gerät " + application['device'] + "/Wohnort " + application['domicilie']+ "/Nachweis " + application['document'] + "/Wizard";
|
||||||
console.log(subject);
|
console.log(subject);
|
||||||
var email_link = "mailto:mail@hardwareforfuture.de?subject=" + encodeURI(subject);
|
var email_link = "mailto:mail@hardwareforfuture.de?subject=" + encodeURI(subject);
|
||||||
document.getElementById("email_link").href = email_link;
|
document.getElementById("email_link").href = email_link;
|
||||||
} else {
|
} else {
|
||||||
document.querySelectorAll(".step-submission").forEach(function(elm) { gray(elm); } );
|
gray(document.getElementById("step-submission"));
|
||||||
document.getElementById("email_link").href = "";
|
document.getElementById("email_link").href = "";
|
||||||
|
jump_to_step("data-processing");
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
@ -211,7 +302,7 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="application">
|
<div class="application">
|
||||||
<div class="show step step-language">
|
<div class="show step" id="step-language">
|
||||||
<div class="description">
|
<div class="description">
|
||||||
<span class="german" lang="de">Welche Sprache?</span>
|
<span class="german" lang="de">Welche Sprache?</span>
|
||||||
<span class="english" lang="en">Which language?</span>
|
<span class="english" lang="en">Which language?</span>
|
||||||
|
@ -222,34 +313,34 @@
|
||||||
<span class="persian" lang="fa">چه زبانی؟ (ترجمه ماشینی)</span>
|
<span class="persian" lang="fa">چه زبانی؟ (ترجمه ماشینی)</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="selection">
|
<div class="selection text-selection tab-7">
|
||||||
<tr>
|
<div class="items">
|
||||||
<td class="radio tab-7-cell-1" name="language" value="german">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="german">
|
||||||
<span class="label">Deutsch</span>
|
<span class="label">Deutsch</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-7-cell-1" name="language" value="english">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="english">
|
||||||
<span class="label">English</span>
|
<span class="label">English</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-7-cell-1" name="language" value="french">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="french">
|
||||||
<span class="label">Français (traduit automatiquement)</span>
|
<span class="label">Français (divaduit automatiquement)</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-7-cell-1" name="language" value="ukrainian">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="ukrainian">
|
||||||
<span class="label">український (машинний переклад)</span>
|
<span class="label">український (машинний переклад)</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-7-cell-1" name="language" value="russian">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="russian">
|
||||||
<span class="label">Русский (машинный перевод)</span>
|
<span class="label">Русский (машинный перевод)</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-7-cell-1" name="language" value="arabic">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="arabic">
|
||||||
<span class="label">العربية (آلة مترجمة)</span>
|
<span class="label">العربية (آلة مترجمة)</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-7-cell-1" name="language" value="persian">
|
<div class="tab-cell tab-7-cell-1 radio" name="language" value="persian">
|
||||||
<span class="label">عربی (ترجمه ماشینی)</span>
|
<span class="label">عربی (ترجمه ماشینی)</span>
|
||||||
</td>
|
</div>
|
||||||
</tr>
|
</div>
|
||||||
</table>
|
</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">
|
<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>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>
|
<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>
|
</div>
|
||||||
|
|
||||||
<div class="hidden step step-domicilie grayed">
|
<div class="hidden step grayed" id="step-domicilie">
|
||||||
<div class="description">
|
<div class="description">
|
||||||
<p class="localized german" lang="de">Wo wohnst du zurzeit?</p>
|
<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>
|
<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>
|
<p class="localized persian" lang="fa">در حال حاضر کجا زندگی می کنید؟</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="selection">
|
<div class="selection text-selection tab-6">
|
||||||
<tr>
|
<div class="items">
|
||||||
<td class="radio tab-6-cell-1" name="domicilie" value="Leipzig">
|
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Leipzig">
|
||||||
<span>Leipzig</span>
|
<span class="label">Leipzig</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-6-cell-1" name="domicilie" value="Leipziger Land">
|
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Leipziger Land">
|
||||||
<span>Leipziger Land</span>
|
<span class="label">Leipziger Land</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-6-cell-1" name="domicilie" value="Halle">
|
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Halle">
|
||||||
<span>Halle</span>
|
<span class="label">Halle</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-6-cell-1" name="domicilie" value="Chemnitz">
|
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Chemnitz">
|
||||||
<span>Chemnitz</span>
|
<span class="label">Chemnitz</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-6-cell-1" name="domicilie" value="Dresden">
|
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Dresden">
|
||||||
<label>Dresden</label>
|
<span class="label">Dresden</span>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-6-cell-1" name="domicilie" value="Else">
|
<div class="tab-6-cell-1 tab-cell radio" name="domicilie" value="Else">
|
||||||
<span class="localized german" lang="de">Andere</span>
|
<div class="label">
|
||||||
<span class="localized english" lang="en">Else</span>
|
<span class="localized german" lang="de">Andere</span>
|
||||||
<span class="localized french" lang="fr">Autre</span>
|
<span class="localized english" lang="en">Else</span>
|
||||||
<span class="localized ukrainian" lang="ua">Інший</span>
|
<span class="localized french" lang="fr">Autre</span>
|
||||||
<span class="localized russian" lang="ru">Другой</span>
|
<span class="localized ukrainian" lang="ua">Інший</span>
|
||||||
<span class="localized arabic" lang="ar">آخر</span>
|
<span class="localized russian" lang="ru">Другой</span>
|
||||||
<span class="localized persian" lang="fa">دیگر</span>
|
<span class="localized arabic" lang="ar">آخر</span>
|
||||||
</td>
|
<span class="localized persian" lang="fa">دیگر</span>
|
||||||
</tr>
|
</div>
|
||||||
</table>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="hidden step step-notice grayed">
|
<div class="hidden step grayed" id="step-notice">
|
||||||
<div class="description">
|
<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 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>
|
<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>
|
<p class="localized persian" lang="fa">ﻡﺍ ﺐﻫ ﻡﺩﺮﮐ ﻦﯾﺍﺯ ﺶﻣﺍ ﺍﺯ ﺶﻣﺍ ﻦﯾﺍﺯ ﺩﺍﺮﯿﻣ. ﭻﻫ ﺲﻧﺪﯾ ﺩﺍﺮﯾﺩ؟</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="selection">
|
<div class="selection pictured-selection tab-5">
|
||||||
<tr>
|
<div class="items">
|
||||||
<td class="radio tab-5-cell-1" name="document" value="Leipzig-Pass">
|
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Leipzig-Pass">
|
||||||
<img src="notice-leipzig-pass.png"/>
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span>Leipzig Pass</span>
|
<img src="notice-leipzig-pass.png"/>
|
||||||
|
</div>
|
||||||
|
<div class="caption">
|
||||||
|
<span>Leipzig Pass</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-5-cell-1" name="document" value="Sozialhilfe Bescheid/ALG2">
|
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Sozialhilfe Bescheid/ALG2">
|
||||||
<img src="notice-alg2.jpg"/>
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span class="localized german" lang="de">Sozialhilfebescheid / ALG2</span>
|
<img src="notice-alg2.jpg"/>
|
||||||
<span class="localized english" lang="en">Social security notice (Sozialhilfebescheid/ALG2)</span>
|
</div>
|
||||||
<span class="localized french" lang="fr">Avis de sécurité sociale (Sozialhilfebescheid/ALG2)</span>
|
<div class="caption">
|
||||||
<span class="localized ukrainian" lang="ua">повідомлення про соціальне страхування (Sozialhilfebescheid/ALG2)</span>
|
<span class="localized german" lang="de">Sozialhilfebescheid / ALG2</span>
|
||||||
<span class="localized russian" lang="ru">уведомление о социальном обеспечении (Sozialhilfebescheid/ALG2)</span>
|
<span class="localized english" lang="en">Social security notice (Sozialhilfebescheid/ALG2)</span>
|
||||||
<span class="localized arabic" lang="ar">(Sozialhilfebescheid/ALG2) إشعار الضمان الاجتماعي</span>
|
<span class="localized french" lang="fr">Avis de sécurité sociale (Sozialhilfebescheid/ALG2)</span>
|
||||||
<span class="localized persian" lang="fa">(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>
|
</div>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-5-cell-1" name="document" value="Arbeitslosengeld">
|
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Arbeitslosengeld">
|
||||||
<img src="notice-alg1.jpg" />
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span class="localized german" lang="de">Bescheid für den Bezug von Arbeitslosengeld</span>
|
<img src="notice-alg1.jpg" />
|
||||||
<span class="localized english" lang="en">Notice for unemployment benefit (Arbeitslosengeld)</span>
|
</div>
|
||||||
<span class="localized french" lang="fr">Décision de recevoir des allocations de chômage (Arbeitslosengeld)</span>
|
<div class="caption">
|
||||||
<span class="localized ukrainian" lang="ua">Рішення про отримання допомоги по безробіттю (Arbeitslosengeld)</span>
|
<span class="localized german" lang="de">Bescheid für den Bezug von Arbeitslosengeld</span>
|
||||||
<span class="localized russian" lang="ru">Решение о получении пособия по безработице (Arbeitslosengeld)</span>
|
<span class="localized english" lang="en">Notice for unemployment benefit (Arbeitslosengeld)</span>
|
||||||
<span class="localized arabic" lang="ar">(Arbeitslosengeld) قرار الحصول على إعانة البطالة</span>
|
<span class="localized french" lang="fr">Décision de recevoir des allocations de chômage (Arbeitslosengeld)</span>
|
||||||
<span class="localized persian" lang="fa">(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>
|
</div>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-5-cell-1" name="document" value="Fiktionsbescheinigung">
|
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Fiktionsbescheinigung">
|
||||||
<img src="notice-fiktionsbescheinigung.jpg"/>
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span class="localized german" lang="de">Fiktionsbescheinigung</span>
|
<img src="notice-fiktionsbescheinigung.jpg"/>
|
||||||
<span class="localized english" lang="en">Preliminarily residence certificate (Fiktionsbescheinigung)</span>
|
</div>
|
||||||
<span class="localized french" lang="fr">Certificat de résidence préalable (Fiktionsbescheinigung)</span>
|
<div class="caption">
|
||||||
<span class="localized ukrainian" lang="ua">Рішення про отримання допомоги по безробіттю (Fiktionsbescheinigung)</span>
|
<span class="localized german" lang="de">Fiktionsbescheinigung</span>
|
||||||
<span class="localized russian" lang="ru">Предварительно свидетельство о проживании (Fiktionsbescheinigung)</span>
|
<span class="localized english" lang="en">Preliminarily residence certificate (Fiktionsbescheinigung)</span>
|
||||||
<span class="localized arabic" lang="ar">(Fiktionsbescheinigung) شهادة إقامة مؤقتة</span>
|
<span class="localized french" lang="fr">Certificat de résidence préalable (Fiktionsbescheinigung)</span>
|
||||||
<span class="localized persian" lang="fa">(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>
|
</div>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio tab-5-cell-1" name="document" value="Ukrainian Passport">
|
<div class="tab-5-cell-1 tab-cell radio" name="document" value="Ukrainian Passport">
|
||||||
<img src="notice-ukrainian-pass.png" />
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span class="localized german" lang="de">Ukrainischer Pass</span>
|
<img src="notice-ukrainian-pass.png" />
|
||||||
<span class="localized english" lang="en">Ukrainian passport</span>
|
</div>
|
||||||
<span class="localized french" lang="fr">Passeport ukrainien</span>
|
<div class="caption">
|
||||||
<span class="localized ukrainian" lang="ua">український паспорт</span>
|
<span class="localized german" lang="de">Ukrainischer Pass</span>
|
||||||
<span class="localized russian" lang="ru">украинский паспорт</span>
|
<span class="localized english" lang="en">Ukrainian passport</span>
|
||||||
<span class="localized arabic" lang="ar">جواز سفر أوكراني</span>
|
<span class="localized french" lang="fr">Passeport ukrainien</span>
|
||||||
<span class="localized persian" lang="fa">پاسپورت اوکراینی</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>
|
||||||
</td>
|
</div>
|
||||||
</tr>
|
</div>
|
||||||
</table>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="hidden step step-device grayed">
|
<div class="hidden step grayed" id="step-device">
|
||||||
<div class="description">
|
<div class="description">
|
||||||
<p class="localized german" lang="de">Welches Gerät benötigst du?</p>
|
<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>
|
<p class="localized english" lang="en">Which device do you need?</p>
|
||||||
|
@ -438,37 +551,45 @@
|
||||||
<p class="localized persian" lang="fa">به کدام دستگاه نیاز دارید؟</p>
|
<p class="localized persian" lang="fa">به کدام دستگاه نیاز دارید؟</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="selection">
|
<div class="selection pictured-selection tab-2">
|
||||||
</tr>
|
<div class="items">
|
||||||
<td class="radio" name="device" value="Desktop-PC">
|
<div class="tab-2-cell-1 tab-cell radio" name="device" value="Desktop-PC">
|
||||||
<img src="device-desktop.png"/>
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span class="caption localized german" lang="de">Desktop-PC (Wartezeit bis zu 3 Monate)</span>
|
<img src="device-desktop.png"/>
|
||||||
<span class="caption localized english" lang="en">Desktop-PC (Waiting time till to 3 month)</span>
|
</div>
|
||||||
<span class="caption localized french" lang="fr">Desktop-PC (temps d'attente jusqu'à 3 mois)</span>
|
<div class="caption">
|
||||||
<span class="caption localized ukrainian" lang="ua">Desktop-PC (Час очікування до 3 місяців)</span>
|
<span class="localized german" lang="de">Desktop-PC mit Monitor, Tastatur, Maus und WLAN-Adapter (Wartezeit bis zu 3 Monate)</span>
|
||||||
<span class="caption localized russian" lang="ru">Desktop-PC (время ожидания до 3 месяцев)</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="caption localized arabic" lang="ar">Desktop-PC (مدة الانتظار تصل إلى 3 أشهر)</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="caption localized persian" lang="fa">Desktop-PC (مدت زمان انتظار تا 3 ماه)</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>
|
</div>
|
||||||
</td>
|
</div>
|
||||||
<td class="radio" name="device" value="Laptop">
|
<div class="tab-2-cell-1 tab-cell radio" name="device" value="Laptop">
|
||||||
<img src="device-laptop.png"/>
|
<div class="label">
|
||||||
<div class="caption">
|
<div class="picture">
|
||||||
<span class="caption localized german" lang="de">Laptop (Wartezeit bis zu 12 Monate)</span>
|
<img src="device-laptop.png"/>
|
||||||
<span class="caption localized english" lang="en">Laptop (Waiting time till to 12 month)</span>
|
</div>
|
||||||
<span class="caption localized french" lang="fr">Laptop (temps d'attente jusqu'à 12 mois)</span>
|
<div class="caption">
|
||||||
<span class="caption localized ukrainian" lang="ua">Laptop (Час очікування до 12 місяців)</span>
|
<span class="localized german" lang="de">Laptop (Wartezeit bis zu 12 Monate)</span>
|
||||||
<span class="caption localized russian" lang="ru">Laptop (время ожидания до 12 месяцев)</span>
|
<span class="localized english" lang="en">Laptop (Waiting time up to 12 month)</span>
|
||||||
<span class="caption localized arabic" lang="ar">Laptop (مدة الانتظار تصل إلى 12 أشهر)</span>
|
<span class="localized french" lang="fr">Laptop (temps d'attente jusqu'à 12 mois)</span>
|
||||||
<span class="caption localized persian" lang="fa">Laptop (مدت زمان انتظار تا 12 ماه)</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>
|
</div>
|
||||||
</td>
|
</div>
|
||||||
</tr>
|
</div>
|
||||||
</table>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="hidden step step-data-processing grayed">
|
<div class="hidden step grayed" id="step-data-processing">
|
||||||
<div class="description">
|
<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 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>
|
<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>
|
<p class="localized persian" lang="fa">به عنوان آخرین مرحله، باید به ما اجازه دهید تا داده های شما را به عنوان بخشی از برنامه پردازش کنیم. (<a href="https://hardwareforfuture.de/datenschutzerklaerung/">حفاظت اطلاعات</a>)</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table class="selection">
|
<div class="selection text-selection tab-2">
|
||||||
<tr>
|
<div class="items">
|
||||||
<td class="radio tab-2-cell-1" name="data-processing" value="yes">
|
<div class="tab-2-cell-1 radio" name="data-processing" value="yes">
|
||||||
<span class="label localized german">Ich akzeptiere die Verarbeitung meiner Daten.</span>
|
<div class="label">
|
||||||
<span class="label localized english">I accept the processing of my data.</span>
|
<span class="localized german">Ich akzeptiere die Verarbeitung meiner Daten.</span>
|
||||||
<span class="label localized french">J'accepte le traitement de mes données.</span>
|
<span class="localized english">I accept the processing of my data.</span>
|
||||||
<span class="label localized ukrainian">Я приймаю обробку моїх даних.</span>
|
<span class="localized french">J'accepte le traitement de mes données.</span>
|
||||||
<span class="label localized russian">Я принимаю обработку моих данных.</span>
|
<span class="localized ukrainian">Я приймаю обробку моїх даних.</span>
|
||||||
<span class="label localized arabic">أنا أقبل معالجة بياناتي.</span>
|
<span class="localized russian">Я принимаю обработку моих данных.</span>
|
||||||
<span class="label localized persian">من پردازش داده های خود را می پذیرم.</span>
|
<span class="localized arabic">أنا أقبل معالجة بياناتي.</span>
|
||||||
</td>
|
<span class="localized persian">من پردازش داده های خود را می پذیرم.</span>
|
||||||
<td class="radio tab-2-cell-1" name="data-processing" value="no">
|
</div>
|
||||||
<span class="label localized german">Ich lehne ab.</span>
|
</div>
|
||||||
<span class="label localized english">I decline.</span>
|
<div class="tab-2-cell-1 radio" name="data-processing" value="no">
|
||||||
<span class="label localized french">Je refuse.</span>
|
<div class="label">
|
||||||
<span class="label localized ukrainian">Я відмовляюся.</span>
|
<span class="label localized german">Ich lehne ab.</span>
|
||||||
<span class="label localized russian">Я отказываюсь.</span>
|
<span class="label localized english">I decline.</span>
|
||||||
<span class="label localized arabic">أرفض.</span>
|
<span class="label localized french">Je refuse.</span>
|
||||||
<span class="label localized persian">رد میکنم.</span>
|
<span class="label localized ukrainian">Я відмовляюся.</span>
|
||||||
</td>
|
<span class="label localized russian">Я отказываюсь.</span>
|
||||||
</tr>
|
<span class="label localized arabic">أرفض.</span>
|
||||||
</table>
|
<span class="label localized persian">رد میکنم.</span>
|
||||||
|
</div>
|
||||||
|
</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">
|
<a class="submission button center" id="email_link">
|
||||||
<span class="localized german">E-Mail erstellen zur Übermittlung des Antrags und anschließend absenden.</span>
|
<div class="label">
|
||||||
<span class="localized english">Create the mail for your application and submit it.</span>
|
<span class="localized german">E-Mail erstellen zur Übermittlung des Antrags und anschließend absenden.</span>
|
||||||
<span class="localized french">Créez le courrier pour votre candidature et soumettez-le.</span>
|
<span class="localized english">Create the mail for your application and submit it.</span>
|
||||||
<span class="localized ukrainian">Створіть пошту для своєї заявки та надішліть її.</span>
|
<span class="localized french">Créez le courrier pour votre candidature et soumettez-le.</span>
|
||||||
<span class="localized russian">Создайте почту для своего приложения и отправьте ее.</span>
|
<span class="localized ukrainian">Створіть пошту для своєї заявки та надішліть її.</span>
|
||||||
<span class="localized arabic">قم بإنشاء البريد الخاص بطلبك وقم بإرساله.</span>
|
<span class="localized russian">Создайте почту для своего приложения и отправьте ее.</span>
|
||||||
<span class="localized persian">ایمیل درخواست خود را ایجاد کنید و آن را ارسال کنید.</span>
|
<span class="localized arabic">قم بإنشاء البريد الخاص بطلبك وقم بإرساله.</span>
|
||||||
|
<span class="localized persian">ایمیل درخواست خود را ایجاد کنید و آن را ارسال کنید.</span>
|
||||||
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue