From 2f198a994cca3bb998be8844322d2c96b528fcf1 Mon Sep 17 00:00:00 2001
From: Sahel Olivan <sahel.olivan@gmail.com>
Date: Fri, 9 Dec 2022 10:31:46 +0100
Subject: [PATCH] Sahel

---
 Puissance4.css | 56 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Puissance4.js  |  8 ++++++++
 2 files changed, 64 insertions(+)
 create mode 100644 Puissance4.css
 create mode 100644 Puissance4.js

diff --git a/Puissance4.css b/Puissance4.css
new file mode 100644
index 0000000..d7a8c81
--- /dev/null
+++ b/Puissance4.css
@@ -0,0 +1,56 @@
+header
+{
+    display: flex;
+    justify-content: center;
+    background-color: white;
+    padding: 1em;
+    margin: 0 -5px;
+}
+body
+{
+    display: flex;
+    flex-direction: column;
+    background-color: #17a2b8;
+    margin: 0%;
+    padding: 0%;
+    min-height: 100vh;
+}
+a
+{
+    text-decoration: none;
+    color: grey;
+    font-size: 1.2em;
+    margin: 0 5px;
+}
+section
+{
+    padding-top: 3em;
+    padding-bottom: 3em;
+    background-color: white;
+    margin: 20em;
+    margin-top : 5em;
+    margin-bottom: 5em;
+    border-radius: 0.5em;
+}
+footer{
+    margin-top: auto;
+}
+td {
+    color: #000088;
+    text-align: center;
+    margin-top: 14px;
+    height: 6em;
+    letter-spacing: 1px;
+    border: 3px #17a2b8 inset;
+    background-color: white;
+    width: 6em;
+    border-radius: 100%;
+  }
+  #Board{
+    border: 3px #17a2b8 outset;
+    border-radius: 2%;
+    background-color: #17a2b8;
+    margin: auto;
+    padding: 0.5em;
+  }
+
diff --git a/Puissance4.js b/Puissance4.js
new file mode 100644
index 0000000..963d16a
--- /dev/null
+++ b/Puissance4.js
@@ -0,0 +1,8 @@
+
+const tbody = document.querySelector('#Board');
+tbody.addEventListener('click', function (e) {
+  const cell = e.target.closest('td');
+  if (!cell) {return;} // Quit, not clicked on a cell
+  const row = cell.parentElement;
+  console.log(cell.innerHTML, row.rowIndex, cell.cellIndex);
+});
\ No newline at end of file