-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathrecetas.html
161 lines (147 loc) · 9.65 KB
/
recetas.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
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Mis recetas | Todas las recetas</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Mis recetas de cocina casera">
<meta name="keywords" content="recetas, cocina casera, gastronomía">
<link rel="shortcut icon" href="huevo-frito.png" type="image/x-icon">
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<div class="container mx-auto px-10">
<header class="flex justify-center my-5">
<img class="h-16 sm:h-28" src="images/logo.png" alt="">
</header>
</div>
<div class="bg-gray-300 py-2 sm:py-4 mb-10">
<nav class="container mx-auto px-10 text-center text-lg">
<a class="hover:underline" href="index.html">Inicio</a>
<span class="text-gray-500 mx-2 text-base">|</span>
<span class="text-gray-400">Recetas</span>
<span class="text-gray-500 mx-2 text-base">|</span>
<a class="hover:underline" href="contactar.html">Contactar</a>
</nav>
</div>
<main class="container mx-auto px-10">
<article class="mb-12 border-b pb-10 border-gray-300">
<h2 class="text-2xl uppercase mb-3 hover:underline">
<a href="receta.html">Vichyssoise de esparragos blancos</a>
</h2>
<div class="grid grid-cols-12 gap-6">
<a class="col-span-full sm:col-span-5 md:col-span-4" href="receta.html">
<img class="hover:opacity-80" src="images/vichyssoise-de-esparragos-blancos.jpg" alt="Vichyssoise de esparragos blancos">
</a>
<div class="col-span-full sm:col-span-7 mb:col-span-8"> <!-- el resto! -->
<div class="mb-2">Eduardo <span class="text-gray-300">|</span> <span class="text-gray-500">15/12/2021</span></div>
<p class="text-lg mb-6">Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem aliquam dolorem natus incidunt ex placeat
deserunt accusantium sapiente veniam sit dicta porro repellat praesentium, earum rerum? Dolorum officia
optio voluptas.</p>
<a class="text-white px-3 py-2 hover:bg-green-900 rounded-md uppercase text-sm bg-green-700" href="receta.html">Ver receta</a>
</div>
</div>
</article>
<article class="mb-12 border-b pb-10 border-gray-300">
<h2 class="text-2xl uppercase mb-3 hover:underline">
<a href="receta.html">Espaguetis de calabacín</a>
</h2>
<div class="grid grid-cols-12 gap-6">
<a class="col-span-full sm:col-span-5 md:col-span-4" href="receta.html">
<img class="hover:opacity-80"src="images/espaguetis-de-calabacin.jpg" alt="Vichyssoise de esparragos blancos">
</a>
<div class="col-span-full sm:col-span-7 mb:col-span-8"> <!-- el resto! -->
<div class="mb-2">Eduardo <span class="text-gray-300">|</span> <span class="text-gray-500">15/12/2021</span></div>
<p class="text-lg mb-6">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita obcaecati ratione amet adipisci. Adipisci voluptate distinctio rerum qui commodi numquam sequi eius facilis consequuntur quis architecto atque, possimus explicabo mollitia. Odio odit voluptatem nisi magni vel similique quaerat expedita reprehenderit!</p>
<a class="text-white px-3 py-2 hover:bg-green-900 rounded-md uppercase text-sm bg-green-700" href="receta.html">Ver receta</a>
</div>
</div>
</article>
<article class="mb-12 border-b pb-10 border-gray-300">
<h2 class="text-2xl uppercase mb-3 hover:underline">
<a href="receta.html">Lubina con hummus de guisantes</a>
</h2>
<div class="grid grid-cols-12 gap-6">
<a class="col-span-full sm:col-span-5 md:col-span-4" href="receta.html">
<img class="hover:opacity-80"src="images/lubina-con-hummus-de-guisantes.jpg" alt="Lubina con hummus de guisantes">
</a>
<div class="col-span-full sm:col-span-7 mb:col-span-8"> <!-- el resto! -->
<div class="mb-2">Eduardo <span class="text-gray-300">|</span> <span class="text-gray-500">15/12/2021</span></div>
<p class="text-lg mb-6">Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem aliquam dolorem natus incidunt ex placeat
deserunt accusantium sapiente veniam sit dicta porro repellat praesentium, earum rerum? Dolorum officia
optio voluptas.</p>
<a class="text-white px-3 py-2 hover:bg-green-900 rounded-md uppercase text-sm bg-green-700" href="receta.html">Ver receta</a>
</div>
</div>
</article>
<article class="mb-12 border-b pb-10 border-gray-300">
<h2 class="text-2xl uppercase mb-3 hover:underline">
<a href="receta.html">Vichyssoise de esparragos blancos</a>
</h2>
<div class="grid grid-cols-12 gap-6">
<a class="col-span-full sm:col-span-5 md:col-span-4" href="receta.html">
<img class="hover:opacity-80"src="images/vichyssoise-de-esparragos-blancos.jpg" alt="Vichyssoise de esparragos blancos">
</a>
<div class="col-span-full sm:col-span-7 mb:col-span-8"> <!-- el resto! -->
<div class="mb-2">Eduardo <span class="text-gray-300">|</span> <span class="text-gray-500">15/12/2021</span></div>
<p class="text-lg mb-6">Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem aliquam dolorem natus incidunt ex placeat
deserunt accusantium sapiente veniam sit dicta porro repellat praesentium, earum rerum? Dolorum officia
optio voluptas.</p>
<a class="text-white px-3 py-2 hover:bg-green-900 rounded-md uppercase text-sm bg-green-700" href="receta.html">Ver receta</a>
</div>
</div>
</article>
<article class="mb-12 border-b pb-10 border-gray-300">
<h2 class="text-2xl uppercase mb-3 hover:underline">
<a href="receta.html">Tiramisú Express</a>
</h2>
<div class="grid grid-cols-12 gap-6">
<a class="col-span-full sm:col-span-5 md:col-span-4" href="receta.html">
<img class="hover:opacity-80"src="images/tiramisu-express.jpg" alt="Vichyssoise de esparragos blancos">
</a>
<div class="col-span-full sm:col-span-7 mb:col-span-8"> <!-- el resto! -->
<div class="mb-2">Eduardo <span class="text-gray-300">|</span> <span class="text-gray-500">15/12/2021</span></div>
<p class="text-lg mb-6">Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem aliquam dolorem natus incidunt ex placeat
deserunt accusantium sapiente veniam sit dicta porro repellat praesentium, earum rerum? Dolorum officia
optio voluptas.</p>
<a class="text-white px-3 py-2 hover:bg-green-900 rounded-md uppercase text-sm bg-green-700" href="receta.html">Ver receta</a>
</div>
</div>
</article>
<article class="mb-12 border-b pb-10 border-gray-300">
<h2 class="text-2xl uppercase mb-3 hover:underline">
<a href="receta.html">Tiramisú Express</a>
</h2>
<div class="grid grid-cols-12 gap-6">
<a class="col-span-full sm:col-span-5 md:col-span-4" href="receta.html">
<img class="hover:opacity-80"src="images/tiramisu-express.jpg" alt="Vichyssoise de esparragos blancos">
</a>
<div class="col-span-full sm:col-span-7 mb:col-span-8"> <!-- el resto! -->
<div class="mb-2">Eduardo <span class="text-gray-300">|</span> <span class="text-gray-500">15/12/2021</span></div>
<p class="text-lg mb-6">Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem aliquam dolorem natus incidunt ex placeat
deserunt accusantium sapiente veniam sit dicta porro repellat praesentium, earum rerum? Dolorum officia
optio voluptas.</p>
<a class="text-white px-3 py-2 hover:bg-green-900 rounded-md uppercase text-sm bg-green-700" href="receta.html">Ver receta</a>
</div>
</div>
</article>
<div class="mt-16 mb-20 text-lg text-center">
<a class="hover:underline" href="recetas.html"><</a>
<span class="text-gray-400">1</span>
<span class="text-gray-500 mx-2 text-base">|</span>
<a class="hover:underline" href="recetas.html">2</a>
<span class="text-gray-500 mx-2 text-base">|</span>
<a class="hover:underline" href="recetas.html">3</a>
<span class="text-gray-500 mx-2 text-base">...</span>
<a class="hover:underline" href="recetas.html">12</a>
<a class="hover:underline" href="recetas.html">></a>
</div>
</main>
<div class="bg-black text-white py-8">
<footer class="container px-10">
Footer - 2021 ©
</footer>
</div>
</body>
</html>