-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
136 lines (121 loc) · 4.84 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
<!DOCTYPE html>
<html lang="en">
<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>CuquiPasteles</title>
<link rel="stylesheet" href="styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans&display=swap" rel="stylesheet">
</head>
<body>
<header>
<img src="img/CuquiPastelesLogo.png" alt="Logo de CuquiPasteles" class="logo">
<nav>
<a href="#">Nuestros pasteles</a>
<a href="#">Haz tu pedido</a>
<a href="#">Mi cuenta</a>
</nav>
</header>
<div class="banner">
<img src="img/fondo.jpg" alt="Pastel de Chocolate" class="fondo-banner">
<h2>Pasteles<br>con toda<br>la galleta</h2>
</div>
<p>Conoce nuestros pasteles</p>
<h3>Sabores</h3>
<dl class="lista-productos">
<div>
<img src="img/cookiesncream.jpg" alt="Pastel sabor Oreo">
<dt>Cookies 'n Cream</dt>
<dd>El favorito de nuestros clientes</dd>
</div>
<div>
<img src="img/juanas.jpg" alt="Pastel sabor Marías">
<dt>Juanas</dt>
<dd>Galletas sencillas con un toque de cajeta</dd>
</div>
<div>
<img src="img/imperio.jpeg" alt="Pastel sabor Emperador">
<dt>Imperio de limón</dt>
<dd>Tipo pay</dd>
</div>
<div>
<img src="img/arcolores.jpg" alt="Pastel sabor Arcoiris">
<dt>Arco de colores</dt>
<dd>Con un toque de malvavisco y coco</dd>
</div>
</dl>
<h3>Decoraciones</h3>
<ul class="lista-productos">
<div>
<img src="img/flores.jpg" alt="Pastel con decorado de flores">
<li>Flores</li>
</div>
<div>
<img src="img/acuarela.png" alt="Pastel con decorado de acuarela">
<li>Efecto Acuarela</li>
</div>
<div>
<img src="img/fondant.jpg" alt="Pastel con decorado de fondant">
<li>Personajes de Fondant</li>
</div>
<div>
<img src="img/texto.jpeg" alt="Pastel con texto">
<li>Texto</li>
</div>
</ul>
<h3>Precios</h3>
<ul>
<li>Un sabor........................................$200</li>
<li>Dos sabores...................................$300</li>
</ul>
<h3>Costo Extra por Decoración</h3>
<ul>
<li>Una decoración...........................+$70</li>
<li>Dos decoraciones........................+$105</li>
<li>Tres decoraciones.......................+$122</li>
</ul>
<hr>
<p>Haz tu pedido</p>
<h3>Sabores</h3>
<p>Puedes seleccionar hasta dos</p>
<input type="checkbox" id="sabor1" name="sabor1" value="Oreo">
<label for="sabor1">Cookies 'n Cream</label><br>
<input type="checkbox" id="sabor2" name="sabor2" value="Marias">
<label for="sabor2">Juanas</label><br>
<input type="checkbox" id="sabor3" name="sabor3" value="Emperador de limón">
<label for="sabor3">Imperio de limón</label><br>
<input type="checkbox" id="sabor4" name="sabor4" value="Arcoiris">
<label for="sabor4">Arco de colores</label><br><br>
<h3>Decoraciones</h3>
<p>Puedes seleccionar hasta tres</p>
<input type="checkbox" id="decoracion1" name="decoracion1" value="Flores">
<label for="decoracion1">Flores</label><br>
<input type="checkbox" id="decoracion2" name="decoracion2" value="Acuarela"">
<label for="decoracion2">Efecto Acuarela</label><br>
<input type="checkbox" id="decoracion3" name="decoracion3" value="Personaje">
<label for="decoracion3">Personaje</label><br>
<input type="checkbox" id="decoracion4" name="decoracion4" value="Texto">
<label for="decoracion4">Texto</label><br><br>
<h3>Descripción general del pastel</h3>
<label for="Input1">Colores, personaje, texto...</label><br>
<input type="text" id="Input1" name="Input1">
<br><br>
<h3>Datos de contacto</h3>
<label for="Input2">Nombre</label><br>
<input type="text" id="Input2" name="Input2">
<br><br>
<label for="correo1">Correo</label><br>
<input type="email" id="correo1" name="correo1"><br><br>
<label for="numero1">Número de teléfono</label><br>
<input type="number" id="numero1" name="numero1"><br><br>
<footer>
<p>Calle de las Dalias 333, Las Flores CP 98364</p>
<p>Tel. 555 253 74 85</p>
<p>Horario de atención: lun. - vie. 9:00 am - 4:00 pm, sáb. 8:00 am - 2:00 pm</p>
<a href="https://www.flaticon.com/free-icons/smart-cart" title="smart cart icons">Smart cart icons created by Freepik - Flaticon</a>
</footer>
</body>
</html>