Gulum/weddingapiPage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

prepare under twelve

Browse Source
This commit is contained in:
Julian
2022-02-14 17:55:47 +01:00
parent 6031838432
commit d88b085e4a
3 changed files with 62 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
css/style.css
View File

@@ -1876,6 +1876,33 @@ form label {
opacity: 0;
}
.undertwelve > input {
text-align: center;
padding: 0px;
height: 40px;
width: 40px;
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
appearance: none;
border: 2px solid #34495E;
border-radius: 4px;
outline: none;
transition-duration: 0.3s;
background-color: #ffffff;
cursor: pointer;
}
.undertwelve > input:checked {
border: 2px solid #34495E;
background-color: #F14E95;
}
.undertwelve > input:active {
border: 3px solid #34495E;
}
.overnight {
display: table;
text-align: center;

36
index.html
View File

@@ -119,29 +119,49 @@
<div class="col-md-3 col-sm-3">
<div class="form-group">
<label for="firstname" class="sr-only">Vorname</label>
<input type="firstname" class="form-control js-form-input" id="firstname" data-i18n="firstname" data-i18n-attr="placeholder"
placeholder="Vorname">
<input type="firstname" class="form-control js-form-input" id="firstname" data-i18n="firstname"
data-i18n-attr="placeholder" placeholder="Vorname">
</div>
</div>
<div class="col-md-3 col-sm-3">
<div class="form-group">
<label for="lastname" class="sr-only">Nachname</label>
<input type="lastname" class="form-control js-form-input" id="lastname" data-i18n="lastname" data-i18n-attr="placeholder"
placeholder="Nachname">
<input type="lastname" class="form-control js-form-input" id="lastname" data-i18n="lastname"
data-i18n-attr="placeholder" placeholder="Nachname">
</div>
</div>
<div class="col-md-3 col-sm-3">
<div class="form-group">
<label for="tel" class="sr-only">Telefonnummer</label>
<input type="telephon" class="form-control js-form-input" id="tel" data-i18n="telephone_number" data-i18n-attr="placeholder"
placeholder="Telefonnummer">
<input type="telephon" class="form-control js-form-input" id="tel" data-i18n="telephone_number"
data-i18n-attr="placeholder" placeholder="Telefonnummer">
</div>
</div>
<div class="col-md-3 col-sm-3">
<div class="form-group">
<label for="email" class="sr-only">E-Mail Addresse</label>
<input type="email" class="form-control js-form-input" id="email" data-i18n="E-Mail" data-i18n-attr="placeholder"
placeholder="E-Mail">
<input type="email" class="form-control js-form-input" id="email" data-i18n="E-Mail"
data-i18n-attr="placeholder" placeholder="E-Mail">
</div>
</div>
</div>
<div style="padding-top: 20px;">
<div class="col-md-5 col-sm-6">
<div class="form-group">
<label for="firstname" class="sr-only">Vorname</label>
<input type="firstname" class="form-control js-form-input" id="firstname" placeholder="Vorname">
</div>
</div>
<div class="col-md-5 col-sm-6">
<div class="form-group">
<label for="lastname" class="sr-only">Nachname</label>
<input type="lastname" class="form-control js-form-input" id="lastname" placeholder="Nachname">
</div>
</div>
<div class="col-md-2 col-sm-2">
<div class="form-group undertwelve">
<label for="undertwelve">Unter 12 Jahre?</label>
<input class="js-undertwelve" type="checkbox" name="undertwelve" checked>
</div>
</div>
</div>

12
js/main.js
View File

@@ -226,6 +226,8 @@
inputElement.classList.add('form-control');
inputElement.classList.add('js-form-input');
inputElement.setAttribute("id","firstname");
inputElement.setAttribute("data-i18n","firstname");
inputElement.setAttribute("data-i18n-attr","placeholder");
let firstname_placeholder = await translator.getTranslationByKey(document.documentElement.lang,"firstname");
inputElement.setAttribute("placeholder", firstname_placeholder);
formGroupDiv.appendChild(inputElement);
@@ -253,6 +255,8 @@
firstNameInputElement.classList.add('form-control');
firstNameInputElement.classList.add('js-form-input');
firstNameInputElement.setAttribute("id","lastname");
firstNameInputElement.setAttribute("data-i18n","lastname");
firstNameInputElement.setAttribute("data-i18n-attr","placeholder");
let lastname_placeholder = await translator.getTranslationByKey(document.documentElement.lang,"lastname");
firstNameInputElement.setAttribute("placeholder", lastname_placeholder);
lastnameFormGroupDiv.appendChild(firstNameInputElement);
@@ -324,13 +328,11 @@
if(document.documentElement.lang == "de")
{
console.log("Load hr!");
translator.load("hr");
$(".js-flag-image").attr("srcset","flags/4x3/de.svg");
$(".js-flag-image").attr("src","flags/4x3/de.svg");
} else
{
console.log("Load de!");
translator.load("de");
$(".js-flag-image").attr("srcset","flags/4x3/hr.svg");
$(".js-flag-image").attr("src","flags/4x3/hr.svg");
@@ -592,6 +594,8 @@ document.getElementById("js-submitbtn").addEventListener("click", async function
if (!this._options.languages.includes(lang)) {
return;
}
this._elements = document.querySelectorAll("[data-i18n]");
document.documentElement.lang = lang;
@@ -662,7 +666,7 @@ document.getElementById("js-submitbtn").addEventListener("click", async function
});
}
};
this._elements.forEach(replace);
}
@@ -695,8 +699,6 @@ else {
$(".js-flag-image").attr("src","flags/4x3/de.svg");
}
var totalFieldCount = 0;