diff --git a/css/style.css b/css/style.css
index f2141e7..b0cb41e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -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;
diff --git a/index.html b/index.html
index 24bbbf2..9c76df0 100644
--- a/index.html
+++ b/index.html
@@ -119,29 +119,49 @@
+
+
diff --git a/js/main.js b/js/main.js
index eb51cbe..4437229 100644
--- a/js/main.js
+++ b/js/main.js
@@ -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;