diff --git a/img/7-vs-wild-logo.svg b/img/7-vs-wild-logo.svg
new file mode 100644
index 0000000..ef3b0fa
--- /dev/null
+++ b/img/7-vs-wild-logo.svg
@@ -0,0 +1,42 @@
+
diff --git a/script.js b/script.js
index 01cc6a6..4425d81 100644
--- a/script.js
+++ b/script.js
@@ -50,12 +50,14 @@ let fields = [
];
+const FREE_FIELD_TEXT = "Freies Parken"
+
let shuffled = fields
.map(value => ({ value, sort: Math.random() }))
.sort((a, b) => a.sort - b.sort)
.map(({ value }) => value)
-shuffled.splice(12, 0, "Freies Parken");
+shuffled.splice(12, 0, FREE_FIELD_TEXT);
function generateTable() {
let table = document.querySelector("table");
@@ -68,12 +70,19 @@ function generateTable() {
let cell = row.insertCell();
let text = document.createTextNode(field);
+ if (field == FREE_FIELD_TEXT) {
+ cell.id = 'center-field';
+ }
cell.appendChild(text);
});
-
table.addEventListener('click', (ev) => {
- if (ev.target.tagName.toLowerCase() == "td" ) {
+ let cell;
+ let target_type = ev.target.tagName.toLowerCase();
+ if (target_type === "td" || target_type === "img") {
let cell = ev.target;
+ if (target_type === "img") {
+ cell = ev.target.parentNode;
+ }
if (cell.style.borderColor == "green") {
cell.style.borderColor = "black";
cell.style.backgroundColor = "white";
@@ -86,4 +95,6 @@ function generateTable() {
}
generateTable();
+const center_field = document.querySelector('#center-field');
+center_field.innerHTML = '
'
diff --git a/style.css b/style.css
index 45c515a..49f541e 100644
--- a/style.css
+++ b/style.css
@@ -13,6 +13,11 @@ td {
font-size: 200%;
font-family: Arial, Helvetica, sans-serif;
}
+
+img {
+ width: 100%;
+}
+
h1 {
font-family: Arial, Helvetica, sans-serif;
text-align: center;