AI_BTC / templates /sign-up.html
Dooratre's picture
Upload 2 files
365562b verified
raw
history blame
8.02 kB
<!DOCTYPE html>
<html lang="en" class="toggleMenu">
<head>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<link rel="preload" href="/_next/static/media/25e11f223a13018e-s.p.woff2" as="font" crossorigin="" type="font/woff2" />
<link rel="preload" href="/_next/static/media/6905431624c34d00-s.p.woff2" as="font" crossorigin="" type="font/woff2" />
<link rel="stylesheet" href="/_next/static/css/e4887d32fecac951.css" crossorigin="" data-precedence="next" />
<link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-a5591398fe5534e2.js" crossorigin="" />
<script src="/_next/static/chunks/fd9d1056-d7dd7ab1b204318c.js" async="" crossorigin=""></script>
<script src="/_next/static/chunks/472-323e97dcd87f02be.js" async="" crossorigin=""></script>
<script src="/_next/static/chunks/main-app-892c3dff08e9cd4c.js" async="" crossorigin=""></script>
<script src="/_next/static/chunks/326-1870c15fd85c544e.js?dpl=dpl_J1tbkvrtzchrmWyLBiAfJW1Wv2FE" async=""></script>
<script src="/_next/static/chunks/app/(user)/sign-up/page-30aefdb3500631cb.js?dpl=dpl_J1tbkvrtzchrmWyLBiAfJW1Wv2FE" async=""></script>
<title>Techwave NextJs | Sign Out</title>
<meta property="og:title" content="Sign Out" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="Sign Out" />
<link rel="icon" href="/favicon.ico" type="image/x-icon" sizes="16x16" />
<meta name="next-size-adjust" />
<script src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js" crossorigin="" noModule=""></script>
</head>
<style>
.input-div {
position: relative;
width: 100px;
height: 100px;
border-radius: 50%;
border: 2px solid #7c5fe3;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
box-shadow: 0px 0px 100px #7c5fe3 , inset 0px 0px 10px #7c5fe3,0px 0px 5px rgb(255, 255, 255);
animation: flicker 2s linear infinite;
}
.icon {
color: #7c5fe3;
font-size: 2rem;
cursor: pointer;
animation: iconflicker 2s linear infinite;
}
.input2 {
position: absolute;
opacity: 0;
width: 100%;
height: 100%;
cursor: pointer !important;
}
@keyframes flicker {
0% {
border: 2px solid #7c5fe3;
box-shadow: 0px 0px 100px #7c5fe3 , inset 0px 0px 10px #7c5fe3,0px 0px 5px rgb(255, 255, 255);
}
5% {
border: none;
box-shadow: none;
}
10% {
border: 2px solid #7c5fe3;
box-shadow: 0px 0px 100px #7c5fe3 , inset 0px 0px 10px #7c5fe3,0px 0px 5px rgb(255, 255, 255);
}
25% {
border: none;
box-shadow: none;
}
30% {
border: 2px solid #7c5fe3;
box-shadow: 0px 0px 100px #7c5fe3 , inset 0px 0px 10px #7c5fe3,0px 0px 5px rgb(255, 255, 255);
}
100% {
border: 2px solid #7c5fe3;
box-shadow: 0px 0px 100px #7c5fe3 , inset 0px 0px 10px #7c5fe3,0px 0px 5px rgb(255, 255, 255);
}
}
@keyframes iconflicker {
0% {
opacity: 1;
}
5% {
opacity: 0.2;
}
10% {
opacity: 1;
}
25% {
opacity: 0.2;
}
30% {
opacity: 1;
}
100% {
opacity: 1;
}
}
</style>
<style>
.success-message {
color: green;
border: 2px solid green;
padding: 10px;
margin-bottom: 10px;
}
.error-message {
color: red;
border: 2px solid red;
padding: 10px;
margin-bottom: 10px;
}
</style>
<body>
<!--$-->
<div class="techwave_fn_sign">
<div class="sign__content">
<h1 class="logo">Designed by Frenify</h1>
<form class="signup" method="POST" action="/sign-up" onsubmit="return validateForm()" enctype="multipart/form-data">
<div class="form__content">
{% with messages = get_flashed_messages() %}
{% if messages %}
<ul>
{% for message in messages %}
<li>{{ message }}</li>
{% endfor %}
</ul>
{% endif %}
{% endwith %}
<div class="form__title">Sign Up</div>
<br>
{% with messages = get_flashed_messages() %}
{% if messages %}
<ul>
{% for message in messages %}
<li>{{ message }}</li>
{% endfor %}
</ul>
{% endif %}
{% endwith %}
<div class="form__username">
<label for="username">First Name</label>
<input type="text" class="input" id="first_name" name="first_name" placeholder="Username" required />
</div>
<div class="form__username">
<label for="username">Last Nmae</label>
<input type="text" class="input" id="last_name" name="last_name" placeholder="Username" required />
</div>
<div class="form__username">
<label for="username">Username</label>
<input type="text" class="input" id="username" name="username" placeholder="Username" required />
</div>
<div class="form__pass">
<label for="user_password">Password</label>
<input type="password" id="password" name="password" autoComplete="current-password" spellCheck="false" placeholder="Strong password" required />
</div>
<div class="form__confirm-pass">
<label for="confirm_password">Confirm Password</label>
<input type="password" id="confirm_password" name="confirm_password" autoComplete="current-password" spellCheck="false" placeholder="Confirm password" required />
</div>
<br>
<div class="input-div">
<input class="input2" type="file" id="profile_image" name="profile_image" required>
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" stroke-linejoin="round" stroke-linecap="round" viewBox="0 0 24 24" stroke-width="2" fill="none" stroke="currentColor" class="icon"><polyline points="16 16 12 12 8 16"></polyline><line y2="21" x2="12" y1="12" x1="12"></line><path d="M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3"></path><polyline points="16 16 12 12 8 16"></polyline></svg>
</div>
<br>
<P>Upload Your For Profile</P>
<br>
<div class="form__submit">
<label class="fn__submit">
<input type="submit" name="submit" value="Create Account" onclick="return validateForm()" />
</label>
</div>
<div class="form__alternative ">
<div class="fn__lined_text">
</div>
</div>
<script>
function validateForm() {
var password = document.getElementById("password").value;
var confirm_password = document.getElementById("confirm_password").value;
if (password !== confirm_password) {
var errorMessage = document.createElement("p");
errorMessage.className = "error-message";
errorMessage.innerHTML = "Passwords do not match";
var confirmPassField = document.getElementById("confirm_password");
confirmPassField.insertAdjacentElement("afterend", document.createElement("br"));
confirmPassField.insertAdjacentElement("afterend", errorMessage);
return false;
}
return true;
} </script>
<div class="sign__desc">
<p>Already have an account? <a href="/">Sign In</a></p>
</div>
</div>
</div>
<!--/$-->
<script src="/_next/static/chunks/webpack-a5591398fe5534e2.js" crossorigin="" async=""></script>
</body>
</html>