-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
133 lines (125 loc) · 3.75 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Browser icon left side by title -->
<link
rel="icon"
href="./images/tabsLogoSmall.png"
sizes="16x16"
type="image/png"
/>
<!-- Title, same as index.html -->
<title>Tabs</title>
<!-- Importerted fonts -->
<link
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@1,900&family=Raleway:wght@500&display=swap"
rel="stylesheet"
/>
<!-- CSS links -->
<link rel="stylesheet" type="text/css" href="css/login.css" />
<!-- JavaScript links defer (loads script in "background")-->
<script defer src="https://kit.fontawesome.com/a81368914c.js"></script>
<script defer src="./javascript/login.js"></script>
</head>
<body>
<!-- Main container -->
<div class="logContainer">
<!-- Log/Register in container -->
<div class="formBox" id="formBox">
<!-- logo image -->
<div class="avatar"></div>
<!-- log in/ register button on top -->
<div class="btnBox">
<div id="btnUser"></div>
<button type="button" class="toggleBtn" onclick="login()">
Login
</button>
<button type="button" class="toggleBtn" onclick="register()">
Register
</button>
</div>
<!-- Log in side -->
<form
id="login"
class="inputGroup"
onsubmit="loginFormSubmit(event)"
id="loginForm"
>
<div class="inputDiv user">
<div class="i">
<i class="fas fa-user"></i>
</div>
<div>
<h5>Username</h5>
<input class="input" type="text" required id="usernameLogin" />
</div>
</div>
<div class="inputDiv pass">
<div class="i">
<i class="fas fa-lock"></i>
</div>
<div>
<h5>Password</h5>
<input
class="input"
type="password"
required
id="passwordLogin"
/>
</div>
</div>
<a id="forgotPass" class="smallText" href="#">Forgot Password?</a>
<input type="submit" class="btnUser" value="Login" />
</form>
<!-- Register side -->
<form
id="register"
class="inputGroup"
onsubmit="createFormSubmit(event)"
>
<div class="inputDiv user">
<div class="i">
<i class="fas fa-user"></i>
</div>
<div>
<h5>Username</h5>
<input class="input" type="text" required id="usernameCreate" />
</div>
</div>
<div class="inputDiv pass">
<div class="i">
<i class="fas fa-lock"></i>
</div>
<div>
<h5>Password</h5>
<input
class="input"
type="password"
required
id="passwordCreate"
/>
</div>
</div>
<div class="inputDiv pass">
<div class="i">
<i class="fas fa-lock"></i>
</div>
<div>
<h5 id="confirmH5">Confirm Password</h5>
<input
class="input"
type="password"
required
id="passwordCreate2"
/>
</div>
</div>
<a class="smallText" href="#">I agree to the terms & conditions</a>
<input type="submit" class="btnUser" value="Register" />
</form>
</div>
</div>
</body>
</html>