-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
160 lines (134 loc) · 8.63 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
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Aeki</title>
<meta name="description" content="Meubles en bois design fait à la main par une équipe de passionnés">
<meta name="keywords" content="meubles,design,selfmade">
<link href="https://unpkg.com/tailwindcss/dist/tailwind.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Work+Sans:200,400&display=swap" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link rel="shortcut icon" type="image/x-icon" href="/javascript.png">
<script src="https://use.fontawesome.com/f9caa2a9a3.js"></script>
</head>
<body class="bg-white text-gray-600 work-sans leading-normal text-base tracking-normal">
<nav id="header" class="w-full z-30 top-0 py-1">
<div class="w-full container mx-auto flex flex-wrap items-center justify-between mt-0 px-6 py-3">
<label for="menu-toggle" class="cursor-pointer md:hidden block">
<svg class="fill-current text-gray-900" xmlns="http://www.w3.org/2000/svg" width="20" height="20"
viewBox="0 0 20 20">
<title>menu</title>
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"></path>
</svg>
</label>
<input class="hidden" type="checkbox" id="menu-toggle" />
<div class="hidden md:flex md:items-center md:w-auto w-full order-3 md:order-1" id="menu">
<nav>
<ul class="md:flex items-center justify-between text-base text-gray-700 pt-4 md:pt-0">
<li><a class="inline-block no-underline hover:text-black hover:underline py-2 px-4"
href="/">Shop</a></li>
</ul>
</nav>
</div>
<div class="order-1 md:order-2">
<a class="flex items-center tracking-wide no-underline hover:no-underline font-bold text-gray-800 text-xl "
href="#">
<svg class="fill-current text-gray-800 mr-2" xmlns="http://www.w3.org/2000/svg" width="24"
height="24" viewBox="0 0 24 24">
<path
d="M5,22h14c1.103,0,2-0.897,2-2V9c0-0.553-0.447-1-1-1h-3V7c0-2.757-2.243-5-5-5S7,4.243,7,7v1H4C3.447,8,3,8.447,3,9v11 C3,21.103,3.897,22,5,22z M9,7c0-1.654,1.346-3,3-3s3,1.346,3,3v1H9V7z M5,10h2v2h2v-2h6v2h2v-2h2l0.002,10H5V10z" />
</svg>
aeki
</a>
</div>
<div class="order-2 md:order-3 flex items-center relative" id="nav-content">
<div id="cart-qty" class="absolute rounded-full h-5 w-5 flex items-center justify-center bg-transparent text-white text-xs top-4 left-1">
<span class="mr-px">0</span>
</div>
<a class="pl-3 inline-block no-underline hover:text-black" href="/pages/cart.html">
<svg class="fill-current hover:text-black" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24">
<path
d="M21,7H7.462L5.91,3.586C5.748,3.229,5.392,3,5,3H2v2h2.356L9.09,15.414C9.252,15.771,9.608,16,10,16h8 c0.4,0,0.762-0.238,0.919-0.606l3-7c0.133-0.309,0.101-0.663-0.084-0.944C21.649,7.169,21.336,7,21,7z M17.341,14h-6.697L8.371,9 h11.112L17.341,14z" />
<circle cx="10.5" cy="18.5" r="1.5" />
<circle cx="17.5" cy="18.5" r="1.5" />
</svg>
</a>
</div>
</div>
</nav>
<section class="w-full mx-auto bg-nordic-gray-light flex pt-12 md:pt-0 md:items-center bg-cover bg-right"
style="max-width:1600px; height: 32rem; background-image: url('https://images.unsplash.com/photo-1616464598304-211e2e1b08b9?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1634&q=80');">
<div class="container mx-auto">
<div class="flex flex-col w-full lg:w-1/2 justify-center items-start px-6 tracking-wide">
<h1 class="text-black text-2xl my-4">Our work is inspired by the stunning nordic minimalist design</h1>
<a class="text-xl inline-block no-underline border-b border-gray-600 leading-relaxed hover:text-black hover:border-black"
href="#store">products</a>
</div>
</div>
</section>
<section class="bg-white py-8">
<div class="container mx-auto flex items-center flex-wrap pt-4 pb-12">
<nav id="store" class="w-full z-30 top-0 px-6 py-1">
<div class="w-full container mx-auto flex flex-wrap items-center justify-between mt-0 px-2 py-3">
<a class="uppercase tracking-wide no-underline hover:no-underline font-bold text-gray-800 text-xl "
href="#">
Store
</a>
</div>
</nav>
<div class="container mx-auto flex items-center flex-wrap pt-4 pb-12" id ="products"></div>
</div>
</section>
<section class="bg-white py-8">
<div class="container py-8 px-6 mx-auto">
<a class="uppercase tracking-wide no-underline hover:no-underline font-bold text-gray-800 text-xl mb-8"
href="#">
About
</a>
<p class="mt-8 mb-8">Our work is inspired by the stunning nordic minimalist design:
<p class="mb-8">Lorem ipsum dolor sit amet, consectetur <a href="#">random link</a> adipiscing elit, sed
do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vel risus commodo viverra maecenas
accumsan lacus vel facilisis volutpat. Vitae aliquet nec ullamcorper sit. Nullam eget felis eget
nunc lobortis mattis aliquam. In est ante in nibh mauris. Egestas congue quisque egestas diam in.
Facilisi nullam vehicula ipsum a arcu. Nec nam aliquam sem et tortor consequat. Eget mi proin sed
libero enim sed faucibus turpis in. Hac habitasse platea dictumst quisque. In aliquam sem fringilla
ut. Gravida rutrum quisque non tellus orci ac auctor augue mauris. Accumsan lacus vel facilisis
volutpat est velit egestas dui id. At tempor commodo ullamcorper a. Volutpat commodo sed egestas
egestas fringilla. Vitae congue eu consequat ac.</p>
</div>
</section>
<footer class="container mx-auto bg-white py-8 border-t border-gray-400">
<div class="container flex px-3 py-8 ">
<div class="w-full mx-auto flex flex-wrap">
<div class="flex w-full lg:w-1/2 ">
<div class="px-3 md:px-0">
<h3 class="font-bold text-gray-900">Développement</h3>
<p class="py-4">
Ce projet est totalement fictif. Aucune donnée n'est collectée ou enregistrée lors du passage d'une commande.
<br>Le code source du front-end est la propriété de <a href="https://www.leogrambert.fr">https://www.leogrambert.fr</a> et ne peut pas être utilisé sans mon accord.
<br>Pour plus d'informations : <a class="underline" href="https://www.leogrambert.fr/contact">Contactez-moi</a>
</p>
</div>
</div>
<div class="flex w-full lg:w-1/2 lg:justify-end lg:text-right">
<div class="px-3 md:px-0">
<h3 class="font-bold text-gray-900">Social</h3>
<ul class="list-reset items-center pt-3">
<li>
<a class="ml-1 mr-1" href="https://www.linkedin.com/in/leogrambert/" title="Profil Linkedin"><i class="fa fa-linkedin-square fa-2x" aria-hidden="true"></i></a>
<a class="ml-1 mr-1" href="https://gitlab.com/Leo-Grambert" title="Profil Gitlab"><i class="fa fa-gitlab fa-2x" aria-hidden="true"></i></a>
<a class="ml-1 mr-1" href="https://github.com/LeoGrambert" title="Profil Github"><i class="fa fa-github-square fa-2x" aria-hidden="true"></i></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<script src="/polyfill.bundle.js"></script>
<script src="/app.bundle.js"></script>
</body>
</html>