-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
118 lines (115 loc) · 6.23 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
<!DOCTYPE html>
<html lang="pl">
<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>Document</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<nav class="flex items-center justify-between flex-wrap bg-red-500 p-6">
<div class="flex items-center flex-shrink-0 text-white mr-6">
<img class="w-12 mr-4" src="https://img.freepik.com/darmowe-wektory/ladny-fajny-kawalek-pizzy-w-okularach-kreskowka-wektor-ikona-ilustracja-jedzenie-wakacje-ikona-na-bialym-tle_138676-4808.jpg?w=740&t=st=1673334735~exp=1673335335~hmac=db3233a99b88cdf54462adbab5a85c764cffdbedf10c39390bc5651d861ac672" alt="">
<span class="font-semibold text-xl tracking-tight">Pizzeria u Władka</span>
</div>
<div class="block lg:hidden">
<button class="flex items-center px-3 py-2 border rounded text-teal-200 border-teal-400 hover:text-white hover:border-white">
<svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><title>Menu</title><path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/></svg>
</button>
</div>
<div class="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
<div class="text-sm lg:flex-grow">
<a href="index.html" class="block mt-4 lg:inline-block lg:mt-0 text-white hover:text-white mr-4">
Menu
</a>
<a href="order.html" class="block mt-4 lg:inline-block lg:mt-0 text-teal-200 hover:text-white mr-4">
zamów teraz
</a>
<a href="about.html" class="block mt-4 lg:inline-block lg:mt-0 text-teal-200 hover:text-white">
O nas
</a>
</div>
</div>
</nav>
<section class="bg-white dark:bg-gray-900">
<div class="grid max-w-screen-xl px-4 py-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12">
<div class="mr-auto place-self-center lg:col-span-7">
<h1 class="max-w-2xl mb-4 text-4xl font-extrabold tracking-tight leading-none md:text-5xl xl:text-6xl dark:text-white">Pizza która wywali cię z kapci :-)</h1>
<p class="max-w-2xl mb-6 font-light text-gray-500 lg:mb-8 md:text-lg lg:text-xl dark:text-gray-400">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sed neque vitae dolor porttitor ultricies. In ac vestibulum augue, a aliquet mauris. Quisque orci metus, dignissim vitae efficitur vitae, eleifend fringilla quam. Mauris gravida libero quis nibh ultricies, ac eleifend orci fringilla. Proin sit amet erat viverra, laoreet ante nec, eleifend diam.</p>
</div>
<div class="hidden lg:mt-0 lg:col-span-5 lg:flex">
<img src="http://t1.gstatic.com/licensed-image?q=tbn:ANd9GcSnCn9k-c100ccJnb6N8Odb8Ge-6iisByej4f6xu-rSmo4tKAxxcWz_AOgH8f1THy55" alt="mockup">
</div>
</div>
</section>
<section class="mx-auto w-[70%]">
<div class="relative overflow-x-auto shadow-md sm:rounded-lg">
<table class="w-full text-sm text-left text-gray-500 dark:text-gray-400 mt-4">
<thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr>
<th scope="col" class="px-6 py-3">
Nazwa pizzy
</th>
<th scope="col" class="px-6 py-3">
Rozmiar (cm)
</th>
<th scope="col" class="px-6 py-3">
cena
</th>
</tr>
</thead>
<tbody>
<tr class="bg-white border-b dark:bg-gray-900 dark:border-gray-700">
<th scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
Margarita
</th>
<td class="px-6 py-4">
32cm
</td>
<td class="px-6 py-4">
288zł
</td>
</tr>
<tr class="border-b bg-gray-50 dark:bg-gray-800 dark:border-gray-700">
<th scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
caprisioza
</th>
<td class="px-6 py-4">
40cm
</td>
<td class="px-6 py-4">
400zł
</td>
</tr>
<tr class="border-b bg-gray-50 dark:bg-gray-800 dark:border-gray-700">
<th scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
hawajska
</th>
<td class="px-6 py-4">
20cm
</td>
<td class="px-6 py-4">
150zł
</td>
</tr>
<tr class="border-b bg-gray-50 dark:bg-gray-800 dark:border-gray-700">
<th scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
ostry specjał
</th>
<td class="px-6 py-4">
182cm
</td>
<td class="px-6 py-4">
322zł
</td>
</tr>
</tbody>
</table>
</div>
</section>
<footer class="p-5 bg-red-500 text-white mt-8">
Zapraszamy do wizyty aleja wolności 5/30 warszawa <a href="github.com/antonisea" class="text-blue-300">Antoni Seba</a>
</footer>
</body>
</html>