-
Notifications
You must be signed in to change notification settings - Fork 0
/
signup.html
113 lines (103 loc) · 3.8 KB
/
signup.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
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="./styles/styles_login.css">
<link rel="stylesheet" href="bundle.css">
</head>
<body>
<div class="mainElements">
<svg width="400px" height="400px" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 100 100">
<defs>
<style>
.cls-1 {
fill: #fff;
stroke-width: 2.6px;
}
.cls-1,
.cls-2,
.cls-3,
.cls-4,
.cls-5,
.cls-6,
.cls-7 {
stroke: #231f20;
stroke-miterlimit: 10;
}
.cls-2,
.cls-3,
.cls-4,
.cls-5,
.cls-6,
.cls-7 {
fill: none;
}
.cls-2 {
stroke-width: 0.89px;
}
.cls-3 {
stroke-width: 0.86px;
}
.cls-4 {
stroke-width: 0.84px;
}
.cls-5 {
stroke-width: 0.81px;
}
.cls-6 {
stroke-width: 0.79px;
}
.cls-7 {
stroke-width: 0.77px;
}
</style>
</defs>
<rect class="cls-1" x="22.07" y="18.53" width="59.8" height="59.8" />
<path class="cls-2" d="M23.66,52.48c11.48,78.33,19.77-7.29,19.77-7.29S58-78.68,65.81,98.93" />
<path class="cls-3" d="M20.51,52.15c13.19,64.2,22.72-6,22.72-6S60-55.36,69,90.22" />
<path class="cls-4" d="M16.88,51.88C32.05,104.51,43,47,43,47S62.25-36.24,72.57,83.09" />
<path class="cls-5" d="M12.72,51.66c17.43,43.13,30-4,30-4s22.11-68.22,34,29.59" />
<path class="cls-6" d="M7.93,51.48c20,35.35,34.52-3.29,34.52-3.29S67.87-7.73,81.51,72.44" />
<path class="cls-7" d="M2.43,51.33c23,29,39.67-2.7,39.67-2.7S71.32,2.8,87,68.52" />
</svg>
<br>
<label class="Username mdc-text-field mdc-text-field--filled">
<span class="mdc-text-field__ripple"></span>
<span class="mdc-floating-label" >Username</span>
<input class="mdc-text-field__input" type="text" aria-labelledby="Username" id="username_field">
<span class="mdc-line-ripple"></span>
</label>
<br>
<label class="mdc-text-field mdc-text-field--filled ">
<span class="mdc-text-field__ripple"></span>
<span class="mdc-floating-label" id="Password">Password</span>
<input class="mdc-text-field__input" type="password" aria-labelledby="Password" id="password_field">
<span class="mdc-line-ripple"></span>
<i id="password_visibility" class="material-icons mdc-text-field__icon mdc-text-field__icon--trailing "
tabindex="0" role="button">visibility</i>
</label>
<br>
<button id="signup" class="signup mdc-button mdc-button--raised"> <span class="mdc-button__ripple"></span> SignUp</button>
<br><br>
</div>
<div class="splash">
Sign up now. Have an epiphany.
</div>
<aside id="username_taken" class="mdc-snackbar">
<div class="mdc-snackbar__surface" role="status" aria-relevant="additions">
<div class="mdc-snackbar__label" aria-atomic="false">
Username is already taken !
</div>
<div class="mdc-snackbar__actions" aria-atomic="true">
<button type="button" class="mdc-button mdc-snackbar__action">
<div class="mdc-button__ripple"></div>
<span class="mdc-button__label">Need Help?</span>
</button>
</div>
</div>
</aside>
<!-- <script src="./dist/signup.js" async></script> -->
<!-- <script src="./signup.js" async></script> -->
</body>
</html>