-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
142 lines (128 loc) · 6.36 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Welcome</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/mailtoharshit/San-Francisco-Font-/sanfrancisco.css" />
<link rel="stylesheet" href="css/custom.css" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
$(".navbar-burger").click(function () {
$(".navbar-burger").toggleClass("is-active");
$(".navbar-menu").toggleClass("is-active");
});
});
</script>
</head>
<body>
<div class="columns">
<div class="column">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="https://bulma.io">
<h1 class="title is-2">Iconn</h1>
</a>
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
data-target="navbarMenu">
<i class="material-icons"
style="margin:0.3rem;font-size:42px;text-align:center;">keyboard_arrow_down</i>
</a>
</div>
<div id="navbarMenu" class="navbar-menu">
<div class="navbar-end">
<a class="navbar-item">Home</a>
<a class="navbar-item">Product</a>
<a class="navbar-item">Pricing</a>
<a class="navbar-item">Templates</a>
<a class="navbar-item">Contact</a>
<a class="navbar-item">FAQ</a>
</div>
</div>
</nav>
</div>
</div>
<section class="hero">
<div class="hero-body">
<div class="container" style="text-align: center">
<h2 class="title light is-inline">
Login
</h2>
<h2 class="title dark is-inline">
Sign up
</h2>
</div>
</div>
</section>
<section class="section">
<div class="container">
<div class="columns is-centered is-mobile">
<div class="column is-half-desktop is-one-third-widescreen is-half-fullhd">
<form class="box" style="background-color: #efefef;">
<div class="columns">
<div class="column">
<center><strong>Sign up with <span class="has-text-fb-blue">Facebook</span> or
<span class="has-text-g-red">Google</span></strong></center>
</div>
</div>
<div class="columns">
<div class="column">
<center>
<h2 class="background-line subtitle is-4"><span>or</span></h2>
</center>
</div>
</div>
<div class="field">
<p class="control has-icons-left">
<input class="input is-large" type="email" placeholder="Email address"
pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$"
title="Must be valid email address">
<span class="icon is-small is-left">
<i class="material-icons">email</i>
</span>
</p>
</div>
<div class="field">
<p class="control has-icons-left">
<input class="input is-large" type="text" placeholder="Full username"
pattern="^[A-Za-z0-9_]{1,15}$" title="Username is limited to 15 characters">
<span class="icon is-small is-left">
<i class="material-icons">person</i>
</span>
</p>
</div>
<div class="field">
<p class="control has-icons-left">
<input class="input is-large" type="text" placeholder="Company name">
<span class="icon is-small is-left">
<i class="material-icons">domain</i>
</span>
</p>
</div>
<div class="field">
<p class="control has-icons-left">
<input class="input is-large" type="password" placeholder="Password"
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters">
<span class="icon is-small is-left">
<i class="material-icons">security</i>
</span>
</p>
</div>
<div class="field">
<p class="control">
<input style="background-color: #ff7376;color:#fff;justify-content: center;"
type="submit" class="button is-large is-fullwidth" value="Sign up" />
</p>
</div>
</form>
</div>
</div>
</div>
</section>
</body>
</html>