diff --git a/static/css/login.css b/static/css/login.css new file mode 100644 index 0000000..8868c46 --- /dev/null +++ b/static/css/login.css @@ -0,0 +1,86 @@ +body { + background-color: #11111b; + padding:0; + margin:0; +} + +.footer { + margin: 0; + position: fixed; + bottom: 0; + width: 100%; + max-height: 50px; + display: flex; + background-color: #b4befe; + justify-content: center; +} + +.footer > a { + padding: 10px; + margin: 5px; + background-color: #94e2d5; + border-radius: 5px; + color: #1e1e2e; + font-family: "Segoe UI"; + font-size: 14px; +} + +.app { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, calc(-50% - 60px)); + background-color: #181926; + border-radius: 12px; + width: 100%; + max-width: 500px; + height: fit-content; + padding: 10px; +} + +.app > h1 { + margin-top: 5px; + color: yellow; +} + +.app > h3 { + color: red; +} + +.sub { + display: grid; + width: fit-content; + margin: auto; +} + +.sub > input { + margin-bottom: 5px; + width: 300px; + color: black; +} + +.sub > label { + color: white; +} + +.sub > button { + justify-self: right; + font-size: 14px; + margin: 4px 0 0 0; + padding: 5px; + background-color: cornflowerblue; + color: white; + border: none; + border-radius: 5px; +} + +.app > p { + text-align: center; + color: white; +} + +.app > a { + display: flow; + text-align: center; + color: white; +} \ No newline at end of file diff --git a/static/html/login.html b/static/html/login.html new file mode 100644 index 0000000..867ef5d --- /dev/null +++ b/static/html/login.html @@ -0,0 +1,37 @@ + + + + + + + + + + Login + + +
+

Connection

+

+
+ +
+ +
+ +
+ +
+ +
+

Tu n'as pas de compte?

+ Créer un compte. +
+ + + \ No newline at end of file diff --git a/static/js/login.js b/static/js/login.js new file mode 100644 index 0000000..b7b4e69 --- /dev/null +++ b/static/js/login.js @@ -0,0 +1,18 @@ +async function login() { + let username = document.getElementById("username").value; + let password = document.getElementById("password").value; + let code = await fetch("/login", + {method: "POST", body: JSON.stringify({"username": username, "password": password})}) + .then(r => { + if (r.status === 400) { + let message = document.getElementById("message"); + message.textContent = "Mauvais mot de passe/nom d'utilisateur!"; + } else { + window.location.href = "/"} + }); +} + +let button = document.getElementById("connect"); +button.addEventListener("click", () => { + let _ = login(); +}) \ No newline at end of file