-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathregistro-ingreso.html
173 lines (161 loc) · 8.42 KB
/
registro-ingreso.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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
<!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>Ingreso y registro</title>
<link rel="icon" href="navbar/NewLogo.png" type="image/gif">
<link rel="stylesheet" href="css/registro-ingreso.css">
<script src="https://kit.fontawesome.com/6064d08d69.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<header>
<!-- ---------------- Contenedor navegación ------------------ -->
<nav class="navbar">
<a href="index.html" class="logo">SEROTONINA</a>
<div class="nav-links">
<ul>
<li><a href="index.html">INICIO</a></li>
<li><a href="servicios.html">SERVICIOS</a></li>
<li><a href="nosotros.html">NOSOTROS</a></li>
<li><a href="contacto.html">CONTÁCTANOS</a></li>
<li><a href="carrito.html" class="carro">
<img src="navbar/CC.png"></a></li>
</ul>
</div>
<img src="navbar/588a64e0d06f6719692a2d10.png" alt="" class="menu-hamburger">
</nav>
</header>
<div class="main">
<!----- Registro ----->
<section class="signup">
<div class="container">
<div class="signup-content">
<div class="signup-form">
<h2 class="form-title">Registro</h2>
<form method="POST" class="register-form" id="register-form">
<div class="form-group">
<label for="name"><i class="zmdi zmdi-account material-icons-name"></i></label>
<input type="text" name="name" id="name" placeholder="Ingrese su nombre completo"
pattern="[A-Za-z]+" title="Ingrese solo letras" required />
</div>
<div class="form-group">
<label for="name"><i class="zmdi zmdi-account material-icons-name"></i></label>
<input type="tel" name="name" id="num" placeholder="Ingrese su numero celular"
pattern="[0-9]+" title="Ingrese solo números" required minlength="10" />
</div>
<div class="form-group">
<label for="email"><i class="zmdi zmdi-email"></i></label>
<input type="email" name="email" id="email" placeholder="Ingrese su correo electrónico"
required />
</div>
<div class="form-group">
<label for="pass"><i class="zmdi zmdi-lock"></i></label>
<input type="password" name="pass" id="pass" placeholder="Ingrese su contraseña"
pattern="^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$"
title="Ingrese una contraseña mínimo de 8 caracteres con números, mayúsculas, minúsculas y símbolos"
required />
</div>
<div class="form-group">
<label for="re-pass"><i class="zmdi zmdi-lock-outline"></i></label>
<input type="password" name="re_pass" id="re_pass" placeholder="Repita su contraseña"
required />
</div>
<div class="form-group form-button">
<input type="submit" name="signup" id="signup" class="form-submit"
value="Registrarse" />
</div>
</form>
</div>
<div class="signup-image">
<figure><img src="img/reg-ing/1reg.png" alt="sing up image"></figure>
<a href="#signin" class="signup-image-link">Ya tengo una cuenta</a>
</div>
</div>
</div>
</section>
<!----- Ingresar ----->
<section class="sign-in">
<div class="container">
<div class="signin-content">
<div class="signin-image">
<figure><img src="img/reg-ing/2reg.png" alt="sing up image"></figure>
<a href="#" class="signup-image-link">Quiero crear una cuenta</a>
</div>
<div class="signin-form">
<h2 class="form-title">Ingresar</h2>
<form method="POST" class="register-form" id="login-form">
<div class="form-group">
<label for="your_email"><i class="zmdi zmdi-youremail"></i></label>
<input type="email" name="youremail" id="your_email"
placeholder="Ingrese su correo electrónico"
title="Por favor, ingrese su correo electrónico" required />
<span id="youremail-error" class="error-message"></span>
</div>
<div class="form-group">
<label for="your_pass"><i class="zmdi zmdi-lock"></i></label>
<input type="password" name="your_pass" id="your_pass"
placeholder="Ingrese su contraseña" title="Por favor, ingrese su contraseña"
required />
</div>
<div class="agree-terms" id="twoelement">
<label for="remember-me" class="agree-term">Recordar cuenta</label>
<input type="checkbox" name="remember-me" id="remember-me" class="agree-term" />
</div>
<div class="form-group form-button">
<input type="submit" name="signin" id="signin" class="form-submit" value="Ingresar" />
</div>
</form>
</div>
</div>
</div>
</section>
</div>
<!-- Pie de página -->
<footer class="footer">
<div class="footer-left col-md-4 col-sm-6">
<p class="about">
<span>Acerca</span> Nuestra plataforma de psicología ofrece apoyo emocional y mental con profesionales
capacitados. Accede a terapia en línea y experimenta los beneficios durante una prueba gratuita de 30 días,
promoviendo tu bienestar sin compromiso financiero.
</p>
</div>
<div class="footer-center col-md-4 col-sm-6">
<div>
<i class="fa fa-map-marker"></i>
<p>Bogota, Colombia</p>
</div>
<div>
<i class="fa fa-phone"></i>
<p> (+57) 0000 000 000</p>
</div>
<div>
<i class="fa fa-envelope"></i>
<p><a href="#">contacto@serotonina.com</a></p>
</div>
</div>
<div class="footer-right">
<h2 clas="titlefooter">Serotonina</h2>
<p class="menu">
<a href="index.html"> Inicio</a> |
<a href="servicios.html"> Servicios</a> |
<a href="nosotros.html"> Nosotros</a> |
<a href="contacto.html"> Contacto</a>
</p>
</div>
</footer>
<script src="js/registro-ingreso.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
const menuHamburger = document.querySelector(".menu-hamburger")
const navLinks = document.querySelector(".nav-links")
menuHamburger.addEventListener('click', () => {
navLinks.classList.toggle('mobile-menu')
})
</script>
</body>
</html>