-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathcontact.html
More file actions
142 lines (116 loc) · 6.67 KB
/
contact.html
File metadata and controls
142 lines (116 loc) · 6.67 KB
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="es">
<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">
<title>Web Code Academy</title>
<!-- Librerías -->
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<!-- Hojas de estilo -->
<link rel="shortcut icon" type="image/x-icon" href="images/icon.ico">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/contact.css">
<meta name="theme-color" content="#333">
<meta name="title" content="Web Code Academy">
<meta name="description" content="¡Bienvenido a Web Code Academy!">
<meta property="og:type" content="website">
<meta property="og:url" content="www.web-code-academy.com">
<meta property="og:title" content="Web Code Academy">
<meta property="og:description" content="¡Bienvenido a Web Code Academy!">
<meta property="og:image" content="https://raw.githubusercontent.com/AngelIsaiSzr/Resources/main/images/Web%20Code%20Academy.png">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://www.angel_szr1.com/">
<meta property="twitter:title" content="Web Code Academy">
<meta property="twitter:description" content="¡Bienvenido a Web Code Academy!">
<meta property="twitter:image" content="https://raw.githubusercontent.com/AngelIsaiSzr/Resources/main/images/Web%20Code%20Academy.png">
</head>
<body>
<div class="container--loader">
<div class="loader"></div>
</div>
<header class="hero">
<nav class="nav container">
<div class="nav__logo">
<h2 class="nav__title">Web Code Academy</h2>
</div>
<ul class="nav__link nav__link--menu nav__link--hover">
<li class="nav__items">
<a href="index.html" class="nav__links"><span>Inicio</span></a>
</li>
<li class="nav__items">
<a href="courses.html" class="nav__links"><span>Cursos</span></a>
</li>
<li class="nav__items">
<a href="editor.html" class="nav__links"><span>Editor</span></a>
</li>
<li class="nav__items">
<a href="about.html" class="nav__links"><span>Acerca de</span></a>
</li>
<li class="nav__items">
<a href="contact.html" class="nav__links"><span>Contacto</span></a>
</li>
<img src="images/close.svg" class="nav__close">
</ul>
<div class="nav__menu">
<img src="images/menu.svg" class="nav__img">
</div>
</nav>
<section class="hero__container container" data-aos="zoom-in" data-aos-delay="200">
<h1 class="hero__title">Contáctanos para más información</h1>
<p class="hero__paragraph">¿Quieres saber más sobre nuestros cursos de programación? ¡Escríbenos y te
responderemos lo antes posible! Estamos ansiosos por ayudarte a alcanzar tus objetivos de aprendizaje.
</p>
</section>
</header>
<main>
<section class="container contact">
<div class="contact__container">
<h2 class="contact__name" data-aos="fade-up" data-aos-duration="900" data-aos-easing="ease-in-out">Envíanos un mensaje</h2>
<p class="contact__paragraph" data-aos="fade-up" data-aos-duration="900" data-aos-easing="ease-in-out">Si tienes alguna pregunta, sugerencia o simplemente
quieres saludarnos, por favor completa el formulario a continuación y te responderemos lo antes
posible. ¡Estamos ansiosos por escucharte!</p>
<form class="contact__form animate-on-scroll" id="contact__form" action="https://formspree.io/f/xzbnlbww" method="POST">
<label data-aos="zoom-in-up" data-aos-anchor-placement="center-bottom" data-aos-duration="900" for="name">Nombre</label>
<input data-aos="zoom-in-up" data-aos-anchor-placement="center-bottom" data-aos-duration="900" type="text" id="name" name="name" required>
<ul id="message-error-name">
<li id="error-name"></li>
</ul>
<label data-aos="zoom-in-up" data-aos-anchor-placement="center-bottom" data-aos-duration="900" for="email">Correo electrónico</label>
<input data-aos="zoom-in-up" data-aos-anchor-placement="center-bottom" data-aos-duration="900" type="email" id="email" name="email" required>
<ul id="message-error-email">
<li id="error-email"></li>
</ul>
<label data-aos="zoom-in-up" data-aos-anchor-placement="center-bottom" data-aos-duration="900" for="message">Mensaje</label>
<textarea data-aos="zoom-in-up" data-aos-anchor-placement="center-bottom" data-aos-duration="900" id="message" name="message" required></textarea>
<ul id="message-error-text">
<li id="error-text"></li>
</ul>
<div data-aos="zoom-in" data-aos-anchor-placement="center-bottom" data-aos-duration="900">
<button type="submit" onclick="enviar(event)">Enviar</button>
</div>
</form>
</div>
</section>
</main>
<footer class="footer">
<section class="footer__copy container">
<div class="footer__social">
<a href="https://www.facebook.com/webcodeacademy0/" class="footer__icons" target="_blank"><img src="images/facebook.svg" class="footer__img"></a>
<a href="https://www.instagram.com/webcodeacademy0/" class="footer__icons" target="_blank"><img src="images/instagram.svg" class="footer__img"></a>
<a href="https://www.youtube.com/@webcodeacademy0" class="footer__icons" target="_blank"><img src="images/youtube.svg" class="footer__img"></a>
</div>
<h3 class="footer__copyright">Derechos reservados © Web Code Academy</h3>
</section>
</footer>
<!-- Archivo Js -->
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<!-- Librería de animaciones -->
<script>
AOS.init();
</script>
<!-- Mi script -->
<script src="js/scripts.js"></script>
<script src="js/contact.js"></script>
</body>
</html>