ADD formularz rejestracji bez API
This commit is contained in:
parent
01c2b99232
commit
58d1d03972
@ -26,7 +26,7 @@
|
||||
<br>
|
||||
<a href="#">Zapomniałeś hasła?</a>
|
||||
<br>
|
||||
<span> Nie masz konta? <a href="#">Zajerestruj się</a></span>
|
||||
<span> Nie masz konta? <a href="../rejestracja/index.html">Zajerestruj się</a></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
95
frontend/rejestracja/index.html
Normal file
95
frontend/rejestracja/index.html
Normal file
@ -0,0 +1,95 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Padle tournament system</title>
|
||||
<link href="style.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css" />
|
||||
<link rel="stylesheet" href="css/style.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="form">
|
||||
<div class="register">
|
||||
<h2>Rejestracja</h2>
|
||||
|
||||
<input placeholder="Imię">
|
||||
<span class="icon-dice"></span>
|
||||
<input placeholder="Nazwisko">
|
||||
<br>
|
||||
|
||||
<svg class="svg-icon">
|
||||
<path d="M12.075,10.812c1.358-0.853,2.242-2.507,2.242-4.037c0-2.181-1.795-4.618-4.198-4.618S5.921,4.594,5.921,6.775c0,1.53,0.884,3.185,2.242,4.037c-3.222,0.865-5.6,3.807-5.6,7.298c0,0.23,0.189,0.42,0.42,0.42h14.273c0.23,0,0.42-0.189,0.42-0.42C17.676,14.619,15.297,11.677,12.075,10.812 M6.761,6.775c0-2.162,1.773-3.778,3.358-3.778s3.359,1.616,3.359,3.778c0,2.162-1.774,3.778-3.359,3.778S6.761,8.937,6.761,6.775 M3.415,17.69c0.218-3.51,3.142-6.297,6.704-6.297c3.562,0,6.486,2.787,6.705,6.297H3.415z"></path>
|
||||
</svg>
|
||||
|
||||
<input placeholder="Login">
|
||||
<br>
|
||||
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<path d="M17.388,4.751H2.613c-0.213,0-0.389,0.175-0.389,0.389v9.72c0,0.216,0.175,0.389,0.389,0.389h14.775c0.214,0,0.389-0.173,0.389-0.389v-9.72C17.776,4.926,17.602,4.751,17.388,4.751 M16.448,5.53L10,11.984L3.552,5.53H16.448zM3.002,6.081l3.921,3.925l-3.921,3.925V6.081z M3.56,14.471l3.914-3.916l2.253,2.253c0.153,0.153,0.395,0.153,0.548,0l2.253-2.253l3.913,3.916H3.56z M16.999,13.931l-3.921-3.925l3.921-3.925V13.931z"></path>
|
||||
</svg>
|
||||
<input placeholder="Email">
|
||||
<br>
|
||||
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<path d="M13.372,1.781H6.628c-0.696,0-1.265,0.569-1.265,1.265v13.91c0,0.695,0.569,1.265,1.265,1.265h6.744c0.695,0,1.265-0.569,1.265-1.265V3.045C14.637,2.35,14.067,1.781,13.372,1.781 M13.794,16.955c0,0.228-0.194,0.421-0.422,0.421H6.628c-0.228,0-0.421-0.193-0.421-0.421v-0.843h7.587V16.955z M13.794,15.269H6.207V4.731h7.587V15.269z M13.794,3.888H6.207V3.045c0-0.228,0.194-0.421,0.421-0.421h6.744c0.228,0,0.422,0.194,0.422,0.421V3.888z"></path>
|
||||
</svg>
|
||||
<input placeholder="Telefon">
|
||||
<br>
|
||||
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<path d="M17.308,7.564h-1.993c0-2.929-2.385-5.314-5.314-5.314S4.686,4.635,4.686,7.564H2.693c-0.244,0-0.443,0.2-0.443,0.443v9.3c0,0.243,0.199,0.442,0.443,0.442h14.615c0.243,0,0.442-0.199,0.442-0.442v-9.3C17.75,7.764,17.551,7.564,17.308,7.564 M10,3.136c2.442,0,4.43,1.986,4.43,4.428H5.571C5.571,5.122,7.558,3.136,10,3.136 M16.865,16.864H3.136V8.45h13.729V16.864z M10,10.664c-0.854,0-1.55,0.696-1.55,1.551c0,0.699,0.467,1.292,1.107,1.485v0.95c0,0.243,0.2,0.442,0.443,0.442s0.443-0.199,0.443-0.442V13.7c0.64-0.193,1.106-0.786,1.106-1.485C11.55,11.36,10.854,10.664,10,10.664 M10,12.878c-0.366,0-0.664-0.298-0.664-0.663c0-0.366,0.298-0.665,0.664-0.665c0.365,0,0.664,0.299,0.664,0.665C10.664,12.58,10.365,12.878,10,12.878"></path>
|
||||
</svg>
|
||||
<input placeholder="Hasło" type="password" id="password" name="password">
|
||||
<i class="bi bi-eye-slash" id="togglePassword"></i>
|
||||
<br>
|
||||
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<path d="M17.308,7.564h-1.993c0-2.929-2.385-5.314-5.314-5.314S4.686,4.635,4.686,7.564H2.693c-0.244,0-0.443,0.2-0.443,0.443v9.3c0,0.243,0.199,0.442,0.443,0.442h14.615c0.243,0,0.442-0.199,0.442-0.442v-9.3C17.75,7.764,17.551,7.564,17.308,7.564 M10,3.136c2.442,0,4.43,1.986,4.43,4.428H5.571C5.571,5.122,7.558,3.136,10,3.136 M16.865,16.864H3.136V8.45h13.729V16.864z M10,10.664c-0.854,0-1.55,0.696-1.55,1.551c0,0.699,0.467,1.292,1.107,1.485v0.95c0,0.243,0.2,0.442,0.443,0.442s0.443-0.199,0.443-0.442V13.7c0.64-0.193,1.106-0.786,1.106-1.485C11.55,11.36,10.854,10.664,10,10.664 M10,12.878c-0.366,0-0.664-0.298-0.664-0.663c0-0.366,0.298-0.665,0.664-0.665c0.365,0,0.664,0.299,0.664,0.665C10.664,12.58,10.365,12.878,10,12.878"></path>
|
||||
</svg>
|
||||
<input placeholder="Potwierdź hasło">
|
||||
<i class="bi bi-eye-slash" id="togglePassword2"></i>
|
||||
|
||||
|
||||
<center>
|
||||
<form action="#">
|
||||
<input class="myButton" type="submit" value="Zarejestruj" />
|
||||
</form>
|
||||
</center>
|
||||
<br>
|
||||
<a href="#">Zapomniałeś hasła?</a>
|
||||
<br>
|
||||
<span> Masz już konto? <a href="../logowanie/index.html">Zaloguj się</a></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const togglePassword = document.querySelector("#togglePassword");
|
||||
const password = document.querySelector("#password");
|
||||
|
||||
togglePassword.addEventListener("click", function () {
|
||||
// toggle the type attribute
|
||||
const type = password.getAttribute("type") === "password" ? "text" : "password";
|
||||
password.setAttribute("type", type);
|
||||
|
||||
// toggle the icon
|
||||
this.classList.toggle("bi-eye");
|
||||
});
|
||||
|
||||
// prevent form submit
|
||||
const form = document.querySelector("form");
|
||||
form.addEventListener('submit', function (e) {
|
||||
e.preventDefault();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
BIN
frontend/rejestracja/mezczyzna_padel.jpg
Normal file
BIN
frontend/rejestracja/mezczyzna_padel.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
61
frontend/rejestracja/style.css
Normal file
61
frontend/rejestracja/style.css
Normal file
@ -0,0 +1,61 @@
|
||||
html {
|
||||
background-image: url(mezczyzna_padel.jpg);
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 50%;
|
||||
height: 40%;
|
||||
background-color: #EBEBEB;
|
||||
display: flex;
|
||||
;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.myButton {
|
||||
background-color: #14A6F9;
|
||||
border-radius: 28px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
color: #ffffff;
|
||||
font-family: Arial;
|
||||
font-size: 12px;
|
||||
padding: 5px 15px;
|
||||
width: 50%;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
/* -----
|
||||
SVG Icons - svgicons.sparkk.fr
|
||||
----- */
|
||||
|
||||
.svg-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
/*background-color: #EBEBEB;*/
|
||||
}
|
||||
|
||||
.svg-icon path,
|
||||
.svg-icon polygon,
|
||||
.svg-icon rect {
|
||||
fill: #4691f6;
|
||||
}
|
||||
|
||||
.svg-icon circle {
|
||||
stroke: #4691f6;
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
form i {
|
||||
margin-left: -30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user