-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
143 lines (139 loc) · 4.11 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!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">
<link rel = "stylesheet" href = "login_style.css">
<title>Home Page</title>
<!-- add icon link -->
<link rel = "icon" href = "Quizzo_logo.png" type = "image/x-icon">
</head>
<body>
<div id ="myDiv">
<div id="logo">
<img src="Quizzo_main_logo.png" width="180px"/>
</div>
<div class="copyright">
Copyright © Quizzo By <a class="portfolio-link" href="https://itz-kaushal.netlify.app/"> Kaushal </a>
</div>
<div class="dots-3"></div>
</div>
<div id="container" class="container">
<!-- FORM SECTION -->
<div class="row">
<!-- SIGN UP -->
<div class="col align-items-center flex-col sign-up">
<div class="form-wrapper align-items-center">
<div class="form sign-up">
<div class="input-group">
<i class='bx bxs-user'></i>
<input id = "email-signup" type = "email" placeholder = "Email *">
</div>
<div class="input-group">
<i class='bx bx-mail-send'></i>
<input id = "username-signup" type = "name" placeholder = "Username *"></input>
</div>
<div class="input-group">
<i class='bx bxs-lock-alt'></i>
<input id = "password-signup" type = "password" placeholder = "Password *"></input>
</div>
<div class="input-group">
<i class='bx bxs-lock-alt'></i>
<input id = "confirm-password-signup" type = "password" placeholder = "Confirm Password *"></input>
</div>
<button id = "create-acct-btn">Create Account</button>
<p>
<span>
Already have an account?
</span>
<b onclick="toggle()" class="pointer">
Sign in here
</b>
</p>
</div>
</div>
</div>
<!-- END SIGN UP -->
<!-- SIGN IN -->
<div class="col align-items-center flex-col sign-in">
<div class="form-wrapper align-items-center">
<div class="form sign-in">
<div class="input-group">
<i class='bx bxs-user'></i>
<input id = "email" type = "text" placeholder = "Email *"></input>
</div>
<div class="input-group">
<i class='bx bxs-lock-alt'></i>
<input id = "password" type = "password" placeholder = "Password *"></input>
</div>
<button id = "submit">Submit</button>
<p>
<b class="forget-btn pointer">
Forgot password?
</b>
</p>
<p>
<span>
Don't have an account?
</span>
<b onclick="toggle()" class="pointer">
Sign up here
</b>
</p>
</div>
</div>
<div class="form-wrapper">
</div>
</div>
<!-- END SIGN IN -->
</div>
<!-- END FORM SECTION -->
<!-- CONTENT SECTION -->
<div class="row content-row">
<!-- SIGN IN CONTENT -->
<div class="col align-items-center flex-col">
<div class="text sign-in">
<h2>
Happy to see you
</h2>
</div>
<div class="img sign-in">
</div>
</div>
<!-- END SIGN IN CONTENT -->
<!-- SIGN UP CONTENT -->
<div class="col align-items-center flex-col">
<div class="img sign-up">
</div>
<div class="text sign-up">
<h2>
Team Quizzo Welcomes you
</h2>
</div>
</div>
<!-- END SIGN UP CONTENT -->
</div>
<!-- END CONTENT SECTION -->
</div>
<script>
document.querySelector(".container").classList.add("hidden");
setTimeout(function(){
document.getElementById("myDiv").style.display = "none";
document.querySelector(".container").classList.remove("hidden");
},5000);
let container = document.getElementById('container')
toggle = () => {
container.classList.toggle('sign-in')
container.classList.toggle('sign-up')
}
setTimeout(() => {
container.classList.add('sign-in')
}, 5200)
</script>
</body>
<script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-database.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-auth.js"></script>
<script src="login_script.js"> </script>
</html>