-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathformulario.html
74 lines (73 loc) · 4.2 KB
/
formulario.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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="./css/formulario.css" >
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Brugge cerveza artesanal</title>
</head>
<body>
<header>
<div id="marca"> <img src="./img/logo_horizontal.png" alt="logo de Brugge cerveza artesanal"> </div>
</header>
<section>
<div id="titulo">
<h1>Completá los datos para obtener tu descuento</h1>
<p> Gracias por tomarte el tiempo en completarlo</p>
</div>
<!-------Formulario---------->
<form id="formulario" method="POST" action="https://formspree.io/f/mvovngeo">
<div class="formulario_grupo">
<label id="nombre-label" form="nombre"> <p>Nombre y Apellido: </p> </label>
<input type="text" name="nombre" id="nombre" class="form-control" placeholder="Completá con tu nombre y apellido" maxlength="60">
</div>
<div class="formulario_grupo">
<label id="correo-label" form="correo"> <p> Correo electrónico:</p> </label>
<input type="email" name="email" id="email" class="form-control" placeholder="Completá con tu correo electrónico" maxlength="60">
</div>
<div class="formulario_grupo">
<label> <p> Teléfono:</p> </label>
<input type="tel" name="telefono" id="telefono" class="form-control" placeholder="Completá con tu teléfono, incluí el código de área"/>
</div>
<menu class="formulario_grupo">
<p> Querés recibir nuestras promociones? </p>
<label> <input name="Si-No" value="Si" type="radio" class="input-radio"/> Si </label>
<label> <input name="Si-No" value="Si" type="radio" class="input-radio"/> No </label>
</menu>
<menu class="formulario_grupo">
<p> Qué estilo preferís? <br/> (Podés elegir más de uno) </p>
<label> <input name="prefer" value="session ipa" type="checkbox" class="input-checkbox"/> SESSION IPA </label>
<label> <input name="prefer" value="honey" type="checkbox" class="input-checkbox"/> HONEY </label>
<label> <input name="prefer" value="rish red" type="checkbox" class="input-checkbox"/> RISH RED </label>
<label> <input name="prefer" value="new england ipa" type="checkbox" class="input-checkbox"/> NEW ENGLAND IPA <label>
<label> <input name="prefer" value="golden wheat" type="checkbox" class="input-checkbox"/> GOLDEN WHEAT </label>
<label> <input name="prefer" value="oatmeal stout" type="checkbox" class="input-checkbox"/> OATMEAL STOUT </label>
<label> <input name="prefer" value="summer ipa" type="checkbox" class="input-checkbox"/> SUMMER IPA </label>
<label> <input name="prefer" value="old ale" type="checkbox" class="input-checkbox"/> OLD ALE </label>
</menu>
<div id="comentario"> </div>
<div class="formulario-group">
<p> Algún comentario o sugerencia?</p>
<textarea id="comments" class="input-textarea" name="comentario" placeholder="Ingresa tu comentario... (recordá que tenés un máximo de 300 caracteres)" maxlength="300"></textarea>
</div>
<div id="descuento">
<input type="submit" id="submit" class="submit-button">
</div>
</form>
<!---Mensaje------->
<article id="mensaje">
<p> Estarás recibiendo tu cupón de descuento por Whastapp </p>
</article>
</section>
<!------FOOTER-------->
<footer>
<div class="footer-inner" id="derechos-izquierda">
<p> Beber con moderación. Prohibida su venta a menores de 18 años </p>
</div>
<div class="footer-inner" id="derechos-derecha">
<p> © 2021 Brugge. Todos los derechos reservados.</p>
</div>
</footer>
<script type="text/javascript" src="./js/validar_formulario.js"></script>
</body>
</html>